CODEWITHSUNDEEP
javascriptgoogle-mapsgoogle-maps-api-3
Nikunj
Nikunj

Reputation: 307

Multiple Markers crashing Browsers

I am loading about 15,000 markers on the google map.

I have retrieved 1000 markers by using timeinterval per second.

when it is completed and 15000 markers are load on map then it crashes browser.

so, what i have to do for this issue.

Please do not vote down.

 for (x in dataObject) {
        var infowindow = new google.maps.InfoWindow();
        var markerPosition = new google.maps.LatLng(dataObject[x].Latitude, dataObject[x].Longitude);
        var scaleSize = getSectorSize(dataObject[x].Mapinfo_Sector_Size);
        var sectorColor = getSectorColor(dataObject[x].Radios);
        var pathValue = createPie(dataObject[x].MapInfo_Beamwidth);

        marker = new google.maps.Marker({
            position: markerPosition,
            map: map,
            icon: {
                path: pathValue,
                fillColor: sectorColor,
                fillOpacity: 1,
                strokeColor: '',
                strokeWeight: 0,
                //scale: 0.8,
                scale: dataObject[x].Mapinfo_Sector_Size + 0.04,
                anchor: new google.maps.Point(0, 0),
                rotation: 250 + dataObject[x].Azimuth,
                //rotation: 250,
            },
        });

Upvotes: 1

Views: 768

Answers (1)

frictionlesspulley
frictionlesspulley

Reputation: 12358

I am working on a google maps project myself and have seen performance issues when the number of markers increase beyond even 500.

google maps documentation itself provides a few valid workarounds, of which I have used MarkerClusterer v3 which provides a nice way of managing large number of markers. However using MarkerClusterer will NOT improve your performance issues.

If you still want display 15000 markers to users in a single viewport (which in itself is does not sound correct from the point of view of user experience) then you could take a look at adding markers to overlays, this blog

How To Quickly Add Many Markers Without Killing The Map

provides a sound solution of adding an overlap (div) above the map and adding markers to the div. The blog also provides an example of loading 1000 markers. I am not sure if this will hold with 15000 :)

Hope this helps.

Upvotes: 1

Related Questions