Load markers for two GeoCharts

[Marshall Davis]

I have two  divs, with unique IDs. I load the Google libraries like:

google.charts.load('current', {'packages': ['geochart']});

google.charts.setOnLoadCallback(drawMarkersMap);

When I make the call to drawMarkersMap I do so with passing a region. This region is used both in the div ID and the region option for the map. I use a button with a click event listener to switch visibility of the two divs and call same function. This appears to work, but the chart itself appears to make two calls out per marker, I assume to translate the location strings to actual map locations. It does this one marker at a time. I am loading 400+ markers on one map, and 55+ on the second. The first map must complete all its markers before any populate on the second. I'd prefer an option to have both load simultaneously. This way if the user switches between one map or the other at least some of the markers will have been loaded.

What options can be used to make these marker calls asynchronously or in any way faster? The drawMarkersMap function AJAXs in an array of data.