append()
(insert the elements into the document) before you create the maps: http://jsfiddle.net/QCjSW/4/
Adding multiple Google maps to the same page using API v3
-
17-07-2023 - |
Question
I am trying to dynamically create a list of maps using a for loop. I've seen other examples but in mine, the for loop will also need to create the div for the map to live in as well as put the map in it.
My html...
<div id="allMaps"></div>
My simplified script...
var mapList = "";
for (i = 0; i < 10; i++) {
mapList += '<div class="singleMap" id="map' + i + '"></div>';
var mapOptions = {
center: new google.maps.LatLng(-34.397, 150.644),
zoom: 8
};
var map = new google.maps.Map($("#map"+i), mapOptions);
}
$("#allMaps").append(mapList);
A fiddle: http://jsfiddle.net/QCjSW/2/
Thanks.
Solution
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow