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

Using with MarkerClusterer with OMS - an issue when zooming map #154

Open bongobongo opened 6 years ago

bongobongo commented 6 years ago

I'm using OMS together with MarkerClusterer for Google Maps v3. https://github.com/googlemaps/v3-utility-library/tree/master/markerclusterer

It looks very promising, but I have found an issue I hope can be resolved: I want to show to the end user if a marker has underlying markers (that can be spiderfied). I do this by showing a blue marker with a plus sign (for the markers that are spiderfiable with OMS). When a group of markers are spiderfied by clicking such a marker, then these markers are displayed using green markers so the user can distinguish those from the other markers (normal single markers (Red markers), and those that can be spiderfied (Blue with plus sign).

There is an issue when I zoom into the map, and when a cluster icon (from Markerclusterer) is replaced by single markers. When this particular step of zoom is done, and there is a group of markers that normally would show up as blue markers with plus signs - then this/these markers are displayed in normal (red marker). If I zoom further into the map (one step), and then zoom out (one step) - then the blue markes with the plus sign is visible.

Is there a way make sure the blue markers with plus sign, is displayed correctly the first time, when I get below the first level where a particular Markerclusterer is replaced with single markers?

The code I'm using to set the icon for each marker is like this:

google.maps.event.addListener(marker, 'spider_format', function(status) { if (status == OverlappingMarkerSpiderfier.markerStatus.SPIDERFIED){ marker.setIcon('markerclusterer/marker_green.png'); } else if (status == OverlappingMarkerSpiderfier.markerStatus.SPIDERFIABLE){ marker.setIcon('markerclusterer/marker_blue_plus.png'); } else if( status == OverlappingMarkerSpiderfier.markerStatus.UNSPIDERFIABLE){ marker.setIcon('markerclusterer/marker_red.png'); //use a different marker } });

Image 1 is showing the cluster icon from Markerclusterer as shown before zooming one more step into the map:

image-1

Image 2: Show two red markers (next zoom level). In both these two marker positions there are actually several markers. They should have been blue markers with a plus sign - indicating that they have been spiderfied by the overlappingMarkerSpiderfier library:

image-2

Image 3: Now I have zoomed one more time into the map. Then the OverlappingMarkerSpiderfier cicks in and show the two blue spiderfied markers.

image-3

Image 4: Here I have clicked on one of the spiderfied markers, so OMS show the underlying markers as green markers.

image-4

Image 5: Now I have zoomed out one step. This image is at same zoom-level as image 2, and showing the blue markers as they should have been shown when I first zoomed into that level (coming from the zoom level where the cluster icon from the Markerclusterer is last shown).

image-5

superhaggis commented 5 years ago

@bongobongo I had the same issue as yourself and found this comment solved the problem:

https://github.com/jawj/OverlappingMarkerSpiderfier/issues/103#issuecomment-327900374

It's been a while since so you posted this so I'd imagine you already found a solution, however it will help others yet to tread these roads. :)

P.S. You'll need to heed the comments further down and work with the unminified library rather than the minified version.

btbowden commented 3 years ago

I have this same issue, did you ever find a solution?

Jollus174 commented 2 years ago

This solution worked for me: https://github.com/jawj/OverlappingMarkerSpiderfier/issues/103#issuecomment-327900374 Make sure to also use the un-minified version of the library, or else the posted solution won't work since the minified version mangles the variables as part of the minification process.