jawj / OverlappingMarkerSpiderfier

Deals with overlapping markers in Google Maps JS API v3, Google Earth-style
http://blog.mackerron.com
836 stars 238 forks source link

Performance of addMarker() #175

Open bavarianbytes opened 2 years ago

bavarianbytes commented 2 years ago

When i add 2k or more markers to the map via OMS, the method addMarker() need seconds and freezes the browser UI. If i add them directly to the map, that doesn't happen. Any ideas to make that more performant?

// jobMarkers.length = 2k

for(var i = 0; i < jobMarkers.length; i++) {
    // create marker out of job
    var marker = new google.maps.Marker({
        icon: {
            url: createMarkerInlineSVG(page.maps.marker.color),
            scaledSize: new google.maps.Size(mapsMarkerWidth, mapsMarkerHeight),
        },
        position: {
            lat: jobMarkers[i].lat,
            lng: jobMarkers[i].lng
        },
        title: jobMarkers[i].title,
        city: jobMarkers[i].city,
        state: jobMarkers[i].state,
        country: jobMarkers[i].country,
        organization: jobMarkers[i].organization,
        slug: jobMarkers[i].slug
    });

    // open info window on click
    google.maps.event.addListener(marker, 'spider_click', function() {
        markerWindow.setContent(createMarkerWindowContent(this));
        markerWindow.open(map, marker);
    });

    // add to spiderfier and cluster
    markerSpiderfier.addMarker(marker);
    markerCluster.addMarker(marker);
}