google bản đồ v3 thêm một cửa sổ thông tin để một vòng tròn

Question

Có cách nào để thêm một infoWindow đến một vòng tròn được tạo ra bởi google.maps.Circle

một cái gì đó như thế này

var circ = new google.maps.Circle({ 
      center:latlng, 
      clickable:false, 
      fillColor:colors[count], 
      fillOpacity:0.3, 
      map:map, 
      radius:radius, 
      strokeColor:colors[count], 
      strokeOpacity:0.3}); 

và

//create info window 
var infoWindow= new google.maps.InfoWindow({ 
    content: "Your info here" 
    }); 

//add a click event to the circle 
google.maps.event.addListener(circ, 'click', function(){ 
//call the infoWindow 
infoWindow.open(map, circ); 
}); 

hoặc cách khác là có cách tạo điểm đánh dấu vô hình ở giữa vòng tròn có thể được nhấp để truy cập vào thông tinWindow

Answer 1

bạn có thể có cửa sổ thông tin cho lớp phủ vòng kết nối của mình. Nhưng bạn phải điều chỉnh một chút mã của mình.

Trước tiên, cần phải đặt clickable=true cho lớp phủ Vòng kết nối của bạn (nếu không nhấp vào các sự kiện trên vòng kết nối sẽ không được xử lý).

Sau đó, bạn phải thay đổi mã của trình nghe nhấp chuột. Đặt vòng tròn như là một tham số để chức năng mở() không có hiệu lực (Circle không phải là loại thích hợp của MVCObject, cho tài liệu đọc giải thích của InfoWindow .open() chức năng). Để hiển thị cửa sổ thông tin, bạn phải cung cấp vị trí của nó - ví dụ: vị trí của sự kiện click, trung tâm của vòng tròn, ....

Mã này là sau đó

google.maps.event.addListener(circ, 'click', function(ev){ 
    infoWindow.setPosition(ev.latLng); 
    infoWindow.open(map); 
}); 

hoặc

google.maps.event.addListener(circ, 'click', function(ev){ 
    infoWindow.setPosition(circ.getCenter()); 
    infoWindow.open(map); 
}); 

trả lời để bình luận của bạn: Bạn có thể tạo một lừa với một điểm đánh dấu vô hình (chỉ cần đặt hình ảnh hoàn toàn minh bạch như là biểu tượng đánh dấu), nhưng tôi sẽ thích giải pháp với lớp phủ Circle.

Answer 2

để thiết lập cửa sổ thông tin tại nơi chuột nhấp

google.maps.event.addListener(circ, 'click', function(ev){ 
    infoWindow.setPosition(ev.latLng); //<-- ev matches what you put^(mouse event) 
    infoWindow.open(map); 
});