【问题标题】:bind draggable marker with polyline google map将可拖动标记与折线谷歌地图绑定
【发布时间】:2020-11-10 12:05:30
【问题描述】:

您好,我在标记与折线之间有连接,例如这个 Image 。我在这里附上一个样本。

我添加了带有标记的折线。我在“点击”事件上绘制折线和标记。基本上标记带有编号的路径。我实际上想要什么 - 我能够分别编辑折线和标记,但我想将标记与折线绑定。当我拖动标记折线时,也应该用标记拖动。你可以看看我的code

【问题讨论】:

    标签: javascript reactjs google-maps-markers google-polyline google-maps-react


    【解决方案1】:

    我已经使用标记“拖动”事件解决了这个问题。在拖动事件中,我正在用新路径重绘折线。像这样。

       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);
      });
    

    【讨论】:

      猜你喜欢
      • 2011-08-07
      • 2016-08-30
      • 1970-01-01
      • 2015-08-05
      • 1970-01-01
      • 2016-04-10
      • 2012-08-07
      • 2015-01-28
      • 1970-01-01
      相关资源
      最近更新 更多