gpt4 book ai didi

javascript - 如何触发点击事件以在谷歌地图绘图管理器功能中选择每个图?

转载 作者:行者123 更新时间:2023-11-28 04:28:22 25 4
gpt4 key购买 nike

我正在使用谷歌地图 javascript api 为运行者创建实验室。我需要设置标记图标来单击每个绘图点。在这种情况下,我可以画一条线,但无法在每个图中设置图标。如何实现这一目标?我花了一周的时间才完成这项工作。

const me = this;
const drawingManager = new google.maps.drawing.DrawingManager({
drawingMode: google.maps.drawing.OverlayType.POLYLINE,
drawingControl: false,
circleOptions: {
fillColor: '#a8aaa9',
fillOpacity: 0.3,
strokeWeight: 0,
clickable: false,
editable: true,
zIndex: 1,
},
});

drawingManager.setMap(this.map);

google.maps.event.addListener(drawingManager, 'overlaycomplete', OverlayCompleteEvent => {
const bounds = OverlayCompleteEvent.overlay.getPath().getArray();
me.setState({
collectedCordinates: bounds,
});
});

google.maps.event.addListener(drawingManager, 'click', function(){
// not firing here
});

最佳答案

来自 Google Maps API 文档:

Note that google.maps.Map events, such as click and mousemove are disabled while drawing on the map.

Drawing Layer(Library)

如果我正确地实现了您的目标,您可以通过添加图标来尝试(在本例中 - 每个图的标记):

  google.maps.event.addListener(drawingManager, 'overlaycomplete', OverlayCompleteEvent => {
const bounds = OverlayCompleteEvent.overlay.getPath().getArray();
me.setState({
collectedCordinates: bounds,
});

bounds.map((coord, i)=>{
const marker = new google.maps.Marker({
position: {lat: coord.lat(), lng: coord.lng()},
map: map,
title: 'marker ' + i
})
});
});

关于javascript - 如何触发点击事件以在谷歌地图绘图管理器功能中选择每个图?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44844522/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com