javascript - 如何按城市(位置)Google map 过滤位置数组

Question

我在 Google map 文档中找不到任何文章，希望这里有人做过或知道如何实现我所需要的。

所以基本上我有位置数组

数组示例

const array = [
  {
    latitude: 37.783476,
    longitude: -122.425412,
  }
]

现在我需要根据城市(例如旧金山)过滤该数组。

我怎样才能实现这个目标？
非常感谢任何文档链接或任何想法。

Answer 1

您可以使用反向地理编码来实现它。

js fiddle :https://jsfiddle.net/fatty/bdartuph/12/

这里我在数组中获取了两个坐标 - 旧金山和纽约。因此，该数组将根据您在输入框中写入的城市进行过滤，并将存储在filteredArray中。

var coordArray = [{
    latitude: 37.783476,
    longitude: -122.425412,
  },
  {
    latitude: 40.730885,
    longitude: -73.997383,
  }
];

$("#btn").click(function() {
  var filteredArray = [];
  var cityName = $("#cityName").val();
  var geocoder = new google.maps.Geocoder();

  for (var i = 0; i < coordArray.length; i++) {
    var latlng = new google.maps.LatLng(coordArray[i].latitude, coordArray[i].longitude);
    geocoder.geocode({
      'latLng': latlng
    }, function(results, status) {
      if (status == google.maps.GeocoderStatus.OK) {
        var address = results[0].formatted_address.split(',');
        alert("" + address[1]);
        if (address[1].toLocaleLowerCase().trim() == cityName.toLocaleLowerCase()) {
          filteredArray.push(coordArray[i]);
        }
      } else {
        alert("Geocoder failed due to: " + status);
      }
    });
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>

<input id="cityName" type="text" placeholder="write city name">
<input id="btn" type="button" value="filter coordinates" />