markerClusterer khi nhấp vào zoom

Question

Tôi vừa thêm MarkerClusterer vào bản đồ google của mình. Nó hoạt động hoàn toàn tốt đẹp.

Tôi chỉ tự hỏi liệu có cách nào điều chỉnh hành vi phóng to khi cụm được nhấp hay không. Tôi muốn thay đổi mức thu phóng nếu có thể.

Có cách nào để đạt được điều này không?

Cảm ơn

Answer 1

Tôi đã sửa đổi sự kiện cụm ảnh như được đề xuất:

/** 
* Triggers the clusterclick event and zoom's if the option is set. 
*/ 
ClusterIcon.prototype.triggerClusterClick = function() { 
var markerClusterer = this.cluster_.getMarkerClusterer(); 

// Trigger the clusterclick event. 
google.maps.event.trigger(markerClusterer, 'clusterclick', this.cluster_); 

if (markerClusterer.isZoomOnClick()) { 
// Zoom into the cluster. 
// this.map_.fitBounds(this.cluster_.getBounds()); 

// modified zoom in function 
this.map_.setZoom(markerClusterer.getMaxZoom()+1); 

} 
}; 

Nó hoạt động tuyệt vời! Thanks a lot

Answer 2

Có vẻ API sẽ chỉ cho phép bạn chuyển đổi các chức năng zoom

http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/docs/reference.html

Vì vậy, bạn sẽ phải chỉnh sửa mã nguồn, nó dường như là trên dòng 1055

/** 
* Triggers the clusterclick event and zoom's if the option is set. 
*/ 
ClusterIcon.prototype.triggerClusterClick = function() { 
    var markerClusterer = this.cluster_.getMarkerClusterer(); 

    // Trigger the clusterclick event. 
    google.maps.event.trigger(markerClusterer, 'clusterclick', this.cluster_); 

    if (markerClusterer.isZoomOnClick()) { 
    // Zoom into the cluster. 
    this.map_.fitBounds(this.cluster_.getBounds()); 
    } 
}; 

Answer 3

Hiện đã có một cập nhật cho mã nguồn MarkerClusterer, cho phép truy cập dễ dàng hơn để sự kiện click:

google.maps.event.addListener(markerCluster, 'clusterclick', function(cluster) { 
    // your code here 
}); 

nơi 'markerCluster' ist đối tượng MarkerCluster. Bên trong chức năng bạn cũng có thể truy cập vào

cluster.getCenter(); 
cluster.getMarkers(); 
cluster.getSize(); 

Tôi sử dụng này để chuyển sang một loại bản đồ khác nhau, như tôi đã sử dụng một bộ gạch tùy chỉnh cho cái nhìn tổng quan dễ dàng hơn trên mức thu phóng thấp hơn:

map.setCenter(cluster.getCenter()); // zoom to the cluster center 
map.setMapTypeId(google.maps.MapTypeId.ROADMAP); // switch map type 
map.setOptions(myMapOptions); // apply some other map options (optional) 

Trân Jack

Answer 4

Bạn có thể thực hiện việc này mà không cần sửa đổi mã nguồn bằng cách sử dụng trình nghe trên sự kiện đánh dấu cụmnhấpClusterer:

var mcOptions = {gridSize: 40, maxZoom: 16, zoomOnClick: false, minimumClusterSize: 2}; 
markerClusterer = new MarkerClusterer(map, markers, mcOptions); 

google.maps.event.addListener(markerClusterer, 'clusterclick', function(cluster){ 
    map.setCenter(cluster.getCenter()); 
    map.setZoom(map.getZoom()+1); 
}); 

tức là. Tôi đặt zoomOnClick = false để kiểm soát tốt hơn hành vi thu phóng bản đồ để kiểm soát số lượng thu phóng và vị trí thu phóng từng trình kích hoạt nhấp chuột.

Answer 5

Nếu ai đó cần viết chức năng này trong coffeescript, tôi đã hợp nhất câu trả lời hàng đầu và câu trả lời được đánh dấu thành một đoạn mã.

mcOptions = 
    maxZoom: 16 

markerCluster = new MarkerClusterer map, markers, mcOptions 
# listener if a cluster is clicked 
google.maps.event.addListener markerCluster, "clusterclick", (cluster) -> 
    if markerCluster.isZoomOnClick() # default is true 
    #get bounds of cluster 
    map.fitBounds cluster.getBounds() 
    #zoom in to max zoom plus one. 
    map.setZoom markerCluster.getMaxZoom() + 1 

Kiểm tra mã này được thu phóng khi nhấp được đặt. Nếu nó phóng to đến thu phóng tối đa cộng một và căn giữa trên cụm. Mã rất đơn giản.