在谷歌地图中，当删除标记时，检测数据层标记中的哪个多边形
我有一个带有geojson多边形数据层的谷歌地图。当用户输入地址时，程序会在地图上删除一个标记并放大。然后我想检测标记所在的多边形。有人知道该怎么做吗？
这是我的代码：
//the map
map = new google.maps.Map(document.getElementById("map_canvas"),
myOptions);
map.data.loadGeoJson('js/County_Voting_District_Boundaries.json');
map.data.setStyle(function (feature) {
return {
strokeWeight: 1,
fillColor: 'white',
fillOpacity: 0
};
});
geocoder = new google.maps.Geocoder();
$(function() {
$("#address").autocomplete({
//This bit uses the geocoder to fetch address values
source: function(request, response) {
geocoder.geocode( {'address': request.term }, function(results, status) {
response($.map(results, function(item) {
return {
label: item.formatted_address,
value: item.formatted_address,
latitude: item.geometry.location.lat(),
longitude: item.geometry.location.lng()
}
}));
})
},
//This bit is executed upon selection of an address
select: function(event, ui) {
$("#latitude").val(ui.item.latitude);
$("#longitude").val(ui.item.longitude);
var location = new google.maps.LatLng(ui.item.latitude, ui.item.longitude);
var marker = new google.maps.Marker({
position: location,
map: map,
icon: {
path: fontawesome.markers.MAP_MARKER,
scale: 0.5,
strokeWeight: 0.2,
strokeColor: 'black',
strokeOpacity: 1,
fillColor: '#000000',
fillOpacity: 0.7
}
});
//marker.setPosition(location);
//map.setCenter(location);
map.setZoom(16);
map.setCenter(location);
//how to detect which polygon from the geojson this marker is in??
}
});
});
1 个答案:
答案 0 :(得分：0)
- 使用
map.data.forEach处理GeoJson 中的每个多边形
- 使用
containsLocation确定自动填充返回的位置是否在多边形内（需要从GeoJson数据创建google.maps.Polygon）。
// check all the Polygons in the GeoJson
// detect which polygon from the geojson the marker is in
map.data.forEach(function(feature) {
if (feature.getGeometry().getType() == "Polygon") {
// simplifying assumption, depends on data
// just check first linear ring
var poly = new google.maps.Polygon({
path: feature.getGeometry().getAt(0).getArray()
});
if (google.maps.geometry.poly.containsLocation(marker.getPosition(),poly)) {
// if inside polygon, create an infowindow with some information from the GeoJson
infowindow.setContent(feature.getProperty("Muni_War_1"));
infowindow.setPosition(marker.getPosition());
infowindow.open(map);
}
}
})
代码段
var map;
var marker;
function initMap() {
var infowindow = new google.maps.InfoWindow();
map = new google.maps.Map(document.getElementById('map'), {
zoom: 13,
center: {
lat: 40.460625,
lng: -79.99588680
},
mapTypeId: 'terrain'
});
map.data.addGeoJson(geoJson);
map.data.setStyle(function(feature) {
var color = 'white';
var opacity = 0;
if (feature.getProperty("Muni_War_1") && !feature.getProperty("Muni_War_1").includes("PITTSBURGH")) {
color = "red";
opacity = 1.0;
}
return {
strokeWeight: 1,
fillColor: color,
fillOpacity: opacity
};
});
map.data.addListener("click", function(evt) {
infowindow.setContent(evt.feature.getProperty("Muni_War_1"));
infowindow.setPosition(evt.latLng);
infowindow.open(map);
});
geocoder = new google.maps.Geocoder();
$(function() {
$("#address").autocomplete({
//This bit uses the geocoder to fetch address values
source: function(request, response) {
geocoder.geocode({
'address': request.term
}, function(results, status) {
response($.map(results, function(item) {
return {
label: item.formatted_address,
value: item.formatted_address,
latitude: item.geometry.location.lat(),
longitude: item.geometry.location.lng()
}
}));
})
},
//This bit is executed upon selection of an address
select: function(event, ui) {
$("#latitude").val(ui.item.latitude);
$("#longitude").val(ui.item.longitude);
var location = new google.maps.LatLng(ui.item.latitude, ui.item.longitude);
if (marker && marker.setMap)
marker.setMap(null);
marker = new google.maps.Marker({
position: location,
map: map,
icon: {
path: google.maps.SymbolPath.CIRCLE,
scale: 10,
strokeWeight: 1,
strokeColor: 'black',
strokeOpacity: 1,
fillColor: '#000000',
fillOpacity: 0.7
}
});
map.setZoom(16);
map.setCenter(location);
// detect which polygon from the geojson the marker is in
map.data.forEach(function(feature) {
if (feature.getGeometry().getType() == "Polygon") {
// simplifying assumption, depends on data
// just check first linear ring
var poly = new google.maps.Polygon({
path: feature.getGeometry().getAt(0).getArray()
});
if (google.maps.geometry.poly.containsLocation(marker.getPosition(), poly)) {
infowindow.setContent(feature.getProperty("Muni_War_1"));
infowindow.setPosition(marker.getPosition());
infowindow.open(map);
}
}
})
}
});
});
}
var geoJson = {
"type": "FeatureCollection",
"features": [{
"type": "Feature",
"properties": {
"FID": 534,
"OBJECTID_1": 536,
"DISTRICT_1": 3,
"WARD_1": 22,
"MUNICODE_1": 188,
"YRAPPROV_1": 1988,
"MWD_NOPA_1": "188223",
"OPA_MUNI_1": 100,
"MWD_PAD_1": "18802203",
"Pseud4_12": "0896",
"PseudoNu_5": 896,
"Muni_War_1": "PITTSBURGH WARD 22 DIST 3",
"Shape__Area": 0.000127907996175361,
"Shape__Length": 0.0659785575690809
},
"geometry": {
"type": "Polygon",
"coordinates": [
[
[-80.002624142443, 40.4562269871821],
[-80.0035933144929, 40.4560376379833],
[-80.0066356724928, 40.4554573338665],
[-80.0061439762253, 40.4539491442557],
[-80.006521290141, 40.4538650640496],
[-80.0078864228193, 40.4535994266993],
[-80.0079718876039, 40.4535619750354],
[-80.0080189061968, 40.4535168655953],
[-80.0080441411696, 40.4534654016898],
[-80.0080477408706, 40.453411872229],
[-80.0078777892795, 40.4528851504848],
[-80.0078134887376, 40.4527092097528],
[-80.0077422228331, 40.4524728262537],
[-80.0070017712699, 40.4501769634053],
[-80.0068993686211, 40.4500172154508],
[-80.0067984420914, 40.4499818582879],
[-80.0065246990104, 40.450022363761],
[-80.0057160940111, 40.4501701445634],
[-80.0053895657614, 40.450240615606],
[-80.0049011344983, 40.4503199102387],
[-80.0046032157691, 40.4493656933574],
[-80.004458806661, 40.4489288224128],
[-80.0039687545438, 40.4473459384101],
[-80.0037843594471, 40.4468158018024],
[-80.0033497958882, 40.4456473920009],
[-80.0111254587476, 40.4439551120629],
[-80.0161811284205, 40.4429301523937],
[-80.0168543944643, 40.4448664660582],
[-80.0170196223317, 40.4454675837854],
[-80.0170759557854, 40.4456064355076],
[-80.0172012065068, 40.4460047915118],
[-80.0176245752175, 40.4472923776009],
[-80.0177181480932, 40.4475899304204],
[-80.0178906046362, 40.4482961886296],
[-80.0180723505458, 40.4488909727124],
[-80.0181603279676, 40.4492090571121],
[-80.0182720414924, 40.4494849727946],
[-80.0183156546515, 40.4496862831949],
[-80.0161040571157, 40.4500958996217],
[-80.0149575863167, 40.4503140223605],
[-80.0135553686271, 40.4505697438266],
[-80.0134167970447, 40.4506042948628],
[-80.0137925664527, 40.4517066219642],
[-80.0139867884907, 40.4523260459801],
[-80.0141049912449, 40.4526214882309],
[-80.0143463628347, 40.4533313617738],
[-80.0144931746596, 40.453734538167],
[-80.0145712172817, 40.4539742922987],
[-80.011071359437, 40.4546315446581],
[-80.0105642290626, 40.4547320334041],
[-80.009596943892, 40.4549088196457],
[-80.0103398680634, 40.4571839233437],
[-80.010293773502, 40.4571841076306],
[-80.0094202008413, 40.4573475647093],
[-80.0093560441867, 40.4573507836048],
[-80.0092585654641, 40.4573315813452],
[-80.0084692062732, 40.4574830348794],
[-80.0073583813477, 40.4576830919662],
[-80.0072298534003, 40.4572871691404],
[-80.0058969431478, 40.4575441206315],
[-80.0051273889795, 40.457686598159],
[-80.0030742341891, 40.4579671401622],
[-80.0028164265098, 40.4580095407637],
[-80.0021263604561, 40.4581405724994],
[-80.0017771673076, 40.4570086064529],
[-80.0016720953322, 40.4566878408134],
[-80.0015701762567, 40.4564210735549],
[-80.0017638869273, 40.4563948041385],
[-80.002624142443, 40.4562269871821]
]
]
}
},
{
"type": "Feature",
"properties": {
"FID": 538,
"OBJECTID_1": 540,
"DISTRICT_1": 2,
"WARD_1": 22,
"MUNICODE_1": 188,
"YRAPPROV_1": 1988,
"MWD_NOPA_1": "188222",
"OPA_MUNI_1": 100,
"MWD_PAD_1": "18802202",
"Pseud4_12": "0895",
"PseudoNu_5": 895,
"Muni_War_1": "PITTSBURGH WARD 22 DIST 2",
"Shape__Area": 0.00000975293543784534,
"Shape__Length": 0.0129843994459336
},
"geometry": {
"type": "Polygon",
"coordinates": [
[
[-80.0103398680634, 40.4571839233437],
[-80.009596943892, 40.4549088196457],
[-80.0105642290626, 40.4547320334041],
[-80.011071359437, 40.4546315446581],
[-80.0136238773815, 40.4541519660055],
[-80.0143672533958, 40.4564287314273],
[-80.0131512751921, 40.456661878932],
[-80.0127197958987, 40.456738702397],
[-80.0118625154955, 40.4569101410276],
[-80.0111114410092, 40.4570542133402],
[-80.0103912666814, 40.4571837154917],
[-80.0103398680634, 40.4571839233437]
]
]
}
},
{
"type": "Feature",
"properties": {
"FID": 546,
"OBJECTID_1": 548,
"DISTRICT_1": 1,
"WARD_1": 22,
"MUNICODE_1": 188,
"YRAPPROV_1": 1988,
"MWD_NOPA_1": "188221",
"OPA_MUNI_1": 100,
"MWD_PAD_1": "18802201",
"Pseud4_12": "0894",
"PseudoNu_5": 894,
"Muni_War_1": "PITTSBURGH WARD 22 DIST 1",
"Shape__Area": 0.0000308147124844859,
"Shape__Length": 0.0237471195909311
},
"geometry": {
"type": "Polygon",
"coordinates": [
[
[-80.0136238773815, 40.4541519660055],
[-80.0145712172817, 40.4539742922987],
[-80.0144931746596, 40.453734538167],
[-80.0143463628347, 40.4533313617738],
[-80.0141049912449, 40.4526214882309],
[-80.0139867884907, 40.4523260459801],
[-80.0137925664527, 40.4517066219642],
[-80.0134167970447, 40.4506042948628],
[-80.0135553686271, 40.4505697438266],
[-80.0149575863167, 40.4503140223605],
[-80.0161040571157, 40.4500958996217],
[-80.0183156546515, 40.4496862831949],
[-80.0183375045392, 40.449788310935],
[-80.0188269221208, 40.4513016487001],
[-80.0192610287381, 40.4525859262571],
[-80.019295801723, 40.4526713130121],
[-80.019312422322, 40.4527513887118],
[-80.0197099253879, 40.4539542416605],
[-80.0201121401067, 40.455208252871],
[-80.0199584583864, 40.4552434407956],
[-80.017230563838, 40.4557520809715],
[-80.0165146233212, 40.4558914187249],
[-80.0153513333278, 40.4561038966026],
[-80.0153941495936, 40.4562416941261],
[-80.0143672533958, 40.4564287314273],
[-80.0136238773815, 40.4541519660055]
]
]
}
},
{
"type": "Feature",
"properties": {
"FID": 549,
"OBJECTID_1": 551,
"DISTRICT_1": 4,
"WARD_1": 22,
"MUNICODE_1": 188,
"YRAPPROV_1": 1988,
"MWD_NOPA_1": "188224",
"OPA_MUNI_1": 100,
"MWD_PAD_1": "18802204",
"Pseud4_12": "0897",
"PseudoNu_5": 897,
"Muni_War_1": "PITTSBURGH WARD 22 DIST 4",
"Shape__Area": 0.0000465136084411206,
"Shape__Length": 0.0323893563598957
},
"geometry": {
"type": "Polygon",
"coordinates": [
[
[-80.0014944365421, 40.4526986168497],
[-80.0014091677905, 40.4524189965217],
[-80.0012336091026, 40.4518976093079],
[-80.0009098002375, 40.4508651992806],
[-80.0013437957882, 40.4507835515281],
[-80.0010934503246, 40.4500271310999],
[-80.001015420744, 40.4497622997161],
[-80.0009839860463, 40.4496819950096],
[-80.0008054094602, 40.4491507111661],
[-80.000630566666, 40.4485830579235],
[-80.0005581282399, 40.4483645405515],
[-80.0005059029672, 40.4482266329735],
[-80.0004229866335, 40.4480171580788],
[-80.0002963426545, 40.4477494125711],
[-79.999799554087, 40.4467494748103],
[-79.9999359684549, 40.4466978437281],
[-80.0012484034912, 40.4462503682297],
[-80.0014345837005, 40.4461810509678],
[-80.0015108883732, 40.4461608702575],
[-80.0024295812902, 40.445847626678],
[-80.0033497958882, 40.4456473920009],
[-80.0037843594471, 40.4468158018024],
[-80.0039687545438, 40.4473459384101],
[-80.004458806661, 40.4489288224128],
[-80.0046032157691, 40.4493656933574],
[-80.0049011344983, 40.4503199102387],
[-80.0053895657614, 40.450240615606],
[-80.0057160940111, 40.4501701445634],
[-80.0065246990104, 40.450022363761],
[-80.0067984420914, 40.4499818582879],
[-80.0068993686211, 40.4500172154508],
[-80.0070017712699, 40.4501769634053],
[-80.0077422228331, 40.4524728262537],
[-80.0078134887376, 40.4527092097528],
[-80.0078777892795, 40.4528851504848],
[-80.0080477408706, 40.453411872229],
[-80.0080441411696, 40.4534654016898],
[-80.0080189061968, 40.4535168655953],
[-80.0079718876039, 40.4535619750354],
[-80.0078864228193, 40.4535994266993],
[-80.006521290141, 40.4538650640496],
[-80.0061439762253, 40.4539491442557],
[-80.0066356724928, 40.4554573338665],
[-80.0035933144929, 40.4560376379833],
[-80.002624142443, 40.4562269871821],
[-80.0015483708459, 40.4528550190591],
[-80.0014944365421, 40.4526986168497]
]
]
}
},
]
}html,
body,
#map {
height: 100%;
margin: 0;
padding: 0;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="//code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
<link rel="stylesheet" type="text/css" href="//code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css">
<input id="address" value="Galveston Ave, Pittsburgh, PA" />
<table border="1">
<tr>
<td>Galveston Ave, Pittsburgh, PA</td>
<td>Mimosa Way, Pittsburgh, PA</td>
<td>Brim Way, Pittsburgh, PA</td>
</tr>
</table>
<div id="map"></div>
<script async defer src="https://maps.googleapis.com/maps/api/js?libraries=places&callback=initMap">
</script>
相关问题
最新问题
- 我写了这段代码，但我无法理解我的错误
- 我无法从一个代码实例的列表中删除 None 值，但我可以在另一个实例中。为什么它适用于一个细分市场而不适用于另一个细分市场？
- 是否有可能使 loadstring 不可能等于打印？卢阿
- java中的random.expovariate()
- Appscript 通过会议在 Google 日历中发送电子邮件和创建活动
- 为什么我的 Onclick 箭头功能在 React 中不起作用？
- 在此代码中是否有使用“this”的替代方法？
- 在 SQL Server 和 PostgreSQL 上查询，我如何从第一个表获得第二个表的可视化
- 每千个数字得到
- 更新了城市边界 KML 文件的来源？