1

我的 Web 应用程序让用户使用 Leaflet.Draw 控件绘制形状以及从 geojson 文件加载形状。但是，似乎这两种方法都会生成不同的 geojson 对象。

当我从 geojson 加载形状时。

{  
   "options":{  

   },
   "_layers":{  
      "2998":{  
         "options":{  
            "pane":"overlayPane",
            "attribution":null,
            "bubblingMouseEvents":true,
            "fill":true,
            "smoothFactor":1,
            "noClip":false,
            "stroke":true,
            "color":"#3388ff",
            "weight":3,
            "opacity":1,
            "lineCap":"round",
            "lineJoin":"round",
            "dashArray":null,
            "dashOffset":null,
            "fillColor":null,
            "fillOpacity":0.2,
            "fillRule":"evenodd",
            "interactive":true
         },
         "_bounds":{  
            "_southWest":{  
               "lat":3.668372,
               "lng":101.873785
            },
            "_northEast":{  
               "lat":3.670492,
               "lng":101.875974
            }
         },
         "_latlngs":[  
            [  
               {  
                  "lat":3.668372,
                  "lng":101.873785
               },
               {  
                  "lat":3.670492,
                  "lng":101.873785
               },
               {  
                  "lat":3.670492,
                  "lng":101.875974
               },
               {  
                  "lat":3.668372,
                  "lng":101.875974
               }
            ]
         ],
         "_initHooksCalled":true,
         "_events":{  
            "revert-edited":[  
               {  
                  "ctx":{  
                     "latlngs":[  
                        null
                     ],
                     "_initHooksCalled":true
                  }
               }
            ],
            "add":[  
               {  

               }
            ],
            "remove":[  
               {  

               }
            ]
         },
         "feature":{  
            "properties":{  
               "Name":"rectangle-xugcym9x4i",
               "Description":"",
               "Tag":"",
               "id":"rectangle-xugcym9x4i"
            },
            "geometry":{  
               "type":"Polygon",
               "coordinates":[  
                  [  
                     [  
                        101.873785,
                        3.668372
                     ],
                     [  
                        101.873785,
                        3.670492
                     ],
                     [  
                        101.875974,
                        3.670492
                     ],
                     [  
                        101.875974,
                        3.668372
                     ],
                     [  
                        101.873785,
                        3.668372
                     ]
                  ]
               ]
            },
            "type":"Feature"
         },
         "defaultOptions":{  
            "pane":"overlayPane",
            "attribution":null,
            "bubblingMouseEvents":true
         },
         "_leaflet_id":2998,
         "_eventParents":{  

         }
      }
   },
   "_leaflet_id":2999,
   "_initHooksCalled":true
}leaflet.js:1125:17

当我用 Leaflet.Draw 绘制形状时

{  
   "options":{  
      "stroke":true,
      "color":"#3388ff",
      "weight":4,
      "opacity":0.5,
      "fill":true,
      "fillColor":null,
      "fillOpacity":0.2,
      "clickable":true
   },
   "_bounds":{  
      "_southWest":{  
         "lat":3.668382508900863,
         "lng":101.87454700469972
      },
      "_northEast":{  
         "lat":3.6702567212235673,
         "lng":101.87684297561646
      }
   },
   "_latlngs":[  
      [  
         {  
            "lat":3.668382508900863,
            "lng":101.87454700469972
         },
         {  
            "lat":3.6702567212235673,
            "lng":101.87454700469972
         },
         {  
            "lat":3.6702567212235673,
            "lng":101.87684297561646
         },
         {  
            "lat":3.668382508900863,
            "lng":101.87684297561646
         }
      ]
   ],
   "_initHooksCalled":true,
   "_events":{  
      "revert-edited":[  
         {  
            "ctx":{  
               "latlngs":[  
                  null
               ],
               "_initHooksCalled":true
            }
         }
      ],
      "add":[  
         {  

         }
      ],
      "remove":[  
         {  

         }
      ]
   },
   "editing":{  
      "options":{  

      },
      "_initHooksCalled":true
   },
   "feature":{  
      "properties":{  
         "Name":"rectangle-9d3jtxlr99",
         "Description":"",
         "Tag":"",
         "id":"rectangle-9d3jtxlr99"
      }
   }
}

由于这两种形状都是 Leaflet geojson 形状，我希望它们具有相同的数据结构。因为绘制的形状和加载的形状具有不同的结构，所以我无法一致地对它们进行索引以获得我想要的属性。我的功能适用于一种形状，但不适用于另一种形状。

此外，我可以使用 Leaflet.draw 控件编辑绘制的图层，但不能编辑加载的图层。有没有办法为绘制和加载的形状标准化 geojson 结构？

4

1 回答 1

0

两种形状都是 Leaflet geojson 形状

从您显示的数据结构中，第一个对应于Leaflet GeoJSON Layer Group，而第二个对应于Leaflet 矩形矢量图层。

如果我们仔细观察，我们会发现与第一个“_layers”字典对象中的第二个相似的结构，它显示了 Leaflet 如何将各个层嵌套在一个层组中。

如果您尝试从您绘制的图层中获取 GeoJSON 数据（例如，获得它们的“几何”），那么只需toGeoJSON()在它们上使用该方法。

我可以使用 Leaflet.draw 控件编辑绘制的图层，但不能编辑加载的图层。

您可能会尝试将您的第一个图层组直接嵌套到您提供edit.featureGroup给L.Control.Draw. 在这种情况下，请参阅Leaflet Draw "Cannot read property 'enable' of undefined" 将控件添加到 geoJSON 层

于 2019-08-22T02:25:16.153 回答