Google Maps Api v3 - tìm điểm đánh dấu gần nhất


89

Khi tôi nhấp vào bản đồ, cách tốt nhất để tìm điểm đánh dấu hoặc điểm đánh dấu gần nhất? có một số chức năng trong api sẽ giúp tôi làm điều đó?

đó là google map api v3.


1
Bạn có sử dụng bất kỳ cơ sở dữ liệu nào để lưu trữ coords của các điểm đánh dấu không?
Argiropoulos Stavros

chắc chắn, các vị trí điểm đánh dấu được lưu trữ trong cơ sở dữ liệu mysql.
user198003,

Câu trả lời:


112

Đầu tiên bạn phải thêm eventlistener

google.maps.event.addListener(map, 'click', find_closest_marker);

Sau đó, tạo một hàm lặp qua mảng đánh dấu và sử dụng công thức hasrsine để tính toán khoảng cách của mỗi điểm đánh dấu từ lần nhấp chuột.

function rad(x) {return x*Math.PI/180;}
function find_closest_marker( event ) {
    var lat = event.latLng.lat();
    var lng = event.latLng.lng();
    var R = 6371; // radius of earth in km
    var distances = [];
    var closest = -1;
    for( i=0;i<map.markers.length; i++ ) {
        var mlat = map.markers[i].position.lat();
        var mlng = map.markers[i].position.lng();
        var dLat  = rad(mlat - lat);
        var dLong = rad(mlng - lng);
        var a = Math.sin(dLat/2) * Math.sin(dLat/2) +
            Math.cos(rad(lat)) * Math.cos(rad(lat)) * Math.sin(dLong/2) * Math.sin(dLong/2);
        var c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1-a));
        var d = R * c;
        distances[i] = d;
        if ( closest == -1 || d < distances[closest] ) {
            closest = i;
        }
    }

    alert(map.markers[closest].title);
}

Điều này theo dõi các điểm đánh dấu gần nhất và cảnh báo tiêu đề của nó.

Tôi có các điểm đánh dấu của mình dưới dạng một mảng trên đối tượng bản đồ của tôi


2
Không phải để mở một chủ đề cũ, nhưng tôi đã cố gắng thực hiện điều này, và có vẻ như tìm kiếm về phía đông thay vì tìm kiếm gần nhất. Vì vậy, nếu tôi tìm kiếm một vị trí, nó sẽ tìm kiếm về phía đông và tìm gần nhất theo cách đó, ngay cả khi CÓ THỰC SỰ đóng ở phía tây. Điều đó có ý nghĩa?
LeeR

@Lee - nó có lý, nhưng tôi không thể lặp lại vấn đề
Galen

1
Vâng, điều này hoàn toàn không hiệu quả với tôi - hãy đưa tôi đến địa điểm California của chúng tôi và tôi đang ở NY. Và có một điểm đánh dấu ở vị trí của tôi. Nó đã tìm thấy một điểm đánh dấu mặc dù!
mheavers

