10

I am trying to animate a marker from one GPS coordinate to another. I am currently using Google Maps to achieve this and, although my algorithm seems right, Google Maps is doing a poor job at converting the GPS position to the right pixel on the map, which makes the animation not so smooth when the map is zoomed out. Zoomed in, it is very smooth and that's why I suspect the "zig zag" is caused by Google doing a poor LatLng->pixel conversion.

The best solution would be for me to deal directly with the markers (x,y) pixel coordinates but there is unfortunately no public method for assigning pixel location to a marker.

The code is available here: http://dev.syskall.com/map/

How would you make the animation smoother when zoomed out? Alternatively, I would be interested in using an equivalent to Google Maps that would let me accomplish what I'm trying to do if it isn't possible with Google Maps.

PS: I am not sure if this is the right place to ask my question, let me know if it isn't the case.

8

v2 http://econym.org.uk/gmap/example_cartrip.htm

v3 http://plebeosaur.us/etc/map/ (works best with iphone) you can use your raw gps data.

tip - use actual geographical coordinates rather than pixel coordinates as they are rounded up (2 decimal places) & geographical coordinates uses 6 d.p.

|improve this answer|||||
2

You can use marker-animate-unobtrusive library to make markers smoothly transition from one location to another.

You could initialize your marker like that:

var marker = new SlidingMarker({
   //your original marker options
   //...
});

So your marker will animate from starting location to given one on this call:

marker.setPosition(givenPosition);

P.S. I'm the author of the library.

|improve this answer|||||
  • Does your library have ability to rotate the icon to an angle? based on last lat, lon moving to the next lat lon? – Tim Maxey Aug 23 '16 at 17:32
  • See discussion here. There's event raised for each animation step, where you can get coordinates and try to rotate your marker. – viskin Aug 24 '16 at 16:24
1

You can check this too: http://mypersonalsoft.blogspot.com/2012/02/simulating-moving-targets-in-google.html

A target is made to slowly move in the google maps simulating a GPS target.

|improve this answer|||||
1

You could also consider the following approach:

  • generate a marker collection between two coordinates per every location
  • toggle a specific marker using marker.setVisibility(value) function

Complete example

JSFiddle

|improve this answer|||||

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.