JavaScript
Web
GoogleMapsAPI

Google Maps APIのMarker Clusterers libraryを使用した際のcluster iconのclick event

やりたいこと

cluster iconをクリックしたときの挙動を変えたい(デフォルトはクリックするとズームする)

コード

markerclusterer.js
/**
 * 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());
  }
};

ライブラリの上記がcluster iconがクリックされた時のイベント部分です。
markerClusterer.isZoomOnClickはmarkerClustererのオプションです。

Name Type Description
zoomOnClick boolean Whether the default behaviour of clicking on a cluster is to zoom into it.

zoomOnClickがtrueのときにズームされるみたいです。
単純に常にズームしないのであればzoomOnClick:falseにすれば良いです。
また、例えばズームレベルが9未満のときにのみズームさせるのであれば、if (markerClusterer.isZoomOnClick()) {の部分に以下を追記すれば良いです。

markerclusterer.js
  if (markerClusterer.isZoomOnClick()) {
    if(this.map_.getZoom() < 9){
    // Zoom into the cluster.
    this.map_.fitBounds(this.cluster_.getBounds());
    }
  }

私の場合は、単にmapをドラッグしたいだけなのに、cluster iconのところでドラッグしてしまうと、ドラッグした後にズームしてしまう:pouting_cat:のをなんとかしたかったので、上記の部分を「ドラッグしていたらズームしない」というように変えました。

参考:Gmaps Marker Clusterer