Google map: moving marker and map together smoothl

Question

I have to show real time/live user moving location in google map once user turn on the feature and up-to terminating it.

I have had used the method below to animate the marker.

 private void animateMarker(final Marker marker, final LatLng toPosition,
                              final boolean hideMarker) {
        final Handler handler = new Handler();
        final long start = SystemClock.uptimeMillis();
        Projection proj = mMap.getProjection();
        Point startPoint = proj.toScreenLocation(marker.getPosition());
        final LatLng startLatLng = proj.fromScreenLocation(startPoint);
        final long duration = 1000;

        final Interpolator interpolator = new LinearInterpolator();
        handler.post(new Runnable() {
            @Override
            public void run() {
                long elapsed = SystemClock.uptimeMillis() - start;
                float t = interpolator.getInterpolation((float) elapsed
                        / duration);
                double lng = t * toPosition.longitude + (1 - t)
                        * startLatLng.longitude;
                double lat = t * toPosition.latitude + (1 - t)
                        * startLatLng.latitude;
                marker.setPosition(new LatLng(lat, lng));

                if (t < 1.0) {
                    // Post again 16ms later.
                    handler.postDelayed(this, 16);
                } else {
                    if (hideMarker) {
                        marker.setVisible(false);
                    } else {
                        marker.setVisible(true);
                    }
                }
            }
        });
    }

And using the following code am moving the map too.

 // Showing the current location in Google Map
 mMap.moveCamera(CameraUpdateFactory.newLatLng(latLng));
 // Zoom in the Google Map
 mMap.animateCamera(CameraUpdateFactory.zoomTo(15));

What I had done so far isn't good enough to move the marker and map together. it's not looking that perfect. I have to move the map along with marker together.

Source Code

Thank you.

Answer 1

• What I done in my similar project is like: Assume I have a list of point where user navigated one by one so, I want to display that trip in map with animation. Instead of moving both marker and camera same time you can move marker between two points and then animate camera to that second point, now again move marker to next point and then when marker reach out next point animate your camera.

To get this working you have to modify your code little bit. Add this code:

    private static final int ANIMATE_SPEEED_TURN = 1000;
    private static final int BEARING_OFFSET = 20;    

    if (t < 1) {
            mHandler.postDelayed(this, 16);
        } else {

         // your code
         if (hideMarker) {
                    marker.setVisible(false);
                } else {
                    marker.setVisible(true);
                }


         //my added code
                LatLng begin = getBeginLatLng();// current point
                LatLng end = getEndLatLng();// next point

                float bearingL = bearingBetweenLatLngs(begin, end);  

                CameraPosition cameraPosition =
                        new CameraPosition.Builder()
                                .target(end)
                                .bearing(bearingL + BEARING_OFFSET)
                                .tilt(tilt)
                                .zoom(googleMap.getCameraPosition().zoom)
                                .build();

                googleMap.animateCamera(
                        CameraUpdateFactory.newCameraPosition(cameraPosition),
                        ANIMATE_SPEEED_TURN,
                        null
                );

                mHandler.postDelayed(animator, 16);

            }

Let me know If anything goes wrong!!! For detailed step visit Animating the map