Reputation: 157
I'm using bing maps ajax v7. On map zoom/pan the pushpins seem to be animating/rendering needlessly. They are not anchored statically to their coordinates as they should be or previously were (before zoom/pan) and on zoom/pan they seem to be animating/rendering from a different position off screen.
This happens in all browsers (Mac: [Chrome, FF, Safari], Windows: [IE, Chrome, FF]).
Seems to be similar to this SO Q: Virtual Earth (Bing) Pin "moves" when zoom level changes - but different api version and the scale solution isn't applicable.
Anyone run into this?
Upvotes: 0
Views: 792
Reputation: 36
I was running into this exact issue. When I would zoom out or pan, the pushpins would animate every time, making for a terrible user experience. I found out that I had some global styles being applied to my site to make links animate into position when I scaled the browser. This may come default in some style sheet boilerplate. This was the offending style
a {
-webkit-transition: all 0.5s ease;
/* For Chrome <= 25, Safari <= 6.0, iOS Safari <= 6.1, Android Browser <= 4.3 */
-moz-transition: all 0.5s ease;
/* For Firefox <= 15 */
-o-transition: all 0.5s ease;
/* For Opera <= 12 */
transition: all 0.5s ease; }
I targeted the map pushpins directly by applying the following style:
/* Prevent a tag inside of map to animate */
.MapPushpinBase {
-webkit-transition: none;
-moz-transition: none;
-o-transition: none;
transition: none;}
which effectively removes the CSS animations on the pushpins.
Problem solved (for me)
Upvotes: 2