使用 LeafletJS 在地图上绘制边界

Question

我开始研究可以生成地图的代码。我现在将 OSM (OpenStreetMaps) 视为一个很好的解决方案。 LeafletJS 也使得基于 OSM 绘制地图变得非常容易。到目前为止一切顺利。

我希望能够画出一个县的轮廓（边界），并试图了解这个过程会是什么样子。我是先调用查找坐标然后将它们传递到 Leaflet 还是有更好的方法？

我可以使用 Nominatim API 获取边界，但这样调用：

https://nominatim.openstreetmap.org/ui/search.html?state=tx&county=Lee

而且我可以像这样在 Leaflet 中绘制区域：

var polygon = L.polygon([
    [51.509, -0.08],
    [51.503, -0.06],
    [51.51, -0.047]
]).addTo(mymap);

所以，我是想多了还是这就是它的工作原理？

Answer 1

您可以创建一个函数来获取县的几何图形并将其添加到地图中。试试下面的代码：

function drawCountyBoundary(county, state)
{
    url = `https://nominatim.openstreetmap.org/search.php?county=${county}&state=${state}&polygon_geojson=1&format=jsonv2`
    fetch(url).then(function(response) {
    return response.json();
  })
  .then(function(json) {
    geojsonFeature = json[0].geojson;
    L.geoJSON(geojsonFeature).addTo(map);
  });
}

drawCountyBoundary('Lee', 'Tx')

使用 LeafletJS 在地图上绘制边界

Drawing boundaries on a map with LeafletJS

javascript

openstreetmap

leaflet