I'm trying to place more than a thousand markers on a map, so I'm trying to implement MarkerManager. Once I incorporated the MarkerManager code, my map and markers disappeared. I could use some help figuring out what I've done wrong.
My site: http://multimedia.post-gazette.com/marcellus_test/washington.html My code: // JavaScript Document //<![CDATA[ var map = null; Event.observe(window, 'load', load); Event.observe(window, 'unload', GUnload); var newIcon; function load() { if (GBrowserIsCompatible()) { // Create the map // Make sure this element has the same ID as your div var map = new GMap2(document.getElementById("shalemap")); //add a marker manager -- this map has too many markers var mgrOptions = { borderPadding: 50, maxZoom: 15, trackMarkers: true }; var mgr = new MarkerManager(map, mgrOptions); // Add controls for moving and zooming the map. Use GSmallMapControl for small maps map.addControl(new GLargeMapControl()); //map.addControl(new GSmallMapControl()); // Add controls for switching between regular and satellite views map.addControl(new GMapTypeControl()); // Set the starting position and zoom level when the map loads map.setCenter(new GLatLng(40.4406248, -79.9958864), 9); var arr_markers = [];//array to hold markers; we'll put it in the marker manager // Read the data from XML var request = GXmlHttp.create(); // Open the XML file request.open("GET", "http://mydomain/myfile.xml", true); request.onreadystatechange = function() { if (request.readyState == 4) { var xmlDoc = request.responseXML; // Obtain the array of markers and loop through it var markers = xmlDoc.documentElement.getElementsByTagName("marker"); for (var i = 0; i < markers.length; i++) { // Obtain the attributes of each marker var lat = parseFloat(markers[i].getAttribute("lat")); var lng = parseFloat(markers[i].getAttribute("lng")); var point = new GLatLng(lat,lng); var authID = markers[i].getAttribute("authID"); var date = markers[i].getAttribute("date"); var name = markers[i].getAttribute("name"); var municipality = markers[i].getAttribute("municipality"); var county = markers[i].getAttribute("county"); var operator = markers[i].getAttribute("operator"); // Call the function to create the marker var marker = createMarker(point,authID,date,name,municipality,county,operator); //if the form has been submitted, then only put the markers //that match the chosen operator on the map //alert(chosen_option); arr_markers.push(marker); //map.addOverlay(marker); }//end var for //display stuff from markers array in markermanager mgr.addMarkers(arr_markers, 10); mgr.refresh(); }//end request.readyState == 4 }//end function request.send(null); // Function to create the marker and set up the event window function createMarker(point,authID,date,name,municipality,county,operator) { // Create the HTML text based on the values passed in from XML var markerhtml = ""; markerhtml += "<div style='width: 250px;font-family: Arial, Helvetica, sans-serif; font-size:80%;'><strong>Name:</strong> " + name + "<br/>"; markerhtml += "<strong>Date: </strong>" + date + "<br>"; markerhtml += "<strong>Municipality:</strong> " + municipality + "<br>"; markerhtml += "<strong>County: </strong>" + county + "<br>"; markerhtml += "<strong>Operator: </strong>" + operator + "<br>"; markerhtml += "<strong>AuthID: </strong>" + authID + "<br>"; //} markerhtml += "</div>"; year = date.substr(date.length-4); if (year == '2010') { //blue newIcon = MapIconMaker.createMarkerIcon({width: 22, height: 22, primaryColor: "#1E90FF", cornerColor: "#1E90FF", strokeColor: "#000000"}); count2010++; } else if (year == '2009') { //orange newIcon = MapIconMaker.createMarkerIcon({width: 22, height: 22, primaryColor: "#FF8A00", cornerColor: "#FF8A00", strokeColor: "#000000"}); count2009++; } // Create the map marker var marker = new GMarker(point, {icon: newIcon}); // Add a click event to each marker which will open the HTML window GEvent.addListener(marker, "click", function() { marker.openInfoWindowHtml(markerhtml); }); GEvent.addListener(marker, 'infowindowclose', function(){ var point = marker.getLatLng(); map.panTo(point); }); //i++; return marker; } } // Javascript alert for older browsers where Google Maps isn't supported else { alert("Sorry, the Google Maps API is not compatible with this browser"); } } //]]> -- You received this message because you are subscribed to the Google Groups "Google Maps API V2" 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-api?hl=en.