@mheavers - Có lỗi trong mã. thay đổi từ (i = 1 thành from (i = 0. Nó không bao gồm điểm đánh dấu đầu tiên.
Galen

1
@Magico bạn không thể biến javascript thành mã php. bạn có thể viết một trình bao bọc php tạo mã javascript như trong câu trả lời. Nếu bạn không thể làm điều đó một mình, không sử dụng php ở tất cả ...
Daniel W.


30

Tôi muốn mở rộng đề xuất của Leor cho bất kỳ ai còn bối rối về cách tính toán vị trí gần nhất và thực sự cung cấp một giải pháp hiệu quả:

Tôi đang sử dụng các điểm đánh dấu trong một markersmảng, ví dụ var markers = [];.

Sau đó, chúng ta hãy xác định vị trí của mình như là var location = new google.maps.LatLng(51.99, -0.74);

Sau đó, chúng tôi chỉ cần giảm các điểm đánh dấu của chúng tôi so với vị trí chúng tôi có như vậy:

markers.reduce(function (prev, curr) {

    var cpos = google.maps.geometry.spherical.computeDistanceBetween(location.position, curr.position);
    var ppos = google.maps.geometry.spherical.computeDistanceBetween(location.position, prev.position);

    return cpos < ppos ? curr : prev;

}).position

Những gì bật ra là LatLngđối tượng đánh dấu gần nhất của bạn .


1
câu trả lời tuyệt vời!
Cesar Alonso

Câu trả lời gọn gàng và sạch sẽ!
TheeBen

Điều này có thể được sử dụng để sắp xếp các điểm đánh dấu theo khoảng cách, thay vì sau đó chỉ trả lại một?
Louis W

Chắc chắn rồi @Louis, tra cứu phương pháp lọc. Bạn có thể sử dụng điều đó để sắp xếp chúng
Jonathan

1
Tôi đã làm cho nó hoạt động bằng cách xóa vị trí trên đối tượng vị trí; như vậy: computeDistanceBetween (location, prev.position) ... vì vị trí đã là một đối tượng LatLng.
holm50

9

Công thức trên không phù hợp với tôi, nhưng tôi đã sử dụng công thức này mà không gặp bất kỳ vấn đề gì. Chuyển vị trí hiện tại của bạn đến hàm và lặp qua một loạt các điểm đánh dấu để tìm vị trí gần nhất:

function find_closest_marker( lat1, lon1 ) {    
    var pi = Math.PI;
    var R = 6371; //equatorial radius
    var distances = [];
    var closest = -1;

    for( i=0;i<markers.length; i++ ) {  
        var lat2 = markers[i].position.lat();
        var lon2 = markers[i].position.lng();

        var chLat = lat2-lat1;
        var chLon = lon2-lon1;

        var dLat = chLat*(pi/180);
        var dLon = chLon*(pi/180);

        var rLat1 = lat1*(pi/180);
        var rLat2 = lat2*(pi/180);

        var a = Math.sin(dLat/2) * Math.sin(dLat/2) + 
                    Math.sin(dLon/2) * Math.sin(dLon/2) * Math.cos(rLat1) * Math.cos(rLat2); 
        var c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1-a)); 
        var d = R * c;

        distances[i] = d;
        if ( closest == -1 || d < distances[closest] ) {
            closest = i;
        }
    }

    // (debug) The closest marker is:
    console.log(markers[closest]);
}

1
Làm thế nào để bạn điền markersmảng? Đó là bằng cách tạo một điểm đánh dấu bằng cách sử dụng var marker1 = new google.maps.Marker({ ... })?
mê hoặc

1
@enchance tôi phải làm điều này: map.markers = map.markers || [];sau đó cho mỗi điểm đánh dấumap.markers.push(marker);
Travis


4

Đây là một chức năng khác hoạt động hiệu quả đối với tôi, trả về khoảng cách tính bằng km:

 function distance(lat1, lng1, lat2, lng2) {
        var radlat1 = Math.PI * lat1 / 180;
        var radlat2 = Math.PI * lat2 / 180;
        var radlon1 = Math.PI * lng1 / 180;
        var radlon2 = Math.PI * lng2 / 180;
        var theta = lng1 - lng2;
        var radtheta = Math.PI * theta / 180;
        var dist = Math.sin(radlat1) * Math.sin(radlat2) + Math.cos(radlat1) * Math.cos(radlat2) * Math.cos(radtheta);
        dist = Math.acos(dist);
        dist = dist * 180 / Math.PI;
        dist = dist * 60 * 1.1515;

        //Get in in kilometers
        dist = dist * 1.609344;

        return dist;
    }

3

Sử dụng phương thức API bản đồ computeDistanceBetween () của Google để tính toán điểm đánh dấu gần giữa vị trí của bạn và danh sách điểm đánh dấu trên bản đồ google.

Các bước: -

  1. Tạo điểm đánh dấu trên bản đồ google.
    function addMarker(location) { var marker = new google.maps.Marker({ title: 'User added marker', icon: { path: google.maps.SymbolPath.BACKWARD_CLOSED_ARROW, scale: 5 }, position: location, map: map }); }

  2. Khi nhấp chuột, hãy tạo sự kiện để xác định độ dài, độ dài của vị trí của bạn và chuyển nó đến find_closest_marker ().

    function find_closest_marker(event) {
          var distances = [];
          var closest = -1;
          for (i = 0; i < markers.length; i++) {
            var d = google.maps.geometry.spherical.computeDistanceBetween(markers[i].position, event.latLng);
            distances[i] = d;
            if (closest == -1 || d < distances[closest]) {
              closest = i;
            }
          }
          alert('Closest marker is: ' + markers[closest].getTitle());
        }
    

truy cập liên kết này theo các bước. Bạn sẽ có thể đến gần điểm đánh dấu hơn đến vị trí của mình.

Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.