Google Maps JS API v3和循环动画gif [英] Google Maps JS API v3 and looping animated gif's
问题描述
我似乎无法使用Google Maps API循环播放GIF动画。它首次播放动画，但之后不会再播放。
任何人都可以指出正确的方向吗？我在这个文件中有很多代码，所以我拖出了一些重要的内容，如果需要的话，我会很乐意提供一些。
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'，
google.maps.Size（100，100），
new google.maps.Point（0，0），
new google.maps.Point（100，100）
）;
//设置personmarker
var person = new google.maps.Marker（{
position：currentPos，
图标：marker，
draggable： false，
raiseOnDrag：false，
shadow：shadow，
动画：google.maps.Animation.DROP，
map：app.map，
优化：false
}）;
关键是设置优化：false ，但是既然你已经有了，而且它没有工作 - 我测试过创建自己的简单例子，它工作。 code><！DOCTYPE html>
< html>
< head>
< meta name =viewportcontent =initial-scale = 1.0，user-scalable = no>
< meta charset =utf-8>
< title> Google Maps JavaScript API v3示例：Marker Simple< / title>
< link href =https://google-developers.appspot.com/maps/documentation/javascript/examples/default.css =stylesheet>
< script src =http://maps.googleapis.com/maps/api/js?v=3&sensor=false>< / script>
< script>
函数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！'，
图标：http://gwtportlets.googlecode.com/svn-history/r46/trunk/src/org/gwtportlets/portlet/public/img/portlet-loading-32x32.gif，
优化：false
}）;
}
< / script>
< / head>
< body onload =initialize（）>
< div id =map_canvas>
< / div>
< / body>
< / html>
您可以根据自己的需要进行编辑，也可以尝试使用 google.maps.MarkerImage 转换为 google.maps.icon ，因为MarkerImage似乎不推荐使用，请参阅：MarkerImage 和图标。
祝大家好运！
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
});
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.!
这篇关于Google Maps JS API v3和循环动画gif的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
