在谷歌地图api v3上旋转.gif图像？

本文介绍了在谷歌地图api v3上旋转.gif图像？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述 限时删除！！ 我在这个问题上找到了很多答案，但没有一个在使用.gif图片而不是标记时有用。为了使用.gif图像（也是动画gif），我使用了代码（它可以） I find lots of answers on this question but not one that works when using .gif images and not markers. To use .gif images (and also animated gifs) I use code (which works)var image = { url: 'img/RedFlashYacht.gif', size: new google.maps.Size(75, 75), origin: new google.maps.Point(0, 0), anchor: new google.maps.Point(0, 32), scaledSize: new google.maps.Size(50, 50)};marker = new google.maps.Marker({ position: pos , map: map, icon: image, store_id: mkrID, optimized: false});//for anyone who has not used .gif, the line 'optimized: false' is criticalWhat I want to do now is rotate the gif image (to a specified angle, not a constant rotate [that I can do as animated gif]). Dispite setting the ID for the image with 'store_id: mkrID,' var mkrID being previously created, and I can read it back with code marker.get('store_id') so I know it's been set. I cannot access the image with document.getElementById. nor can I get any of the google maps API rotate eample code to work either. Examples I find seem to be for v2 or relate to google maps own markers, not custom images using a gif.Has anyone been able to rotate a gif image in a google map? 解决方案 The "store_id" property of the marker doesn't give you access to the DOM element which contains the image. If you have a unique icon for each marker, you can grab it using its URL with JQuery, then apply a CSS transform to it:$('img[src="http://www.geocodezip.com/mapIcons/boat-10-64.gif"]').css({ 'transform': 'rotate(45deg)'});Note: this will only work for markers with optimized: falseproof of concept fiddleproof of concept fiddle rotating a .png imagecode snippet:function initialize() { var map = new google.maps.Map( document.getElementById("map_canvas"), { center: new google.maps.LatLng(37.47949, -122.083168), zoom: 13, mapTypeId: google.maps.MapTypeId.ROADMAP }); var image = { url: 'http://www.geocodezip.com/mapIcons/boat-10-64.gif', size: new google.maps.Size(75, 75), origin: new google.maps.Point(0, 0), anchor: new google.maps.Point(0, 32), scaledSize: new google.maps.Size(50, 50) }; var marker = new google.maps.Marker({ position: map.getCenter(), map: map, icon: image, store_id: "mkrID", optimized: false }); var rotationAngle = 10; google.maps.event.addListenerOnce(map, 'idle', function() { setInterval(function() { $('img[src="http://www.geocodezip.com/mapIcons/boat-10-64.gif"]').css({ 'transform': 'rotate(' + rotationAngle + 'deg)' }); rotationAngle += 10; }, 1000); });}google.maps.event.addDomListener(window, "load", initialize);html,body,#map_canvas { height: 100%; width: 100%; margin: 0px; padding: 0px}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><script src="https://maps.googleapis.com/maps/api/js"></script><div id="map_canvas"></div> 这篇关于在谷歌地图api v3上旋转.gif图像？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！ 1403页，肝出来的..