mirror of
https://github.com/librenms/librenms.git
synced 2024-10-07 16:52:45 +00:00
f2b3dabcaa
git-subtree-dir: lib/Leaflet.markercluster git-subtree-mainline: 1218d227bedc0344f0335e42845d2fa6dfdaa6eb git-subtree-split: e96388d6cb2be12f113a20a9b40812f42f96d805
70 lines
2.3 KiB
HTML
70 lines
2.3 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>Leaflet debug page</title>
|
|
|
|
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7/leaflet.css" />
|
|
<script src="http://cdn.leafletjs.com/leaflet-0.7/leaflet-src.js"></script>
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<link rel="stylesheet" href="../screen.css" />
|
|
|
|
<link rel="stylesheet" href="../../dist/MarkerCluster.css" />
|
|
<link rel="stylesheet" href="../../dist/MarkerCluster.Default.css" />
|
|
<script src="../../src/DistanceGrid.js"></script>
|
|
<script src="../../src/MarkerCluster.js"></script>
|
|
<script src="../../src/MarkerClusterGroup.js"></script>
|
|
<script src="../../src/MarkerCluster.QuickHull.js"></script>
|
|
<script src="../../src/MarkerCluster.Spiderfier.js"></script>
|
|
</head>
|
|
<body>
|
|
|
|
<div id="map"></div>
|
|
<button id="doit">setView</button><br/>
|
|
<span>Bug <a href="https://github.com/danzel/Leaflet.markercluster/issues/63">#63</a>. Zoom down on the very left side untill markers are visible. Click the button. Scroll to the left in one go, those markers should be in clusters but the actual markers will still be visible.</span><br/>
|
|
<span id="time"></span>
|
|
<script type="text/javascript">
|
|
|
|
//Mobile does different bounds to desktop, makes the bug easier to reproduce
|
|
L.Browser.mobile = true;
|
|
|
|
var tiles = L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
|
|
maxZoom: 18,
|
|
attribution: '© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
|
|
}),
|
|
latlng = new L.LatLng(50.5, 30.51);
|
|
|
|
var map = new L.Map('map', {center: latlng, zoom: 15, layers: [tiles]});
|
|
|
|
var markers = new L.MarkerClusterGroup();
|
|
var markersList = [];
|
|
|
|
function getRandomLatLng(map) {
|
|
var bounds = map.getBounds(),
|
|
southWest = bounds.getSouthWest(),
|
|
northEast = bounds.getNorthEast(),
|
|
lngSpan = northEast.lng - southWest.lng,
|
|
latSpan = northEast.lat - southWest.lat;
|
|
|
|
return new L.LatLng(
|
|
southWest.lat + latSpan * Math.random(),
|
|
southWest.lng + lngSpan * Math.random());
|
|
}
|
|
|
|
function populate(length) {
|
|
for (var i = 0; i < length; i++) {
|
|
var m = new L.Marker(getRandomLatLng(map));
|
|
markers.addLayer(m);
|
|
}
|
|
}
|
|
|
|
populate(1000);
|
|
map.addLayer(markers);
|
|
|
|
L.DomUtil.get('doit').onclick = function () {
|
|
map.setView(new L.LatLng(50.5, 30.525), 15);
|
|
};
|
|
|
|
</script>
|
|
</body>
|
|
</html>
|