mirror of
https://github.com/stylersnico/librenms.git
synced 2026-07-27 00:25:06 +02:00
Move defaults out to their own file and use them for marker-clustering-everything. Gives people an easy way to use clustering with all the defaults.
This commit is contained in:
@@ -0,0 +1,54 @@
|
||||
(function () {
|
||||
L.MarkerClusterDefault = {
|
||||
iconCreateFunction: function (childCount) {
|
||||
var c = ' marker-cluster-';
|
||||
if (childCount < 10) {
|
||||
c += 'small';
|
||||
} else if (childCount < 100) {
|
||||
c += 'medium';
|
||||
} else {
|
||||
c += 'large';
|
||||
}
|
||||
|
||||
return new L.DivIcon({ html: '<div><span>' + childCount + '</span></div>', className: 'marker-cluster' + c, iconSize: new L.Point(40, 40) });
|
||||
},
|
||||
|
||||
_shownPolygon: null,
|
||||
|
||||
bindEvents: function (map, markerClusterGroup) {
|
||||
var me = this;
|
||||
|
||||
//Zoom cluster click or spiderfy if we are at the lowest level
|
||||
markerClusterGroup.on('clusterclick', function (a) {
|
||||
if (map.getMaxZoom() === map.getZoom()) {
|
||||
a.layer.spiderfy();
|
||||
} else {
|
||||
a.layer.zoomToBounds();
|
||||
}
|
||||
});
|
||||
|
||||
//Show convex hull (boundary) polygon on mouse over
|
||||
markerClusterGroup.on('clustermouseover', function (a) {
|
||||
if (me._shownPolygon) {
|
||||
map.removeLayer(me._shownPolygon);
|
||||
}
|
||||
if (a.layer.getChildCount() > 2) {
|
||||
me._shownPolygon = new L.Polygon(a.layer.getConvexHull());
|
||||
map.addLayer(me._shownPolygon);
|
||||
}
|
||||
});
|
||||
markerClusterGroup.on('clustermouseout', function (a) {
|
||||
if (me._shownPolygon) {
|
||||
map.removeLayer(me._shownPolygon);
|
||||
me._shownPolygon = null;
|
||||
}
|
||||
});
|
||||
map.on('zoomend', function () {
|
||||
if (me._shownPolygon) {
|
||||
map.removeLayer(me._shownPolygon);
|
||||
me._shownPolygon = null;
|
||||
}
|
||||
});
|
||||
}
|
||||
};
|
||||
}());
|
||||
@@ -31,6 +31,11 @@ L.MarkerCluster = L.Marker.extend({
|
||||
return storageArray;
|
||||
},
|
||||
|
||||
//Returns the count of how many child markers we have
|
||||
getChildCount: function () {
|
||||
return this._childCount;
|
||||
},
|
||||
|
||||
//Zoom to the extents of this cluster
|
||||
zoomToBounds: function () {
|
||||
this._group._map.fitBounds(this._bounds);
|
||||
|
||||
@@ -7,18 +7,7 @@ L.MarkerClusterGroup = L.FeatureGroup.extend({
|
||||
|
||||
options: {
|
||||
maxClusterRadius: 60, //A cluster will cover at most this many pixels from its center
|
||||
iconCreateFunction: function (childCount) {
|
||||
var c = ' marker-cluster-';
|
||||
if (childCount < 10) {
|
||||
c += 'small';
|
||||
} else if (childCount < 100) {
|
||||
c += 'medium';
|
||||
} else {
|
||||
c += 'large';
|
||||
}
|
||||
|
||||
return new L.DivIcon({ html: '<div><span>' + childCount + '</span></div>', className: 'marker-cluster' + c, iconSize: new L.Point(40, 40) });
|
||||
}
|
||||
iconCreateFunction: L.MarkerClusterDefault ? L.MarkerClusterDefault.iconCreateFunction : null
|
||||
},
|
||||
|
||||
initialize: function (options) {
|
||||
|
||||
Reference in New Issue
Block a user