Question

我在angular2应用中使用谷歌地图。我也使用了MarkerCluster，如下所示。

 for (let marker of this._markers) {

        let lat = +marker.latitude;
        let long = +marker.longitude;

        let markerobj = new google.maps.Marker({
            position: new google.maps.LatLng(lat, long),
            title: marker.name,
            icon: {
                path: google.maps.SymbolPath.CIRCLE,
                scale: 6,
                fillOpacity: 0.8,
                fillColor: '#5A7793',
                strokeColor: '#FFFFFF',
                strokeWeight: 2,
            },
            map: this.map,
            visible: true,
        });
        this.markerLayer.push(markerobj);
        latlngbounds.extend(markerOnMap.getPosition());
        markerList.push(markerOnMap);
    }

 let markerCluster = new MarkerClusterer(this.map, markerList, { imagePath: '../assets/images' });

我想在谷歌地图上显示大约100000个标记。当我试图绘制100000个标记时，我面临很多性能问题。

根据客户要求，我不能使用其他地图库。我需要坚持使用谷歌地图。

您是否有任何建议可以帮助我改善表现。

Answer 1

您不能同时绘制100,000个标记。您需要做的是减少一次显示的数据量。放大时仅显示单个标记，因此视图中没有太多标记。

所以我建议根据谷歌地图的界限从服务器加载标记。那就是左上角和右下角的坐标。

因此，假设您有遍布全球的100,000个标记。在世界观中，最好不要显示任何内容并要求用户放大。一旦处于较低的缩放级别，使用地图的边界从服务器获取位于这些边界内的标记。这应该会减少您必须显着显示的标记数量。我不知道您的数据的覆盖范围，但您可以找出最适合您的缩放级别。

使用angular2在Google地图上处理大型数据集（100000）

1 个答案: