Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How do I show multiple locations in Google Maps?

I have multiple longtitude and attitude data and I want to show them in the google map with pins.

How to use the google map API to do this?

like image 667
Jun Avatar asked Nov 25 '11 01:11

Jun


1 Answers

You iterate over your array, and create a new Marker instance for each pair. It's simple:

<script>
    var map = new google.maps.Map(document.getElementById('map'), {
        center: new google.maps.LatLng(55.378051, -3.435973),
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        zoom: 8
    });

    var locations = [
        new google.maps.LatLng(54.97784, -1.612916),
        new google.maps.LatLng(55.378051, -3.435973])
        // and additional coordinates, just add a new item
    ];

    locations.forEach(function (location) {
        var marker = new google.maps.Marker({
            position: location,
            map: map
        });
    });
</script>

This works for any number of latitude/longitude pairs; just add a new item to the locations array.

like image 68
Martin Bean Avatar answered Oct 04 '22 15:10

Martin Bean