0

创建多边形后,编辑多边形似乎不起作用。

代码 :

function MyMap() {
  const [coords, setCoords] = useState([]);

  // This function runs after the annotation is drawn
  const created = (e) => {
    const coordsList = e.layer.editing.latlngs[0][0];
    console.log("coordsList:", coordsList);

    const newArr = coordsList.map((coord) => ({
      Lat: coord.lat,
      Long: coord.lng,
    }));
    setCoords(newArr);
  };
    
  return (
    <div className="mapview">
      <div className="myMap">
        <Map center={[0, 0]} zoom={1}>
          <FeatureGroup>
            <EditControl
              position="topright"
              draw={{
                rectangle: false,
                circle: false,
                circlemarker: false,
                polyline: false,
              }}
              onCreated={created}
            />
          </FeatureGroup>
          <ImageOverlay
                bounds={[
                  [0, 0],
                  [256, 256],
                ]}
                url={`data:image/png;base64,${image}`}
              />
                { coords.map((poly) => {
                  return (
                      <Polygon positions={poly.myCoords}>
                  }
        </Map>
      </div>
    </div>
  );
}

注释已创建,然后如果我尝试通过单击右上角的编辑图标对其进行编辑。但不幸的是,编辑按钮似乎不起作用或触发编辑。

4

0 回答 0