[Pkg-javascript-commits] [leaflet-markercluster] 86/479: 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.
Jonas Smedegaard
dr at jones.dk
Thu Oct 16 16:00:13 UTC 2014
This is an automated email from the git hooks/post-receive script.
js pushed a commit to branch master
in repository leaflet-markercluster.
commit bca91c6dc98ee3b729b581cd0ec3a42c27249569
Author: danzel <danzel at localhost.geek.nz>
Date: Tue Jul 24 13:46:35 2012 +1200
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.
---
example/marker-clustering-everything.html | 35 ++------------------
src/MarkerCluster.Default.js | 54 +++++++++++++++++++++++++++++++
src/MarkerCluster.js | 5 +++
src/MarkerClusterGroup.js | 13 +-------
4 files changed, 62 insertions(+), 45 deletions(-)
diff --git a/example/marker-clustering-everything.html b/example/marker-clustering-everything.html
index be6ef72..b91a189 100644
--- a/example/marker-clustering-everything.html
+++ b/example/marker-clustering-everything.html
@@ -12,6 +12,7 @@
<link rel="stylesheet" href="../src/MarkerCluster.css" />
<link rel="stylesheet" href="../src/MarkerCluster.Default.css" />
+ <script src="../src/MarkerCluster.Default.js"></script>
<script src="../src/MarkerClusterGroup.js"></script>
<script src="../src/MarkerCluster.js"></script>
<script src="../src/MarkerCluster.QuickHull.js"></script>
@@ -33,6 +34,7 @@
var map = new L.Map('map', {center: latlng, zoom: 15, layers: [cloudmade]});
var markers = new L.MarkerClusterGroup();
+ L.MarkerClusterDefault.bindEvents(map, markers);
var markersList = [];
function populate() {
@@ -54,39 +56,6 @@
southWest.lat + latSpan * Math.random(),
southWest.lng + lngSpan * Math.random());
}
-
- //Zoom or spiderfy on cluster click
- markers.on('clusterclick', function (a) {
- if (map.getMaxZoom() === map.getZoom()) {
- a.layer.spiderfy();
- } else {
- a.layer.zoomToBounds();
- }
- });
-
- //Show convex hull (boundary) polygon on mouse over
- var polygon;
- var polygonCluster;
- markers.on('clustermouseover', function (a) {
- if (polygon) {
- map.removeLayer(polygon);
- }
- polygon = new L.Polygon(a.layer.getConvexHull());
- map.addLayer(polygon);
- });
- markers.on('clustermouseout', function (a) {
- if (polygon) {
- map.removeLayer(polygon);
- polygon = null;
- }
- });
- map.on('zoomend', function () {
- if (polygon) {
- map.removeLayer(polygon);
- polygon = null;
- }
- });
-
populate();
map.addLayer(markers);
diff --git a/src/MarkerCluster.Default.js b/src/MarkerCluster.Default.js
new file mode 100644
index 0000000..212e28e
--- /dev/null
+++ b/src/MarkerCluster.Default.js
@@ -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;
+ }
+ });
+ }
+ };
+}());
\ No newline at end of file
diff --git a/src/MarkerCluster.js b/src/MarkerCluster.js
index 3ece9f3..c82ad55 100644
--- a/src/MarkerCluster.js
+++ b/src/MarkerCluster.js
@@ -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);
diff --git a/src/MarkerClusterGroup.js b/src/MarkerClusterGroup.js
index 856bb3d..1d2f78a 100644
--- a/src/MarkerClusterGroup.js
+++ b/src/MarkerClusterGroup.js
@@ -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) {
--
Alioth's /usr/local/bin/git-commit-notice on /srv/git.debian.org/git/pkg-javascript/leaflet-markercluster.git
More information about the Pkg-javascript-commits
mailing list