我正在使用 Google maps api 3 来允许用户使用绘图工具在 map 上动态绘制标记。 (引用 here)
我希望用户能够绘制多个具有不同图标的标记。 例如,他应该能够绘制学校标记、医院标记等。每个图标都会不同。
This是我希望用户绘制的内容。
在文档中,它显示所有标记都将具有相同的图标。
代码:
$(document).ready(function(){
var drawingManager;
var marker = new google.maps.Marker({});
var map;
function initialize() {
var mapOptions = {
center: new google.maps.LatLng(21.0000, 78.0000),
zoom: 4
};
map = new google.maps.Map(document.getElementById('map-canvas'),
mapOptions);
drawingManager = new google.maps.drawing.DrawingManager({
drawingMode: google.maps.drawing.OverlayType.MARKER,
drawingControl: true,
markerOptions:{
draggable: true,
},
drawingControlOptions: {
position: google.maps.ControlPosition.TOP_CENTER,
drawingModes: [
google.maps.drawing.OverlayType.MARKER
]
}
});
drawingManager.setMap(map);
google.maps.event.addListener(drawingManager, 'overlaycomplete', function(event) {
var latlng = event.overlay.getPosition()
console.log(latlng);
});
}
google.maps.event.addDomListener(window, 'load', initialize);
});
有解决办法吗?
最佳答案
用所需的 Icon
更新 DrawingManager
实例的 markerOptions
属性
基本用法:
drawingManagerInstance.setOptions({markerOptions:
{icon:'path/to/another/marker.png'}});
关于javascript - 绘图库 : Dynamically drawing different markers in Google maps api 3,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24281260/