为 Leaflet choropleth 加载 GeoJson 文件

Question

我有一个 GeoJson 文件，我正在尝试将其加载到 logic.js 用于 Leaflet。我 console.logged 响应并获取数据，但是，当我尝试将数据应用到地图上时，出现以下错误：Uncaught (in promise) Error: Invalid GeoJSON object. 我的 GeoJSON 数据如下所示：

  "type": "WineCollection",
  "wines": [
    {
      "type": "wine",
      "properties": {
        "country": "Albania",
        "points": 88.0,
        "price": 20.0
      },
      "geometry": {
        "type": "Point",
        "coordinates": [
          19.9999619,
          41.000028
        ]
      }
    },

这是我的代码：

  center: [40.7128, -74.0059],
  zoom: 2.5
});

// Adding tile layer
L.tileLayer("https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token={accessToken}", {
  attribution: "Map data &copy; <a href=\"https://www.openstreetmap.org/\">OpenStreetMap</a> contributors, <a href=\"https://creativecommons.org/licenses/by-sa/2.0/\">CC-BY-SA</a>, Imagery © <a href=\"https://www.mapbox.com/\">Mapbox</a>",
  maxZoom: 18,
  id: "mapbox.streets",
  accessToken: API_KEY
}).addTo(myMap);

d3.json("static/js/wine.json").then(function(data) {
  L.geoJson(data).addTo(myMap);
});

Answer 1

数据样本不符合 GeoJSON specification。

您可以拥有一个“FeatureCollection”类型的对象，该对象具有“特征”数组，这些“特征”是“特征”类型的对象（并且具有“属性”和“几何”，就像您的数据示例中一样）。

很遗憾，您无法自定义这些类型。

有多种 GeoJSON linting 工具可以帮助您快速发现不合规的数据，例如http://geojsonlint.com/

为 Leaflet choropleth 加载 GeoJson 文件

Load GeoJson file for Leaflet choropleth

geojson

leaflet