我想制作地图API 偶像缩放大小 像在JSFIDLE中一样工作 https://jsfiddle.net/z2mzzry4/1/ ,但我不能。图标的大小保持不变。
我的工作代码如下:
<!DOCTYPE html> <html> <head> <title>Simple Map</title> <meta name="viewport" content="initial-scale=1.0"> <meta charset="utf-8"> <style> #map { height: 100%; } html, body { height: 100%; margin: 0; padding: 0; } </style> </head> <body> <div id="map"></div> <script> var map; function initMap() { map = new google.maps.Map(document.getElementById('map'), { center: {lat: -3.5679, lng: -39.12}, zoom: 8 }); var marker2 = new google.maps.Marker ({ position: new google.maps.LatLng(-3.5679, -39.12), title: 'Sample 2', draggable: false, map: map, icon: 'http://icons.iconarchive.com/icons/paomedia/small-n-flat/48/map-marker-icon.png', }); marker2.icon.scaledSize = new google.maps.Size(2 * 50, 2 * 50); var marker3 = new google.maps.Marker ({ position: new google.maps.LatLng(-3.5679, -39.1295), title: 'Sample 3', draggable: false, map: map, icon: 'http://icons.iconarchive.com/icons/paomedia/small-n-flat/48/map-marker-icon.png', }); marker3.icon.scaledSize = new google.maps.Size(3 * 50, 3 * 50); } </script> <script async defer src="https://maps.googleapis.com/maps/api/js?key=MYKEY&callback=initMap"></script> </body> </html>
我浏览了很多网站,但我不知道问题出在哪里。
怎么了?
如果将对象文字而不是字符串传递给构造函数中的icon属性,则应该可以解决此问题
var marker2 = new google.maps.Marker({ position: new google.maps.LatLng(-3.5679, -39.12), title: 'Sample 2', draggable: false, map: map, icon: { url: 'http://icons.iconarchive.com/icons/paomedia/small-n-flat/48/map-marker-icon.png' } }); marker2.icon.scaledSize = new google.maps.Size(2 * 50, 2 * 50);