Question

我只是好奇。我有geolocator设置各种标记示例。我如何计算当前位置与标记位置之间的距离。也考虑到地球的曲线等。这是我的JS

var map;
function initMap(){
//constructor creates a new map - only center and zoom are required
map = new google.maps.Map(document.getElementById('map'),{
    center: {lat: 45.325187, lng: -66.2113336},
    zoom: 11,
    mapTypeId: google.maps.MapTypeId.ROADMAP
});

var markers = [];

var locations = [
    {title: 'Ethan House', location:{lat: 45.3631979, lng: -66.2118715}},
    {title: 'Josh House', location:{lat: 45.379291, lng: -66.2199817}},
    {title: 'Luke House', location:{lat: 45.2420391, lng: -66.1485755}},
    {title: 'Jack House', location:{lat: 45.3262894, lng: -66.189719}}
];

var largeInfoWindow = new google.maps.InfoWindow();

//uses location array to create an array of markers on init
for (var i = 0; i < locations.length ;i++) {
    //get the position from locations array
    var position = locations[i].location;
    var title = locations[i].title;
    //Create marker per location and put into markers array
    var marker = new google.maps.Marker({
        map: map,
        position: position,
        title: title,
        animation: google.maps.Animation.DROP,
        id: i
    });
    //Push marker into array of markers
    markers.push(marker);

    //Create an onclick event to open an InfoWindow for each marker
    marker.addListener('click', function(){
        populateInfoWindow(this, largeInfoWindow);
    });
}

document.getElementById('show-listings').addEventListener('click', showListings);
document.getElementById('hide-listings').addEventListener('click', hideListings);




//This function populates the InfoWindow when the marker is clicked
//only allow one InfoWindow which will open at the marker that is clicked
//and populate based on the markers position.
function populateInfoWindow(marker, infowindow){
    //check to make sure the infowindow is not already opened on this marker
    if(infowindow.marker != marker){
        infowindow.marker = marker;
        infowindow.setContent('<div>' + marker.title + '</div>');
        infowindow.open(map, marker);
        //make sure the marker property is cleared if the InfoWindow is closed
        infowindow.addListener('closeclick', function(){
            infowindow.setMarker(null);
        });
    }

}

//This function will loop through the markers array and display them all
function showListings(){
    for(var i = 0; i < markers.length; i++){
        markers[i].setMap(map);
    }
}

//This function will loop through listings and hide them all
function hideListings(){
    for(var i = 0; i < markers.length; i++){
        markers[i].setMap(null);
    }
}

//Check if user supports geo-location
if(navigator.geolocation){
    navigator.geolocation.getCurrentPosition(function(position){
        var latitude = position.coords.latitude;
        var longitude = position.coords.longitude;
        var geolocalpoint = new google.maps.LatLng(latitude, longitude);
        map.setCenter(geolocalpoint);

        var mapOptions = {
            zoom: 8,
            center: geolocalpoint,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        }

        //Place a marker
        var geolocation = new google.maps.Marker({
            position: geolocalpoint,
            map: map,
            title: 'Your geolocation',
            icon: 'http://labs.google.com/ridefinder/images/mm_20_green.png'
        });
    });
}

}

Answer 1

您想要当前位置和标记之间的路线还是距离？

如果只是距离，您可以使用半角公式来计算两个给定坐标之间的距离。计算出的距离是给定坐标（直线）之间的直接连接。

JavaScript示例（Source）：

var R = 6371e3; // meters
var lat1Radians = lat1.toRadians();
var lat2Radians = lat2.toRadians();
var deltaLat = (lat2-lat1).toRadians();
var deltaLon = (lon2-lon1).toRadians();

var a = Math.sin(deltaLat/2) * Math.sin(deltaLat/2) +
        Math.cos(lat1Radians) * Math.cos(lat2Radians) *
        Math.sin(deltaLon/2) * Math.sin(deltaLon/2);
var c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1-a));

var d = R * c;

谷歌地图标记距离？

1 个答案: