Question

我想显示标记以及特定纬度和经度的可用点数。

我期待与上面类似的东西。

但是我又添加了2层，以显示不同的颜色和数字。如果我这样做，我会得到＆＃34; undefined＆＃34;显示弹出窗口时出错。由于数据来自其他层。如果它来自层＆＃34;位置＆＃34;它按预期工作。但是当我们有多个出现时，弹出内容显示＆＃34; undefined＆＃34;。下面是我的实现输出和代码

 map.on('load', function () {

  map.addSource("place", {
    type: "geojson",
    data: liveData,
    cluster: true,
    clusterMaxZoom: 14,
    clusterRadius: 50 
  });

 map.addLayer({
    "id": "locations",
    "type": "circle",
    "source": "location",
    "paint": {
      "circle-radius": 7,
      "circle-color": "#FFF000",
      "circle-stroke-width": 4,
      "circle-stroke-color": "#FFFFFF"
    }

  });

     map.addLayer({
      id: "clusters",
      type: "circle",
      source: "location",
      filter: ["has", "point_count"],
      paint: {
          "circle-color": {
              property: "point_count",
              type: "interval",
              stops: [
                  [0, "#FFF000"],
                  [2, "#DC143C"],
              ]
          },
          "circle-radius": {
              property: "point_count",
              type: "interval",
              stops: [
                  [0, 7],
                  [2, 7],
              ]
          }
      }
  });

  map.addLayer({
      id: "cluster-count",
      type: "symbol",
      source: "location",
      filter: ["has", "point_count"],
      layout: {
          "text-field": "{point_count_abbreviated}",
          "text-font": ["DIN Offc Pro Medium", "Arial Unicode MS Bold"],
          "text-size": 12,
          "text-offset": [0, 5]
      }
  });

 map.on('click', 'locations', function (e) {
    let htmlString = "";
    for (let i = 0; i < e.features.length; i++) {
      htmlString = htmlString + e.features[i].properties.description;
      if (i != e.features.length - 1) {
        htmlString = htmlString + "</br>";
      }
    }
    new mapboxgl.Popup()
      .setLngLat(e.features[0].geometry.coordinates)
      .setHTML(htmlString)
      .addTo(map);

  });
 }

My working fiddle

我想实现这个目标，因为第一张照片或弹出窗口应该以我的方式工作？

Answer 1

据我所知，目前无法通过mapbox的群集功能获得在群集中组合的所有功能。

见这里：https://github.com/mapbox/mapbox-gl-js/issues/3318

如何在Mapboxgl中显示特定纬度和经度的点数？

1 个答案: