I'm working on an application that generates a large number of Google Map markers (2000 - 7000) via JSON. I'm also using MarkerCluster. It works quick on Chrome and FF but IE6 takes few minutes and just crashes the first time I try to zoom in.
I'm not doing any more than just adding the markers to a map using JQuery & GMap API. So I looked at the following URL of the regular Google Map.
http://maps.google.co.uk/maps?f=q&source=s_q&hl=en&q=hotel&sll=53.182996,-2.581787&sspn=1.494529,4.927368&ie=UTF8&split=1&rq=1&ev=p&hq=hotel&hnear=&ll=53.123702,-2.730103&spn=1.496594,4.927368&t=h&z=8
It shows a lot of tiny markers (~1000) and works fine on IE6. Do you have any ideas why this works and the markers added via the API struggles?
Thanks
Having thousands of markers coming out of your program does not sound like it is going to be very friendly for anyone with an older machine.
MarkerCluster doesn't actually reduce the number of markers on the map. It just groups them.
I would recommend implementing a clustering algorithm on the backend so that the number of markers to be shown on the map is reduced.
Related
Yes, I did research here and found so far only references to the MarkerClusterer plugin, or pointers to using KML or Fusion table layers.
This: https://developers.google.com/maps/articles/toomanymarkers#markermanager
was also an interesting read.
I'm thinking this should be relatively easy, no? Let me try to express what I'm doing in pseudo-code:
WILE event: "drag the map"
get current viewport bounds
load ajax call to look up markers that are located inside current viewport
remove previously visible markers
add newly visible markers to the display
END WHILE
I'm not that great at proper computer-science programming type stuff and struggle with the necessary structure for performing an efficient loopable action like this that continuously updates the marker array.
Somehow my gut feeling tells me this might be an inefficient way - should I approach this differently? What I'd like to avoid is updating the marker array on drag end.
Thanks for any help.
After some fiddling and further searching, the solution is buried here: google maps v3 duplicate markers - using an array to manage markers but still get duplicates
I have a map where at some point I draw around 14000 markers. If the bounds of the map is set to the entire area where the markers are drawn, it takes a long time to draw the markers (about 8 seconds). But if I zoom into an area where few/no markers will be drawn, then drawing the 14000 markers goes really fast, like 2-3 seconds.
I assume this is because the most time consuming process is to actually draw the marker icons to the tiles, and since the markers are added one at a time, the map is rendered a ton of times in a very short time span.
Therefore I wonder if it's possible to disable the map updating/rendering while I add my icons, then re-enable it when all the icons are added.
Any solutions with the similar effect is welcome
The rendering time goes down because api v3 doesn't add the 14 000 when you're zoomed in more tightly. It only adds the markers that are in the current bounds PLUS markers that are in the tile layer buffer around the edges (probably one or two tiles).
I'm kind of confused as to what you mean, but perhaps you want to add the markers only after the map has already been loaded:
google.maps.event.addListenerOnce(map,'tilesloaded',addMarkersFunction);
All that being said, 14 000 markers is A LOT of markers. Clustering markers when you have this many is not even what I would consider optional any more.
Yes, you could create a lot of markers, not associate them with the map. Then afterwards, call the setMap() function on each of them.
You could also only do this that fall within the current bounds.
And have you considered marker clustering to reduce the number of markers?
Would be useful to see your code.
Try using the MarkerManager library in the Google Maps API v3 Utility Library. It was designed for such problems. While there isn't much in the way of documentation, there are several useful examples and plenty of comments in the source code.
I am making an application with google maps.
When markers are overlapping only the last one is displayed even if the icons are different..
I do not want it to cluster in that case, rather it should show both maybe by changing the coordinates just a but??
Any solutions??
I think this is a pretty elegant solution, called Spiderfying the markers.
https://github.com/jawj/OverlappingMarkerSpiderfier
I'm thinking of using it.
What I do now is use JavaScript to make a fancy popup that hides and shows divs on one marker location (created problematically in PHP, but you could do it on JS too). It has the side benefit of allowing less markers on the map.
Click a black numbered marker on this map to see it in action.
http://www.yourmapper.com/map/111/crime-reports/crime-in-metro-louisville-ky-since-jan-2003.htm
Another option is to use Google Maps API 3 Utility Library, it has a Marker Clusterer.
my problem is with XXk (aka XX000) markers, atm I have 7k markers and will be more, and more, problem is in marker database, because atm this is 4MB (link to my DB http://tinyurl.com/ybau9ce) and problem is, how load that fast? for example DOWNLOAD only this what are show now, DOWNLOAD because load I have with ClusterMarker and problem is not with java but with download that database I think...
http://code.google.com/apis/maps/documentation/overlays.html
find the part about the marker manager
quote from that "The manager monitors the map's current viewport and zoom level, dynamically adding or removing markers from the map as they become active."
dynamicly doing this would require a database with all the markers.
Theres a good explanation on how to do that on the link under here.
code.google.com/apis/maps/articles/phpsqlajax.html
you are able then to dynamicly generate those markers that are in the boundaries of the current zoom.
There will be some events after zooming or moving the map and you can then trigger on that
and find out the boundaries of the current view.
Would that be helping solving it?
Why would you want to download all that data at once? You cannot visualize 7K markers at once on a map imo.
I don't know what the goal of your question is, but I would have only the data uploaded that is in focus, e.g. on display and visible.
I have a google map with several placemarks, when you zoom out on it at some point several placemarks that are close, show as one, in the domain of the app this is a serious problem.
Is there anyway to show some sort of count or make obvious the fact that there are more than one placemark?
Cheers
MarkerClusterer was recently released on the GMaps Utility Library. It's the fastest client-side clusterer I've seen so far. There's a great example here which shows some of the options you can tweak.
This page compares and benchmarks some of the options available to you, and concludes that MarkerClusterer is the fastest.
Just keep in mind that if you have several thousand markers, any client-side solutions will probably be too slow.
There's an extension by Martin Pearman that addresses this situation:
ClusterMarker detects any groups of two or more markers whose icons visually intersect when displayed. Each group of intersecting markers is then replaced with a single cluster marker. The cluster marker, when clicked, simply centres and zooms the map in on the markers whose icons previously intersected.
There seems to be a problem with the redirection on Martin's page at the moment, but if you keep reloading it eventually works.