Dear Sir/Madam, Greetings. *Background *:
We are using google maps API to draw markers and clusters. We are fetching data from Hadoop. We are passing JSON data containing 25 K records which should be around 20 MB file. API LINK :https://maps.googleapis.com/maps/api/js?v=3&sensor=false *Issue *: Recently we started encountering an issues where maps fail to load when we attempt to plot markers. Markers get plotted but map fails to render further. However map loads when we add an javascript alert to function where we load map. We also had issues with zooming in same context which was resolved later. We still require a javascript alert (which as per our understanding serves as a delay), to get map loaded along with markers. This really needs your expertise to resolve, have attached all used files and resources along. Our Code Sample Below : function refreshMap1(srverfilteredarray) { try { srverfilteredarray = JSON.parse(srverfilteredarray) //alert("refreshmap1"); if (markerClusterer) { markerClusterer.clearMarkers(); } for (var i = 0; i < this.GlobalMarkerVariabletoReset.length; i++) { this.GlobalMarkerVariabletoReset[i].setMap(null); } // $(document).ready(function () { // $('.searchtree').toggle('slide'); // $('.searchfilter').toggle('slide'); // }); var Filteredmarkers = []; var FilteredmarkersfoSites = []; var markers = []; var markerImage = new google.maps.MarkerImage('../../Images/taxi3.png', new google.maps.Size(24, 32)); var sites = srverfilteredarray; // AllMarkers =sites; //alert("before forloop"); for (var i = 0; i < sites.length; ++i) { var ltg = sites[i]; var markerImage = new google.maps.MarkerImage(ltg.ImagePath, new google.maps.Size(48, 48)); //alert(ltg.Latitude); var latLng = new google.maps.LatLng(ltg.Latitude, ltg.Longitude) var marker = new google.maps.Marker({ position: latLng, draggable: false, icon: markerImage, html: ltg.InfoWindow, customInfo: ltg.Legend }); //alert("After Marker Loop"); google.maps.event.addListener(marker, 'click', function () { var Str = this.html.substring((this.html.indexOf("[") + 1), this.html.indexOf("]")); //ltg[4].toString(); if (Str.length > 0 && Str != 'N/A') { infoWindowContentByAccess = '<div id="infoMap" style="font-family:Segoe UI;font-size:9pt">' + this.html.replace("[", '').replace("]", '') + '<br> <a href="javascript:window.external.ShowVehicleDetails(\'' + Str + '\' )" onclick="onclick="javascript:window.external.ShowVehicleDetails(\'' + Str + '\' ); return false;" > Vehicle Dashboard>></a>'; if (linkAccess.LiveTracker) infoWindowContentByAccess += '<a href="javascript:window.external.ShowLiveTracker(\'' + Str + '\' )" onclick="javascript:window.external.ShowLiveTracker(\'' + Str + '\' ); return false; target="_blank">Live Tracker>></a> '; if (linkAccess.Route) infoWindowContentByAccess += '<a href="javascript:window.external.ShowRoute(\'' + Str + '\' )" onclick="javascript:window.external.ShowRoute(\'' + Str + '\' ); return false; ">Route>></a> '; if (linkAccess.TravelData) infoWindowContentByAccess += '<a href="javascript:window.external.ShowTraveldata(\'' + Str + '\' )" onclick="javascript:window.external.ShowTraveldata(\'' + Str + '\' ); return false; ">Travel Data>></a> '; infoWindowContentByAccess += '<a href="javascript:window.external.AnotherMethod(\'' + Str + '\' )" onclick="javascript:window.external.AnotherMethod(\'' + Str + '\' ); return false; ">More Info>></a> <a href="http://10.100.100.199/HiveUAT/Pages/ViewPage.aspx?system=Acquire&searchparam=' + Str + '" target="_blank">Hive>></a> </div>'; infowindow.setContent(infoWindowContentByAccess); infowindow.open(map, this); } else { infowindow.setContent(this.html); infowindow.open(map, this); } }); //alert("After Event.AddListeener"); google.maps.event.addListener(marker, 'mouseover', function (mark) { var legendDiv = document.createElement('DIV'); // Create the legend and display on the map var legend = new Legend(legendDiv, map, this.customInfo); legendDiv.index = 1; map.controls[google.maps.ControlPosition.RIGHT_CENTER].pop(); map.controls[google.maps.ControlPosition.RIGHT_CENTER].push(legendDiv); }); google.maps.event.addListener(marker, 'mouseout', function (mark) { var legendDiv = document.createElement('DIV'); // Create the legend and display on the map var legend = new Legend(legendDiv, map, '<b>Details</b><br/>'); legendDiv.index = 1; map.controls[google.maps.ControlPosition.RIGHT_CENTER].pop(); map.controls[google.maps.ControlPosition.RIGHT_CENTER].push(legendDiv); }); Filteredmarkers.push(marker); } var zoom = 25? null : zoom; var size = 100 ? null : size; var style = -1 ? null : style; AllMarkers = Filteredmarkers; // GlobalMarkerVariabletoReset = Filteredmarkers; //wait(5000); markerClusterer = new MarkerClusterer(map, Filteredmarkers, { maxZoom: zoom, gridSize: size, styles: styles[style] }); // google.maps.event.addDomListener(window, 'load', wait(1000)); // google.setOnLoadCallback(initialize); google.maps.visualRefresh = true; //Alert(google.maps.visualRefresh); alert('Please click OK'); google.maps.event.addListener(markerClusterer, 'clusterclick', function(cluster){ map.setCenter(cluster.getCenter()); map.setZoom(map.getZoom()+1); }); } catch (e) { alert(e.Message); } } Request you to please review and provide assistance. Thank you, Kedar Dixit -- You received this message because you are subscribed to the Google Groups "Google Maps JavaScript API v3" group. To unsubscribe from this group and stop receiving emails from it, send an email to google-maps-js-api-v3+unsubscr...@googlegroups.com. To post to this group, send email to google-maps-js-api-v3@googlegroups.com. Visit this group at https://groups.google.com/group/google-maps-js-api-v3. For more options, visit https://groups.google.com/d/optout.
