Question

我在文件中有一些JSON：

{
  "type": "FeatureCollection",
  "features": [
    {
      "type": "Feature",
      "geometry": {
        "type": "Point",
        "coordinates": [-87.5048, 33.2943],
        "properties": {
          "museum_count": 8465,
          "sw": [27.9802015625,-98.5048],
          "ne": [38.6083984375,-76.5048]
        }
      }
    }
  }
}

我将其加载到地图中并尝试使用museum_count向圈子添加标签：

mapboxgl.accessToken = 'pk.eyJ1IjoibXl0b3Vyc2FwcCIsImEiOiJDRUVsckI0In0.-eKUxQLVBgTtyoyhxyFyYQ';

var map = new mapboxgl.Map({
  container: 'map',
  style: 'mapbox://styles/mapbox/streets-v9',
  center: [0,0],
  zoom: 4
});

map.addControl(new mapboxgl.Navigation());

map.on('load', function() {
  map.addSource('clusters', {
    type: "geojson",
    data: '/en/map.json'
  });

  map.addLayer({
      "id": "clusters",
      "type": "circle",
      "source": "clusters",
      "paint": {
          "circle-radius": 18,
          "circle-color": "#3887be"
      }
  });

  map.addLayer({
    "id": "clusters-label",
    "type": "symbol",
    "source": "clusters",
    "layout": {
      "text-field": "{museum_count}",
      "text-font": [
        "DIN Offc Pro Medium",
        "Arial Unicode MS Bold"
      ],
      "text-size": 12
    }
  });
});

问题是museum_count似乎是空的。它似乎没有从属性层中获取和数据。对这里出了什么问题的想法？

Answer 1

你好barnaclebarnes！

您的问题源于您使用的GeoJSON。它不符合GeoJSON规范（我发现了一个语法错误和一个结构错误）。我建议使用像GeoJSONLint这样的工具来诊断问题，并防止将来像这样的问题。

http://jsbin.com/yekewogevu/1/edit?html,output

如何在Mapbox GL中添加geojson图层中的文本字段？

1 个答案: