Google Maps JS API v3 and looping animated gif'

2019-03-04 02:23发布

站内问答 / JavaScript
1535 1 4

I can't seem to loop animated gifs with the Google Maps API. It plays the animation the first time around but will not play it again after that.

Can anyone point me in the right direction? I have a lot of code in this file so I have dragged out the important bits, I'll happily put up some more if needed.

var marker = new google.maps.MarkerImage(
    'library/img/gmap_marker.gif',
    new google.maps.Size(100, 100),
    new google.maps.Point(0, 0),
    new google.maps.Point(100, 100)
);

var shadow = new google.maps.MarkerImage(
    'library/img/gmap_shadow.png',
    new google.maps.Size(100, 100),
    new google.maps.Point(0, 0),
    new google.maps.Point(100, 100)
);

// set the personmarker
var person = new google.maps.Marker({
    position: currentPos,
    icon: marker,
    draggable: false,
    raiseOnDrag: false,
    shadow: shadow,
    animation: google.maps.Animation.DROP,
    map: app.map,
    optimized: false
});

1条回答
老娘就宠你
2楼-- · 2019-03-04 02:58

Key is to set optimized: false, but since you already have and its not working - I tested to create own simple example and it worked.

<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
    <meta charset="utf-8">
    <title>Google Maps JavaScript API v3 Example: Marker Simple</title>
    <link href="https://google-developers.appspot.com/maps/documentation/javascript/examples/default.css" rel="stylesheet">
    <script src="http://maps.googleapis.com/maps/api/js?v=3&sensor=false"></script>
    <script>
      function initialize() {
        var myLatlng = new google.maps.LatLng(-25.363882,131.044922);
        var mapOptions = {
          zoom: 4,
          center: myLatlng,
          mapTypeId: google.maps.MapTypeId.ROADMAP
        }
        var map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);

        var marker = new google.maps.Marker({
            position: myLatlng,
            map: map,
            title: 'Hello World!',
            icon: "http://gwtportlets.googlecode.com/svn-history/r46/trunk/src/org/gwtportlets/portlet/public/img/portlet-loading-32x32.gif",
          optimized: false
        });
      }
    </script>
  </head>
  <body onload="initialize()">
    <div id="map_canvas">

    </div>
   </body>
</html>

Edit it as you please to suit your needs, you can also try to swap using of google.maps.MarkerImage to google.maps.icon because MarkerImage seems to be deprecated see : MarkerImage and Icon.

Good luck with da code.!

查看更多
0人赞 添加讨论(0) 举报
登录 后发表回答
相关问题
查看全部
相关文章
查看全部
收藏的人(4)