Databases
StackOverflow2013
Postsdbo
PODisplay multiple markers on google map by providing address
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PODisplay multiple markers on google map by providing address
    text
    copied!<p>I have the following script to use the google maps API, I have to create a map that has more than one Marker (the balloon shaped icon pointing to something) and i need each of those markers to point on a different area of the map (i.e. different coordinates), how can i do it? NOTE: I do not have latitude and longitude for the area on which marker has to be placed instead I have the address of the area on which marker has to be placed.</p> <p>The code to display multiple markers on Google map is given below but it does not work as expected!</p> <pre><code>var map = null; var geocoder = null; function initializeNew() { var allAddress = document.getElementById("HiddenField1").value; var testary = new Array(); testary = allAddress.split("|"); if (GBrowserIsCompatible()) { //calls map to appear inside &lt;div&gt; with id, "map_canvas" map = new GMap2(document.getElementById("map_canvas")); //adds zoom and arrow controls to map //map.addControl(new GSmallMapControl()); var marker = null; var i = 0; for (i = 0; i &lt; testary.length; i++) { address = testary[i]; geocoder = new GClientGeocoder(); //converts a street address into geocode for the api geocoder.getLatLng( address, function(point) { if (!point) { alert(address + " not found"); } else { map.setCenter(point, 13); marker = new GMarker(point); map.addOverlay(marker); map.setMapType(G_HYBRID_MAP); //adds your own marker title and description in html marker.openInfoWindowHtml("&lt;p class='para1bold' style=\"font-weight: bold;\"&gt;Address&lt;/p&gt;&lt;p class='para1'&gt;" + address + "&lt;/p&gt;"); //Add click event on push pin to open info window on click of the icon GEvent.addListener(marker, "click", function() { marker.openInfoWindowHtml("&lt;p class='para1bold' style=\"font-weight: bold;\"&gt;Address&lt;/p&gt;&lt;p class='para1'&gt;" + address + "&lt;/p&gt;"); }); //Provides map,satellite,hybrid and terrain views in the map along with zoom control map.setUIToDefault(); } } ) } } } </code></pre> <p>I have stored address of group of items in an array and looped to display markers in the map. This displays only one marker for the last address present in the array. Please correct this code or provide new code to display multiple markers in Google map by providing address.</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload