Question

我有一个包含geoJSON图层组的传单，并加载了几个geoJSON功能，每个功能作为单独的图层添加到geoJSON图层组中。对于给定的选定图层，我需要使用javascript在该图层上移动多边形的点。因此，例如，我可能需要将第三个顶点移动到30.123，-80.123。我不知道该怎么做。我可以使用setLatLng（）方法轻松移动标记，但是找不到改变多边形点的任何东西。

以下是我如何创建地图并添加我的geoJSON功能的示例：

   function createMap(){ 
    myMap = L.map('locationMap', {
                editable: true,
                attributionControl: false,
                fullscreenControl: true,
                fullscreenControlOptions: {
                    position: 'topleft'
                }
            }).setView([@Model.MapCenterLat, @Model.MapCenterLong], @Model.MapInitialZoom);

    L.tileLayer('@Model.MapUrl2', {
        drawControl: true,
        maxZoom: 20,
        id: 'mapbox.streets'
    }).addTo(myMap);

    geoJsonLayer = L.geoJson().addTo(myMap);

    loadGeoFences('');
}

function loadGeoFences(parentId) {
    var url = '@Url.Action("GetGeoFences")';

    $.get(url, { parentId: parentId },
        function (data) {
            if (data.length > 0) {
                $.each(data, function (index, value) {
                    var newLayer = L.geoJson(value,
                        {
                            onEachFeature: applyLayerStyle
                        });
                    newLayer.addTo(geoJsonLayer);
                });
            }
        });
}

Answer 1

我可以使用leaflet.editing插件执行此操作。拥有正确的图层后，可以使用所需的坐标修改layer.editing.latlngs数组。然后调用layer.redraw（）来更新多边形。

Answer 2

您可以在加载geoJson时更改以下代码：

function onEachFeature(feature, layer) {
    if(layer instanceof L.Polyline){
      var latlngs = layer.getLatLngs()
      var ll = latlngs[0][2];
      ll.lat = 51.490056
      latlngs[0][2] = ll;
      layer.setLatLngs(latlngs);
    }
}


L.geoJSON(json,{onEachFeature: onEachFeature}).addTo(map);

https://jsfiddle.net/falkedesign/hvdxo3z7/

传单在GeoJSON图层中移动多边形的单点

2 个答案: