ym.modules.provider.MarkerClusterGroup

Anleitung

Überblick

Stellt ein MarkerClusterGroup-Objekt zur Verfügung. Dieses ermöglicht es Marker, die nahe zueinander liegen, zu einem Cluster zusammenzufassen und je nach Zoomstufe in der Karte wieder aufzulösen. Ein Cluster wird als ein Element auf der Karte angezeigt.

var markers = ym.markerClusterGroup({
	spiderfyOnMaxZoom: false,
	showCoverageOnHover: false,
	zoomToBoundsOnClick: false
});

Initialisierung

Factory: ym.markerClusterGroup(options)

Instanziiert ein MarkerClusterGroup-Objekt mit optional mit den unten beschriebenen MarkerClusterGroup-Optionen.

Parameter

Name	Beschreibung	Datentyp	Standardwert
`options`	[optional]	`Object`	`null`

Parameter: options

Name	Beschreibung	Datentyp	Standardwert
`showCoverageOnHover`	Wenn man mit der Maus über einen Cluster fährt, werden die Grenzen des Clusters durch ein Polygon eingezeichnet.	`bool`	`true`
`zoomToBoundsOnClick`	Wenn man auf ein Cluster mit der Maus klickt, wird zu dem Clustergrenzen hineingezoomt.	`bool`	`true`
`spiderfyOnMaxZoom`	Wenn das letzte Zoomlevel der Karte erreicht wird, werden bei einem Klick auf dem Cluster bei übereinanderliegenden Markern auf der Karte mit Linien (Spinnenbeine) vom Mittelpunkt auseinandergezogen.	`bool`	`true`
`spiderLegPolylineOptions`	Ermöglicht das Festlegen von Polyline-Optionen, um das Aussehen Spinnenbeine zu definieren.	`polyline option`	`{ weight: 1.5, color: '#222', opacity: 0.5 }`
`disableClusteringAtZoom`	Deaktiviert ab einem bestimmten Zoomlevel das Clustern. Das maximale Zoomlevel ist 19. Siehe auch spiderfyOnMaxZoom.	`Number`	`none`
`removeOutsideVisibleBounds`	Marker und Cluster, die sich nicht im Sichtfeld der Karte befinden, werden ausgeblendet. Dient zur besseren Performance.	`bool`	`true`
`maxClusterRadius`	Gibt den Abstand in Pixel an vom zentralen Marker, der vom Cluster abgedeckt wird. Bei einer kleinen Pixelanzahl werden mehrere kleinere Cluster mit Markern erstellt.	`Number`	`80`
`polygonOptions`	Optionen die Übergeben werden, wenn ein ym.Polygon(points, options) für die Grenzen übergeben wird.	`ym.Polygon(points, options)`	`null`
`singleMarkerMode`	Wenn aktiviert, werden alle Marker als Cluster mit einem Element angezeigt. Dabei wird das Icon der Marker überschrieben.	`bool`	`false`
`spiderfyDistanceMultiplier`	Erlaubt es, den Anstand der Spinnenbeine zum Mittelpunkt zu erhöhen. Zum Beispiel wenn man große Icons verwendet für die Marker.	`Number`	`1`
`iconCreateFunction`	Erlaubt es, eine eigene Funktion zu übergeben, um eigene Icons und dessen Inhalt für das Clustern zu gestalten. Für mehr Informationen, siehe ym.modules.provider.MarkerCluster mit zum Beispiel den Methoden getChildCount() und getAllChildMarkers(). `function(cluster) {return L.divIcon({ html: '<b>' + cluster.getChildCount() + '</b>' });}</code></td>`	`function (MarkerCluster cluster)`	`null`
`animate`	Aktiviert oder deaktiviert die Animation beim Auflösen und Zusammenführen von Clustern und Spinnenbeinen.	`bool`	`true`
`animateAddingMarkers`	Falls true gesetzt werden Marker, die zur MarkerClusterGroup hinzugefügt werden, per Animation zum Cluster hinzugefügt. Dies funktioniert nur mit addLayer und nicht addLayers. Ist für eine bessere Performance standardmäßig deaktiviert.	`bool`	`false`
`clusterPane`	Erlaubt das Zuordnen einer MapPane wo das Cluster hinzugefügt wird. Eine Map Pane erlaubt das Gruppieren von Layern.	`Pane`	`markerPane`
`chunkedLoading`	Aktiviert das Hinzufügen der Marker in aufgeteilten Zyklen, um ein Einfrieren das Browser Fensters zu verhindern, bei großen Datenmengen.	`bool`	`false`
`chunkInterval`	Zeit in Millisekunden, nach dem das Hinzufügen von addLayers pausiert wird, das andere Prozesse der Seite durchgeführt werden können.	`Number`	`200`
`chunkDelay`	Zeit in Millisekunden, nachdem addLayers pausiert wird, dass andere Prozesse der Seite ausgeführt werden können.	`Number`	`50`
`chunkProgress`	Callback Funktion, die nach jedem chunkInterval ausgeführt wird. Ermöglicht z.B das Implementieren einer Fortschrittsanzeige des Prozesses.	`function(number MarkersProcessed, number MarkersTotal, number elapsedTimeInMs, layersArray) {}`	`null`

