谷歌地图 - 动画

作者: 子阳
发布时间: 2024-08-17 06:48:44 (6天前)
转自：

3 条回复

0#
回复此人
没身份别烦我 | 2019-08-31 10-32

<div class =“post-text”itemprop =“text”> <P> 试试这个...（更改第34行中的标记图标路径） </p> <pre> <code> <html> <head> <style type="text/css"> html { height: 100% } body { height: 100%; margin: 0; padding: 0 } #map_canvas { height: 100% } </style> <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBdTuWJjEUMvQZ6VVPGksE12XNgQgs__Qk&sensor=false&libraries=visualization"></script> <script language="javascript"> var myLatlng = new google.maps.LatLng(41.7833, 5.2167); var markersArray = [ new google.maps.LatLng(20.11, 73.06), new google.maps.LatLng(10.11, 77.18), new google.maps.LatLng(33.11, 75.18), new google.maps.LatLng(25.11, 77.18), new google.maps.LatLng(31.37, 74.55), new google.maps.LatLng(22.56, 88.36), new google.maps.LatLng(12.98, 77.58) ]; var markers = []; var iterator = 0; var map; var image = '/home/aravi/heatmap/gdot.png' ; function drop() { for ( i = 0; i < markersArray.length; i++) { setTimeout(function() { addMarker(); }, i*300); } } function addMarker() { markers.push(new google.maps.Marker({ position: markersArray[iterator], map: map, draggable: false, opacity: 0.5, // animation: google.maps.Animation.DROP, icon: image })); iterator++; } function view() { var styles = [ { stylers: [ { hue: "#e0e0e0" }, { saturation: -100 }, {invert_lightness: false} ] },{ featureType: "all", elementType: "geometry.fill", stylers: [ { visibility: "on" } ] } ]; var mapOptions = { zoom:2, center: myLatlng, mapTypeId: google.maps.MapTypeId.ROADMAP, opacity: 0.2, draggable: false, disableDefaultUI: true, styles: styles }; map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions); drop (); } </script> </head> <body onLoad="view()"> <div id="map_canvas" style="width:53%; height:70%; margin-left: 500px; margin-top: 38px;"> </div> </body> </html> </code> </pre> </DIV>

编辑
1#
回复此人
不易青年。 | 2019-08-31 10-32

<div class =“post-text”itemprop =“text”> <P> 把它放在一个单独的 <code> function </code> 例如 <code> addMarker() </code> </p> <pre> <code> function addMarker() { var marker = new google.maps.Marker({ map: map, position: point, icon: '1364428325_golf.png', animation: google.maps.Animation.DROP, shadow: icon.shadow }); } </code> </pre> <P> 然后打电话 <code> addMarker() </code> 在你的 <code> setTimeout() </code> 功能 </p> <P> 在你的代码中，我无法看到你在setTimeOut（）中描述的方法标记（） </p> <P> 你可以随时访问 <a href="https://gist.github.com/donpaul120/dc97f4ec4785521b3a66" rel="nofollow"> https://gist.github.com/donpaul120/dc97f4ec4785521b3a66 </A> 并实现它。 </p> <P> 我希望这有帮助... </p> </DIV>

编辑

登录后才能参与评论