Calculate the center point of multiple Lat/Long

Question

I am using Google Map to display multiple lat/long points.

But the Google map Javascript code has the code snippet to track the center of lat/long of the available lat/long.

<script type="text/javascript">
    var locations = JSON.parse('<?php echo json_encode($data);?>'); //alert (locations);
    var map = new google.maps.Map(document.getElementById('map'), {
        zoom: 10,
        center: new google.maps.LatLng(),
        mapTypeId: google.maps.MapTypeId.ROADMAP
    });

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

    var marker, i;

    for (i = 0; i < locations.length; i++) {

        marker = new google.maps.Marker({
            position: new google.maps.LatLng(locations[i][2], locations[i][3]),
            map: map
        });

        google.maps.event.addListener(marker, 'click', (function(marker, i) {
            return function() {
                infowindow.setContent(locations[i][1]);
                infowindow.open(map, marker);
            }
        })(marker, i));
    }
</script>

In Above code the line

center: new google.maps.LatLng(),

needs a lat/long pair which could be the center point of multiple lat/long to be displayed.

How could that be done?

If you lat/longs define an irregular polygon then there is no official defined 'centre'. See this: http://www.mathopenref.com/polygoncenter.html It states the centre as "The point inside a regular polygon that is equidistant from each vertex.". You will see later it says it can have a `centroid`. Here is a 7 step process for that. http://www.ehow.com/how_7209923_calculate-centroid-polygon.html - obviously wiki has some good stuff on this (http://en.wikipedia.org/wiki/Centroid) — CodeBeard, Aug 17 '13 at 12:10
Exact same question was asked two weeks ago: http://stackoverflow.com/questions/18085275/calculate-the-center-of-latitude-and-longitude-coordinates — acraig5075, Aug 18 '13 at 16:18

geocodezip · Answer 1 · 2016-11-30T05:33:28.080

This works. See the documentation of Map.fitBounds and LatLngBounds for details:

<script type="text/javascript">
   var locations =  JSON.parse('<?php echo json_encode($data);?>');//alert (locations);
    var map = new google.maps.Map(document.getElementById('map'), {
      zoom: 10,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    });

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

    var marker, i;
    var bounds = new google.maps.LatLngBounds();
     for (i = 0; i < locations.length; i++) {

      marker = new google.maps.Marker({
        position: new google.maps.LatLng(locations[i][2],locations[i][3]),
        map: map
      });
      bounds.extend(marker.getPosition());

      google.maps.event.addListener(marker, 'click', (function(marker, i) {
        return function() {
          infowindow.setContent(locations[i][1]);
          infowindow.open(map, marker);
        }
      })(marker, i));
    }
    map.fitBounds(bounds);
  </script>

code snippet:

var locations = JSON.parse(
  JSON.stringify([
    ['AAA', 'BBB', 42, -72],
    ['BBB', 'CCC', 42.1, -72.2]
  ])); //alert (locations);
var map = new google.maps.Map(document.getElementById('map'), {
  zoom: 10,
  mapTypeId: google.maps.MapTypeId.ROADMAP
});

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

var marker, i;
var bounds = new google.maps.LatLngBounds();
for (i = 0; i < locations.length; i++) {

  marker = new google.maps.Marker({
    position: new google.maps.LatLng(locations[i][2], locations[i][3]),
    map: map
  });
  bounds.extend(marker.getPosition());

  google.maps.event.addListener(marker, 'click', (function(marker, i) {
    return function() {
      infowindow.setContent(locations[i][1]);
      infowindow.open(map, marker);
    }
  })(marker, i));
}
map.fitBounds(bounds);

html,
body,
#map {
  height: 100%;
  width: 100%;
  margin: 0px;
  padding: 0px
}

<script src="https://maps.googleapis.com/maps/api/js"></script>
<div id="map"></div>

score 1 · Answer 2 · edited May 23 '17 at 11:45

1

You should get the bounds of your added markers with the function map.getBounds().

It returns an object on which you can get the center bound.getCenter().

See Find center of multiple locations in Google Maps

edited May 23 '17 at 11:45

Community

1
1

answered Aug 17 '13 at 13:31

dievardump

2,484
17
21

Calculate the center point of multiple Lat/Long

2 Answers2