使用JSON而非GeoJSON的Mapbox标记集群

我正在尝试使用标记聚类,因为当前有2000多个标记被映射,但是我不确定如何用加载标记的方式来实现它。我必须使用GeoJSON才能使用标记聚类吗?如果可能的话,我宁愿不使用GeoJSON,此刻我正在使用JSON文件,并遍历Firebase上存储的数据。如果可能的话,我想使用supercluster库(https://github.com/mapbox/supercluster),但是我不确定要加载到index.load(points)中的内容。可以按目前的代码进行聚类吗?

    var markers = [];

    allMarkers();

    function allMarkers() {
        for (var i = 0; i < data.length; i++) {
            var marker = document.createElement("div");
                marker.classname = "marker";
                marker.style.backgroundImage = "url(./icons/all.png)";
                marker.style.backgroundSize = "100%";
                marker.style.backgroundRepeat = "no-repeat";
                marker.style.width = "25px";
                marker.style.height = "25px";
                marker.style.filter = "drop-shadow(0px 5px 6px #000000)";

            new mapboxgl.Marker(marker)
                .setLngLat([data[i].Long,data[i].Lat])
                .setPopup(
                    new mapboxgl.Popup()
                        .setHTML(
                            ""
                        ).on("close",function() {

                        }).on("open",function() {
                            zoom = map.getzoom();
                            if (zoom < 17) {
                                map.flyTo({
                                    center: [this._lngLat.lng,this._lngLat.lat],zoom: 17
                                });
                            } else {
                                map.flyTo({
                                    center: [this._lngLat.lng,this._lngLat.lat]
                                });
                            }
                        }).setMaxWidth("400px")
                )
                .addTo(map); 
            markers.push(marker);
        }
    }
masterCow 回答:使用JSON而非GeoJSON的Mapbox标记集群

在Mapbox-GL-JS中进行群集的最简单方法是像this example中那样使用带有cluster: true的GeoJSON源。数据以其他某种格式发送到浏览器并不重要,您可以轻松地将其转换为GeoJSON,然后添加它。

当前,您是使用“标记”来表示点,而不是使用地图中的图层,例如circlesymbol。与群集结合起来会更加复杂,因为当用户放大和缩小时,您需要根据需要创建和销毁标记。尽管将限制您设置标记符号样式的能力,但使用地图图层进行管理将更加简单。

本文链接:https://www.f2er.com/2959026.html

大家都在问