For that many markers you'd probably want something like MarkerManager. Unfortunately, it only works for v2 of the API. A few people have written ports of it to v3 but there is no official version out there yet and I've had a hard time finding anyone's v3 samples as well. So you could try to recreate it yourself for v3.
I do have to question, though, why you are trying to display that many markers at once. It seems to me that there may be a better way to go about it. I dont' know what kind of data you're displaying, but I'd think that 900 points would be data overload in any situation to those trying to comprehend it. There are a few alternate options, such as limiting the number displayed at any one time by zooming in closer, breaking up the markers into different types or areas that could be activated by links, or using another reporting method such as a heat map. I'd have to say that 20 seconds is probably a good time for that many markers! On Dec 3, 10:42 am, Moncalvm <[email protected]> wrote: > Hi there, > I'm actually developing a map using the new google maps API (v3), > which I read is thought to be optimized for better performances.. > I'm trying to display approximatively 900 markers on the map, > retrieving data from a json callback, and it takes a very long time > (around 20 seconds).. > this is how I create the markers (that seems to be adherent to how it > is explained in the documentation): > > myapp.setMarkerSmall= function(amap) { > > //Loop begins ; > for (var i = 0; i < myapp.data.results.length; i++) { > var image = new > google.maps.MarkerImage('http://www.moncalvomarco.it/map/small.gif', new > google.maps.Size(4, 4), new > google.maps.Point(0,0), new google.maps.Point(0, 0)); > var shape = { coord: [4,4],type: 'poly'}; > var spot = myapp.data.results[i]; > var myLatLng = new google.maps.LatLng(spot[5], spot[6]); > var content = spot[4]; > myapp.smallmarkers[i] = new google.maps.Marker({ > position: myLatLng, > map: amap, > icon: image, > flat: true, > title: spot[4], > zIndex: spot[3], > }); > > // From zoom=1 (small markers are visible) the function zooms to 3 and > pan to the marker latlng > pantolatlng = function(alatlng){ > return function(e){ > myapp.deletetMarkers(myapp.smallmarkers); > myapp.map.set_zoom(myapp.map.getZoom() + 1); > myapp.map.panTo(alatlng); > //console.log(acontent); > } > > } > //click event handler for smallmarkers > > google.maps.event.addListener(myapp.smallmarkers[i], 'click', > pantolatlng(myLatLng) > ); > //loop ends > }; > // myapp.setMarkerSmall ends > } > > I'm new to this group and development in general, and it's is probable > I could code this better.. > Is there any reference or real world example any of you can provide, > to help me decreasing loading time (displaying 50-60 markers makes the > map work fine).. > > Thank you so much. > M. -- You received this message because you are subscribed to the Google Groups "Google Maps JavaScript API v3" group. To post to this group, send email to [email protected]. To unsubscribe from this group, send email to [email protected]. For more options, visit this group at http://groups.google.com/group/google-maps-js-api-v3?hl=en.
