使用折线 google 地图绑定可拖动标记
bind draggable marker with polyline google map
您好,我在标记与折线之间建立了联系,就像这张图片。我在这里附上一个样本。
我添加了带有 marker.i 的折线,正在 'click' 事件上绘制折线和标记。基本上标记带有编号路径。我真正想要的 - 我可以分别编辑多段线和标记,但我想将标记与多段线绑定。当我拖动标记时,poyline 也应该与标记一起拖动。你可以看看我的 code
我已经使用标记 'drag' 事件解决了这个问题。在拖动事件中,我正在用新路径重新绘制多段线。就像这样。
google.maps.event.addListener(marker, "drag", (mark) => {
let lat = mark.latLng.lat().toString();
let lng = mark.latLng.lng().toString();
this.setState((state) => ({
...state,
lattitude: lat,
longitude: lng,
}));
let newPath = polyPath;
newPath[marker.index-1] = mark.latLng;
poly.setMap(null);
poly = new google.maps.Polyline({
strokeColor: "orange",
strokeOpacity: 1.0,
strokeWeight: 5,
path: newPath,
geodesic:false,
});
poly.setMap(map);
});
您好,我在标记与折线之间建立了联系,就像这张图片。我在这里附上一个样本。
我添加了带有 marker.i 的折线,正在 'click' 事件上绘制折线和标记。基本上标记带有编号路径。我真正想要的 - 我可以分别编辑多段线和标记,但我想将标记与多段线绑定。当我拖动标记时,poyline 也应该与标记一起拖动。你可以看看我的 code
我已经使用标记 'drag' 事件解决了这个问题。在拖动事件中,我正在用新路径重新绘制多段线。就像这样。
google.maps.event.addListener(marker, "drag", (mark) => {
let lat = mark.latLng.lat().toString();
let lng = mark.latLng.lng().toString();
this.setState((state) => ({
...state,
lattitude: lat,
longitude: lng,
}));
let newPath = polyPath;
newPath[marker.index-1] = mark.latLng;
poly.setMap(null);
poly = new google.maps.Polyline({
strokeColor: "orange",
strokeOpacity: 1.0,
strokeWeight: 5,
path: newPath,
geodesic:false,
});
poly.setMap(map);
});