Reputation: 5954
I have placed a marker for my location. I would like to move my marker smoothly something like the Google maps app. The blue circle moves very smoothly when I keep moving in my car. I would like implement the same for my app. how do I implement this on my app?
As of now my location marker just jumps for different location on very location change and marks the marker there.
Here is what I have don:
googleMap.setMyLocationEnabled(true);
So onMyLocationChange method is called automatically:
@Override
public void onMyLocationChange(Location location)
{
curlat = location.getLatitude();
curlong = location.getLongitude();
if (markermylocation != null)
{
markermylocation.remove();
}
curlat = location.getLatitude();
curlong = location.getLongitude();
myLocation(curlat, curlong, username, imageURL, ZOOMVALUE);
}
in mylocaiton method:
private void myLocation(double lat, double lng, String name, String url, float zoom)
{
if(firsttime == 1)
{
LatLng ll = new LatLng(lat,lng);
CameraUpdate update = CameraUpdateFactory.newLatLngZoom(ll, zoom);
googleMap.animateCamera(update);
firsttime = 0;
}
final String uname = name;
curlat = lat;
curlong = lng;
LatLng position = new LatLng(curlat, curlong);
markerOptionsmylocaiton = new MarkerOptions().position(position).icon(BitmapDescriptorFactory.fromBitmap(icon)).title(uname).anchor(0.5f, 1f);
markermylocation = googleMap.addMarker(markerOptionsmylocaiton);
LatLng latlang = new LatLng(curlat, curlong);
animateMarker(markermylocation, latlang, false);
}
So everytime mylocation is called the marker gets removed and calls mylocation method and then creates the marker in the new postition. Instead I would like to get a smooth transition of the marker like Google maps? How to implement this?
Update:
After working couple of times on this: I came to this code finally but then my markers are not showing up:
I am using the below method and calling this every time in myLocation method.
public void animateMarker(final Marker marker, final LatLng toPosition,
final boolean hideMarker)
{
final Handler handler = new Handler();
final long start = SystemClock.uptimeMillis();
Projection proj = googleMap.getProjection();
Point startPoint = proj.toScreenLocation(marker.getPosition());
final LatLng startLatLng = proj.fromScreenLocation(startPoint);
final long duration = 500;
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);
}
}
}
});
}
Thanks!
Upvotes: 12
Views: 16046
Reputation: 1123
Hi I have also the same thing in one of my project and it works like charm.
Add the below piece of code after this line :
marker.setPosition(new LatLng(lat, lng));
//this code
if (googleMap != null)
googleMap.animateCamera(CameraUpdateFactory.newLatLngZoom(new LatLng(lat, lng), 15.0f));
Hope it will help you. Thanks
Upvotes: 3
Reputation: 5651
You'll have to use an interpolator a linear or maybe an acceleration interpolator between the new latlng of the location and the current latlng of the marker. Here's an example with a bounce interpolator.
final Handler handler = new Handler();
final long start = SystemClock.uptimeMillis();
final long duration = 2500;
final Interpolator interpolator = new BounceInterpolator();
marker.setVisible(true);
handler.post(new Runnable() {
@Override
public void run() {
long elapsed = SystemClock.uptimeMillis() - start;
float t = Math.max(
1 - interpolator.getInterpolation((float) elapsed
/ duration), 0);
marker.setAnchor(0.5f, 1.0f + 6 * t);
marker.setPosition(latlng)
if (t > 0.0) {
// Post again 16ms later.
handler.postDelayed(this, 16);
}
}
});
Upvotes: 1