我用Google map Maker创建了一张地图。为此，我导入了5个不同的Excel文件，这些文件都有地址字段，并将它们保存为不同的图层。这张地图现在有大约500个地址，这些地址用别针标记，用颜色编码到它们所属的层。我没有代码，只有我创建的谷歌地图。
无论如何我都可以使用"绘制线"工具或其他方法来选择一组标记/引脚?理想情况下，我设想能够在它们周围绘制一个形状，然后能够选择这些地址，将它们保存为一个新的数据表或图层，以导出回Excel。
有人知道实现这一点的方法吗?即使它是谷歌地图之后的另一款产品?非常感谢你的帮助。
就像这样。
<head>
<style>
html, body, #map-canvas {
height: 400px;
margin: 0px;
padding: 0px
}
</style>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?libraries=geometry"></script>
<script>
var random_marker_locations = [
new google.maps.LatLng(50.7, 4.1),
new google.maps.LatLng(50.4, 4.2),
new google.maps.LatLng(50.1, 4.3),
new google.maps.LatLng(50.8, 4.4),
new google.maps.LatLng(50.5, 4.5),
new google.maps.LatLng(50.2, 4.6),
new google.maps.LatLng(50.9, 4.7),
new google.maps.LatLng(50.6, 4.8),
new google.maps.LatLng(50.3, 4.9)
]
var map;
var markers = [];
var polygon;
var polygonMarkers = [];
var polygonLocations = [];
var mapOptions = {
zoom: 8,
center: new google.maps.LatLng(50.40, 4.34), // Brussels, Belgium
mapTypeId: google.maps.MapTypeId.ROADMAP
};
function initialize() {
map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
// add markers
for(var i in random_marker_locations) {
var marker = new google.maps.Marker({position: random_marker_locations[i], map: map, title: 'marker ' + i});
markers.push(marker);
}
// add a click on map event
google.maps.event.addListener(map, 'click', function(e) {
// set a marker there, with a small measle icon
var position = e.latLng;
polygonLocations.push(position);
polygonMarkers.push(new google.maps.Marker({
icon: 'https://maps.gstatic.com/intl/en_ALL/mapfiles/markers2/measle.png',
position: position,
map: map
}));
// now let's add a polygon
drawPolygon(polygonLocations);
});
}
// draws a polygon
function drawPolygon(points) {
if(points.length < 3) {
return;
}
// first delete the previous polygon
if(polygon) {
polygon.setMap(null);
}
// @see https://developers.google.com/maps/documentation/javascript/examples/polygon-simple
polygon = new google.maps.Polygon({
paths: points,
strokeColor: '#FF0000',
strokeOpacity: 0.8,
strokeWeight: 2,
fillColor: '#FF0000',
fillOpacity: 0.35,
map: map
});
// display to input
displaySelectedMarkers(polygon);
}
// display the selected markers to input.
function displaySelectedMarkers(polygon) {
// empty the input
document.getElementById('selected_markers').value = '';
var a=0; // I use this to set a comma between the values, but no comma at the end
for(var i in random_marker_locations) {
// @see https://developers.google.com/maps/documentation/javascript/examples/poly-containsLocation
if (google.maps.geometry.poly.containsLocation(random_marker_locations[i], polygon)) {
document.getElementById('selected_markers').value += (a++>0 ? ', ' : '') + i ;
}
}
}
function clearSelection() {
if(polygon) {
polygon.setMap(null);
}
for (var i in polygonMarkers) {
polygonMarkers[i].setMap(null);
}
polygonLocations = [];
document.getElementById('selected_markers').value = '';
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<div id="map-canvas"></div>
<hr>
<input id="selected_markers"><br>
<input type="button" onclick="clearSelection()" value="Clear polygon"><br>
Click to select a polygon selection around the markers
</body>