Vẽ bán kính xung quanh một điểm trong bản đồ Google

Question

Tôi đang sử dụng API Google Maps và đã thêm điểm đánh dấu. Bây giờ tôi muốn thêm bán kính 10 dặm quanh mỗi điểm đánh dấu, nghĩa là một vòng tròn hoạt động phù hợp trong khi thu phóng. Tôi không có ý tưởng làm thế nào để làm điều đó và có vẻ như nó không phải là một cái gì đó phổ biến.

I found one example that looks good và bạn cũng có thể xem Google Latitude. Ở đó, họ sử dụng các điểm đánh dấu có bán kính, giống như tôi muốn chúng.

Cập nhật: Google Latitude sử dụng an image được chia tỷ lệ, cách thức hoạt động?

Answer 1

Sử dụng API Google Maps V3, tạo đối tượng Vòng kết nối, sau đó sử dụng bindTo() để gắn nó vào vị trí của Marker của bạn (vì chúng là cả hai phiên bản google.maps.MVCObject).

// Create marker 
var marker = new google.maps.Marker({ 
    map: map, 
    position: new google.maps.LatLng(53, -2.5), 
    title: 'Some location' 
}); 

// Add circle overlay and bind to marker 
var circle = new google.maps.Circle({ 
    map: map, 
    radius: 16093, // 10 miles in metres 
    fillColor: '#AA0000' 
}); 
circle.bindTo('center', marker, 'position'); 

Bạn có thể làm cho nó trông giống như vòng tròn Google Latitude bằng cách thay đổi fillColor, strokeColor, strokeWeight vv (full API).

Xem thêm source code and example screenshots.

Answer 2

Dường như phương pháp phổ biến nhất để đạt được điều này là vẽ GPolygon với đủ điểm để mô phỏng một vòng tròn. Ví dụ bạn tham chiếu sử dụng phương pháp này. This page có một ví dụ hay - hãy tìm hàm drawCircle trong mã nguồn.

Answer 3

Trong hình dạng hình cầu được xác định bởi các điểm, đường thẳng và góc giữa các dòng đó. Bạn chỉ có những giá trị thô sơ để làm việc cùng.

Vì vậy, một vòng tròn (theo hình dạng được chiếu lên một hình cầu) là một cái gì đó phải được xấp xỉ bằng cách sử dụng các điểm. Càng nhiều điểm, nó sẽ trông giống một vòng tròn hơn.

Có nói rằng, nhận ra rằng bản đồ google là projecting the earth onto a flat surface (nghĩ rằng "mở khóa" trái đất và kéo dài + san phẳng cho đến khi nó trông "vuông"). Và nếu bạn có một hệ tọa độ phẳng, bạn có thể vẽ các đối tượng 2D lên tất cả những gì bạn muốn.

Nói cách khác, bạn có thể vẽ vòng tròn vectơ được chia tỷ lệ trên bản đồ google. Việc nắm bắt được, bản đồ google không đưa nó cho bạn ra khỏi hộp (họ muốn ở gần như giá trị GIS như là thực tế có thể). Họ chỉ cung cấp cho bạn GPolygon mà họ muốn bạn sử dụng để ước tính một vòng kết nối. Tuy nhiên, this guy did it bằng cách sử dụng vml cho trình duyệt IE và svg cho các trình duyệt khác (xem phần "CẮT KẾT NỐI").

Bây giờ, hãy quay lại câu hỏi của bạn về Google Latitude bằng hình ảnh vòng tròn được chia tỷ lệ (và điều này có thể hữu ích nhất cho bạn): nếu bạn biết bán kính vòng tròn của bạn sẽ không bao giờ thay đổi (ví dụ: điểm), thì giải pháp đơn giản nhất là sử dụng GGroundOverlay, đó chỉ là một url hình ảnh + GLatLngBounds mà hình ảnh đại diện. Công việc duy nhất bạn cần làm sau đó là đánh dấu số GLatLngBounds đại diện cho bán kính 10 dặm của bạn. Một khi bạn đã có, bản đồ google api xử lý mở rộng hình ảnh của bạn khi người dùng phóng to và thu nhỏ.

Answer 4

Tôi đã có vấn đề này trong quá khứ, vì vậy tôi đánh dấu này discussion.

Để tóm tắt nó, bạn có thể:

1. Hãy xem circle filter này của mã nguồn và tìm ra cách để kết hợp nó vào dự án của bạn.
2. Vẽ một GPolygon với đủ điểm để mô phỏng một vòng tròn.
3. Tạo tệp KML bằng cách sửa đổi http://www.nearby.org.uk/google/circle.kml.php?radius=30miles&lat=40.173&long=-105.1024 và sau đó nhập tệp. Trong Google Maps, bạn chỉ có thể dán URI vào hộp tìm kiếm và nó sẽ hiển thị trên bản đồ. Tôi không chắc chắn làm thế nào bạn có thể làm điều đó bằng cách sử dụng API mặc dù.

Answer 5

Tôi vừa viết một bài viết trên blog rằng địa chỉ chính xác này, mà bạn có thể tìm thấy hữu ích: http://seewah.blogspot.com/2009/10/circle-overlay-on-google-map.html

Về cơ bản, bạn cần phải tạo ra một GGroundOverlay với GLatLngBounds đúng. Các bit khó khăn là trong việc làm việc phối hợp góc phía tây nam và tọa độ góc đông bắc của quảng trường tưởng tượng này (GLatLngBounds) bao quanh vòng tròn này, dựa trên bán kính mong muốn. Toán học khá phức tạp, nhưng bạn chỉ có thể tham khảo hàm getDestLatLng trong blog. Phần còn lại nên khá đơn giản.

Answer 6

Đối với một giải pháp API v3, hãy tham khảo:

http://blog.enbake.com/draw-circle-with-google-maps-api-v3

Nó tạo ra vòng tròn xung quanh điểm và sau đó hiển thị các dấu hiệu trong và ngoài phạm vi với màu sắc khác nhau. Họ cũng tính toán bán kính động nhưng trong trường hợp bán kính trường hợp của bạn được cố định để có thể ít công việc hơn.

Answer 7

Dưới đây là một ví dụ khác (hoạt động) trên vòng kết nối, điểm đánh dấu và sự kiện trên google. Xem ở đây

http://kahimyang.info/kauswagan/HowtoBlogs.xhtml?b=513