Methoden

Hinzufügen und entfernen von Markern

Name	Rückgabe	Beschreibung
`addLayer(ILayer layer)`	`this`	Fügt dem Cluster die angegebene Ebene mit Markern hinzu.
`removeLayer(ILayer layer)`	`this`	Entfernt aus dem Cluster die angegebene Ebene mit Markern.

Massenhaftes hinzufügen und entfernen von Markern

Name	Rückgabe	Beschreibung
`addLayers(ILayer layer)`	`this`	Fügt dem Cluster die angegebene Ebenen mit Markern hinzu.
`removeLayers(ILayer layer)`	`this`	Entfernt aus dem Cluster die angegebene Ebenen mit Markern.
`clearLayers()`	`this`	Entfernt aus dem Cluster alle Ebenen mit Markern.

Rückgabe des sichtbaren Elements eines Markers

Name	Rückgabe	Beschreibung
`getVisibleParent(Marker marker)`	`IMarker oder ICluster`	Gibt das sichtbare Element zurück, wenn es auf der Karte sichtbar ist. Entweder den Marker oder den Cluster. Wenn das Element nicht sichtbar ist, wird null zurückgegeben.

Aktualisieren von Cluster Icons

Name	Rückgabe	Beschreibung
`refreshClusters()`	`None`	Erzwingt das alle Cluster Icons in der MarkerClusterGroup aktualisiert werden
`refreshClusters(Marker)`	`None`	Erzwingt das Aktualisieren des Cluster-Icons, in der sich der übergebene Marker befindet.
`refreshClusters(Marker[])`	`None`	Erzwingt das alle Cluster-Icons, in der sich die übergebenen Marker befinden, aktualisiert werden.
`refreshClusters(LayerGroup)`	`None`	Erzwingt das alle Cluster-Icons, die mit den Markern der übergebenen LayerGroup in Zusammenhang stehen, aktualisiert werden.

Andere Methoden

Name	Rückgabe	Beschreibung
`hasLayer(Layer)`	`Layer`	Gibt true zurück, wenn sich der Layer (Marker) in der MarkerClusterGroup befindet.
`zoomToShowLayer(Layer, callback)`	`None`	Zoomt zu dem übergebenen Marker und ruft die Callback-Funktion auf, wenn der Marker sichtbar auf der Karte wird.

Events

Marker Events wie click, mouseover, usw. sind den Markern im Cluster zugeordnet. Um Events für einen Cluster zu registrieren, geht man wie folgt vor: 'cluster' + '<eventName>', zum Beispiel: clusterclick, clustermouseover, clustermouseout.

markers.on('clusterclick', function (a) {
	console.log('marker ' + a.layer);
});

Ereignis	Ereignis-Objekt	Beschreibung
`clusterclick`	MouseEvent	Wird ausgelöst, wenn auf ein Cluster mit der Maus geklickt wird.
`clustermouseover`	MouseEvent	Wird ausgelöst, wenn in die Elementgrenzen des Clusters mit der Maus gefahren wird.
`clustermouseout`	MouseEvent	Wird ausgelöst, wenn die Elementgrenzen des Clusters mit der Maus verlassen wird.
`animationend`	Event	Wird ausgelöst, wenn die Animation für das Cluster zusammengefasst oder auflösen beendet wird.
`spiderfied`	ClusterEvent	Wird ausgelöst, wenn übereinanderliegende Marker auf der Karte mit Linien (Spinnenbeine) vom Mittelpunkt auseinandergezogen werden. (Beinhaltet Marker und Cluster Attribute).
`unspiderfied`	ClusterEvent	Wird ausgelöst, wenn übereinanderliegende Marker auf der Karte mit Linien (Spinnenbeine) vom Mittelpunkt wieder zu einem Cluster zusammengefasst werden. (Beinhaltet Marker und Cluster Attribute).

Das könnte Sie auch interessieren:

Jetzt Beispiel ansehen

ym.modules.provider.MarkerCluster