Question

var feature = {
    "type": "feature",
    "properties": {
        "style": {
            "color": "#004070",
            "weight": 4,
            "opacity": 1
         }
     },
    "geometry": {
        "type": "MultiPoint",
        "coordinates": [[
            [0.25, 51.47],
            [0.26, 51.47],
            [0.27, 51.47]
        ]]
    }
};

var geojsonLayer = new L.GeoJSON(feature);
map.addLayer(geojsonLayer);

我正在尝试在地图上显示以上三个点。为什么标记不出现？

Answer 1

确保您的GeoJSON数据符合spec。您有可用的在线整理工具，例如http://geojsonlint.com/和http://geojson.io/

在您的情况下：

"Feature"类型必须大写。

"coordinates"

"MultiPoint"必须是位置/坐标数组。但是你有一个坐标数组的数组。（额外一级）

更正这两个错误后，一切正常：

var map = L.map('map');

var feature = {
  "type": "Feature",
  "properties": {
    "style": {
      "color": "#004070",
      "weight": 4,
      "opacity": 1
    }
  },
  "geometry": {
    "type": "MultiPoint",
    "coordinates": [
      [0.25, 51.47],
      [0.26, 51.47],
      [0.27, 51.47]
    ]
  }
};
var geojsonLayer = new L.GeoJSON(feature);
map.addLayer(geojsonLayer).fitBounds(geojsonLayer.getBounds());

L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
  attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map);

<link rel="stylesheet" href="https://unpkg.com/leaflet@1.3.1/dist/leaflet.css" integrity="sha512-Rksm5RenBEKSKFjgI3a41vrjkw4EVPlJ3+OiI65vTjIdo9brlAacEuKOiQ5OFh7cOI1bkDwLqdLw3Zg0cRJAAQ==" crossorigin="" />
<script src="https://unpkg.com/leaflet@1.3.1/dist/leaflet-src.js" integrity="sha512-IkGU/uDhB9u9F8k+2OsA6XXoowIhOuQL1NTgNZHY1nkURnqEGlDZq3GsfmdJdKFe1k1zOc6YU2K7qY+hF9AodA==" crossorigin=""></script>

<div id="map" style="height: 180px"></div>

GeoJSON MultiPoint没有显示在地图上

1 个答案: