Mapbox GL群集位置标记显示/隐藏缩放问题

时间:2018-07-25 00:58:53

标签: cluster-computing mapbox layer marker mapbox-gl-js

我遵循了集群示例。我有三层。群集,非群集点和群集计数。当我放大聚类圆并计数文本时,可以很好地删除,但不会显示所有非聚类标记。它们根据缩放级别显示/隐藏。我希望在删除群集圆时显示所有非聚集点标记。您可以在此mp4示例中看到我的意思。 http://accessibelapp.sensibel.org/map-cluster-issue.mp4,这是我的代码(很抱歉,格式错误。

map.addLayer({
    id: "clusters",
    type: "circle",
    source: "posNegPoints",
    filter: ["has", "point_count"],
        paint: {
            "circle-color": [
                "step",
                ["get", "point_count"],
                "#51bbd6",
                100,
                #f1f075",
                750,
                "#f28cb1"
                ],
                "circle-radius": [
                    "step",
                    ["get", "point_count"],
                    20,
                    100,
                    30,
                    750,
                    40
                 ],
                 "circle-stroke-width": 2,
                 "circle-stroke-color": "#ffffff"
            }
        });

map.addLayer({
                    id: "cluster-count",
                    type: "symbol",
                    source: "posNegPoints",
                    filter: ["has", "point_count"],
                    layout: {
                        "text-field": "{point_count_abbreviated}",
                        "text-font": ["DIN Offc Pro Medium", "Arial Unicode MS Bold"],
                        "text-size": 12
                    }
                });
map.loadImage('http://localhost/sensibel-app/img/good.png', function(error, image) {
                    if (error) throw error;
                    map.addImage('good-icon', image);
                });

                map.loadImage('http://localhost/sensibel-app/img/bad.png', function(error, image) {
                    if (error) throw error;
                    map.addImage('bad-icon', image);
                });

map.addLayer({
                    id: "unclustered-point",
                    type: "symbol",
                    source: "posNegPoints",
                    "layout": {
                        "icon-image": "{PosNeg}-icon" // this could be the issue?
                    }
                });

我认为这可能与我的自定义图标图像有关?

1 个答案:

答案 0 :(得分:0)

我认为 “图标允许重叠”:true 到布局数组/选项 解决了我的问题