google-maps - 如何在谷歌地图上绘制任意点？

Question

我有一组自定义位置，我有一个网页。

在我的网页上，我有一个功能正常的谷歌地图（使用 API 的 v3）。

如果您输入一个地址，它将以该地址为中心。没有什么令人兴奋的。

当用户输入一个位置时，我希望地图在他们输入的位置的某个半径范围内包含我的任何自定义位置。

有人可以指出我这样做的 API 参考吗？我知道这并不难，但对于我的生活，我找不到一个好的参考或例子。

Answer 1

您可以通过以下方式计算两点之间的距离

computeDistanceBetween

更多信息在这里

更多关于几何库的信息在这里

Answer 2

事实证明，使用标记非常容易。AddCustomLocationsToMap 函数完成了真正的工作，如下所示。感谢这篇博文作为起点。

function FocusMapOnAddress(address) {
    var mapCenter;
    geocoder.geocode({ 'address': address }, function (results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            cdamap.setCenter(results[0].geometry.location);
            mapCenter = results[0].geometry.location;
            var marker = new google.maps.Marker({
                map: cdamap,
                position: mapCenter
            });
        } else {
            alert("Address could not be resolved due to an error: " + status);
        }
    });

    //if we actually know where they are (i.e., valid address) then zoom and show locations
    if (mapCenter != null) {
        AddCustomLocationsToMap();
        SetMapZoomLevel(mapCenter, SearchRadiusInMeters());
    }
}

var locations = [
    ['High Park', 43.6516699, -79.4652915, 4,'Our High Park Office is open from 9am - 5pm'],
    ['King Street CDA Office', 32.775692, -79.932863, 5,'Our King Stret Office is open from 8am - 4pm'],
    ['Cronulla Beach', -34.028249, 151.157507, 3,''],
    ['Manly Beach', -33.80010128657071, 151.28747820854187, 2,''],
    ['Maroubra Beach', -33.950198, 151.259302, 1,'']
];

function AddCustomLocationsToMap() {
    //show custom locations, pulled from the "locations" array
    for (i = 0; i < locations.length; i++) {
        marker = new google.maps.Marker({
            position: new google.maps.LatLng(locations[i][1], locations[i][2]),
            map: cdamap
        });

        google.maps.event.addListener(marker, 'click', (function (marker, i) {
            return function () {
                infowindow.setContent(HTMLForLocation(i));
                infowindow.open(cdamap, marker);
            }
        })(marker, i));
    }
}

function HTMLForLocation(idx) {
    //return HTML for display to the user when they click on the specified location
    var selectedLocation = locations[idx];
    if (selectedLocation != null) {
        return '<b>' + locations[idx][0] + '</b>' + '<br/>' + locations[idx][4];
    }
    else {
        return "Unknown location";
    }
}