How to add markers in Google maps?

Question

Please help me How can I add multiple markers in this code? I searched a lot but I don't know how to add markers in this code? I am new in Google maps API. and sorry if I made any grammatical or spelling mistake in this question.

JS Code:

function initialize() {
    var mapCenter = new google.maps.LatLng(52.5167, 13.3833);
    $('#user_latitude').val(52.5167);
    $('#user_longitude').val(13.3833);

    var mapOptions = {
        zoom: 3,
        center: mapCenter,
        zoomControl: true,
        zoomControlOptions: {
            position: google.maps.ControlPosition.LEFT_CENTER
        },
        streetViewControl: true,
        streetViewControlOptions: {
            position: google.maps.ControlPosition.LEFT_TOP
        },
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        minZoom: 3,
        scrollwheel: false
    };


    var infowindow = new google.maps.InfoWindow();


    var map = new google.maps.Map(document.getElementById("map"), mapOptions);


}

Hello have a look at this [https://stackoverflow.com/questions/3059044/google-maps-js-api-v3-simple-multiple-marker-example](https://stackoverflow.com/questions/3059044/google-maps-js-api-v3-simple-multiple-marker-example) — Hamza Boudra, Apr 28 '17 at 13:33
What is so different? You don't have any code that attemps to add markers. — geocodezip, Apr 28 '17 at 13:39

score 0 · Answer 1 · edited Aug 24 '20 at 21:39

You can define an array inside your initialize function with all your marker:

 var locations = [
      ['Marker 1', 41.0, 12.4], 
      ['Marker 2', 47.0, 15.4],
     ...
    ];

First value can be the title, second the latitude and third longitude Then you can create a loop to add markers

 for (i = 0; i < locations.length; i++) {
      marker = new google.maps.Marker({
        position: new google.maps.LatLng(locations[i][1], locations[i][2]),
        map: map
      });

Example:

function initialize() {
    var locations = [
        ['Marker 1', 41.0, 12.4],
        ['Marker 2', 47.0, 15.4],
    ];
    var mapCenter = new google.maps.LatLng(52.5167, 13.3833);
    $('#user_latitude').val(52.5167);
    $('#user_longitude').val(13.3833);

    var mapOptions = {
        zoom: 3,
        center: mapCenter,
        zoomControl: true,
        zoomControlOptions: {
            position: google.maps.ControlPosition.LEFT_CENTER
        },
        streetViewControl: true,
        streetViewControlOptions: {
            position: google.maps.ControlPosition.LEFT_TOP
        },
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        minZoom: 3,
        scrollwheel: false
    };


    var infowindow = new google.maps.InfoWindow();


    var map = new google.maps.Map(document.getElementById("map"), mapOptions);

    for (i = 0; i < locations.length; i++) {
        marker = new google.maps.Marker({
            position: new google.maps.LatLng(locations[i][1], locations[i][2]),
            map: map
        });
    }
}

references: Simple markers | Google maps api, Adding multiple markers to Google Map

Good answer, but maybe reference the source you got it from (http://stackoverflow.com/a/3059129/979052). And apply the code into Shah's code, rather than just pasting it. (will remove DV when done) — Alicia Sykes, Apr 28 '17 at 13:37
can you please tell me how to add marker clusterer in the map? — shah rushabh, Apr 28 '17 at 13:50
You can refer to official [Docs](https://developers.google.com/maps/documentation/javascript/marker-clustering) — Matteo Errera, Apr 28 '17 at 13:52

How to add markers in Google maps?

1 Answers1