我正在尝试为网站创建属性搜索，用户可以在其中在Google地图上绘制多边形，并且将显示边界内的相关属性。
我有一组根据数据库中的经/纬度定义创建的标记。多边形完成后，我遍历标记并使用containsLocation与多边形进行比较。如果containsLocation返回false，则从地图中删除标记。
不幸的是，这行不通-多边形之外很长一段距离的许多属性保持不变，我不知道为什么。我在下面包含了我的JS，以及指向JSFiddle的链接，您可以在其中看到实际的效果：
jQuery(function() {
map = new google.maps.Map(document.getElementById('search_map'), {
zoom: 10,
center: {lat: 53.1877837, lng: -2.890695400000027}
});
var markers = [];
var properties = [
{"lat":"53.19744","lng":"-2.90324"},{"lat":"53.20113","lng":"-2.88327"},{"lat":"53.19467","lng":"-2.89708"},{"lat":"53.19408","lng":"-2.90420"},{"lat":"53.19122","lng":"-2.86685"},{"lat":"53.19157","lng":"-2.87039"},{"lat":"53.19495","lng":"-2.90185"},{"lat":"53.19912","lng":"-2.90328"},{"lat":"53.19744","lng":"-2.89996"},{"lat":"53.19939","lng":"-2.90310"},{"lat":"53.19955","lng":"-2.90304"},{"lat":"53.18981","lng":"-2.89322"},{"lat":"53.19707","lng":"-2.89818"},{"lat":"53.19246","lng":"-2.86232"},{"lat":"53.19694","lng":"-2.89845"},{"lat":"53.19248","lng":"-2.87886"},{"lat":"53.19393","lng":"-2.90255"},{"lat":"53.19675","lng":"-2.89979"},{"lat":"53.19426","lng":"-2.90188"},{"lat":"53.28044","lng":"-2.89737"},{"lat":"53.27536","lng":"-2.93683"},{"lat":"53.16830","lng":"-3.08807"},{"lat":"53.17966","lng":"-2.90035"},{"lat":"53.27380","lng":"-2.89055"},{"lat":"53.20563","lng":"-2.92282"},{"lat":"53.20092","lng":"-2.89327"},{"lat":"53.19120","lng":"-2.86799"},{"lat":"53.18154","lng":"-2.88894"},{"lat":"53.19474","lng":"-2.88410"},{"lat":"53.19995","lng":"-2.89468"},{"lat":"53.19354","lng":"-2.88157"},{"lat":"53.21982","lng":"-2.88244"},{"lat":"53.20004","lng":"-2.89296"},{"lat":"53.19487","lng":"-2.87742"},{"lat":"53.19640","lng":"-2.88485"},{"lat":"53.22933","lng":"-2.95355"},{"lat":"53.21318","lng":"-2.87070"},{"lat":"53.20609","lng":"-2.92817"},{"lat":"53.19710","lng":"-2.87817"},{"lat":"53.18776","lng":"-2.89100"},{"lat":"53.19487","lng":"-2.87742"},{"lat":"53.17526","lng":"-2.91006"},{"lat":"53.19338","lng":"-2.88320"},{"lat":"53.18978","lng":"-2.86599"},{"lat":"53.19143","lng":"-2.88282"},{"lat":"53.19479","lng":"-2.88436"}
];
for (var i = 0; i < properties.length; i++) {
var markerPosition = new google.maps.LatLng(parseFloat(properties[i].lat), parseFloat(properties[i].lng));
var marker = new google.maps.Marker({
position: markerPosition,
map: map
});
// Add it to the array
markers.push(marker);
}
var drawingManager = new google.maps.drawing.DrawingManager({
drawingMode: google.maps.drawing.OverlayType.POLYGON,
drawingControl: false,
drawingControlOptions: {
drawingModes: ['polygon']
}
});
drawingManager.setMap(map);
google.maps.event.addListener(drawingManager, 'overlaycomplete', function(polygon) {
for (var i = 0; i < markers.length; i++) {
if (!google.maps.geometry.poly.containsLocation(markers[i].position, polygon.overlay)) {
markers[i].setMap(null);
markers.splice(i, 1);
}
}
jQuery('#result').text(markers.length + ' properties found');
});
});
https://jsfiddle.net/mwttowd8/21/
我已经剥离了我的代码，而它仍然没有返回正确的标记。我也尝试过使用经纬度对象而不是google maps LatLng对象，但还是没有运气-我不确定还有什么尝试！
最佳答案
我将您的监听器编辑为以下内容：
google.maps.event.addListener(drawingManager, 'overlaycomplete', function(polygon) {
var locationsFound = 0;
for (var i = 0; i < markers.length; i++) {
if (!google.maps.geometry.poly.containsLocation(markers[i].position, polygon.overlay)) {
markers[i].setMap(null);
markers.splice(i, 0);
} else if (google.maps.geometry.poly.containsLocation(markers[i].position, polygon.overlay)){
locationsFound ++;
}
}
$('#result').text(locationsFound + ' properties found');
});
不幸的是获得一些属性有点麻烦。如果您需要对标记做任何事情（即获取位置），则不确定如何进行。
由于某些原因，数组拼接无法正常工作：
markers.splice(i, 1);，当我将其更改为：markers.splice(i, 0);或将其完全删除时，标记全部正确消失了编辑：将多边形中存在的标记存储为
locArray的更好的解决方案google.maps.event.addListener(drawingManager, 'overlaycomplete', function(polygon) {
var locArray=[];
for (var i = 0; i < markers.length; i++) {
if (!google.maps.geometry.poly.containsLocation(markers[i].position, polygon.overlay)) {
markers[i].setMap(null);
} else if (google.maps.geometry.poly.containsLocation(markers[i].position, polygon.overlay)){
locArray.push(markers[i]);
}
}
$('#result').text(locArray.length + ' properties found');
});