update examples

Raruto · Jan 27, 2023 · c269031 · c269031
1 parent 2526fa9
commit c269031
Show file tree

Hide file tree

Showing 2 changed files with 33 additions and 34 deletions.
diff --git a/examples/leaflet-rotate.html b/examples/leaflet-rotate.html
@@ -10,19 +10,14 @@
 		<script src="https://unpkg.com/[email protected]/dist/leaflet-src.js"></script>
 		<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css">
 
-		<!-- Leaflet-MarkerCluster -->
-		<script src="https://unpkg.com/[email protected]/dist/leaflet.markercluster-src.js"></script>
-		<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/MarkerCluster.css">
-		<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/MarkerCluster.Default.css">
-
 		<!-- Leaflet-Rotate -->
-		<script src="https://unpkg.com/leaflet-rotate@0.1.4/dist/leaflet-rotate-src.js"></script>
+		<script src="https://unpkg.com/leaflet-rotate@0.2.0/dist/leaflet-rotate-src.js"></script>
 
 		<!-- include some miscellaneous -->
-		<script src="https://unpkg.com/leaflet-rotate@0.1.4/misc/route.js"></script>
-		<script src="https://unpkg.com/leaflet-rotate@0.1.4/misc/places.js"></script>
-		<script src="https://unpkg.com/leaflet-rotate@0.1.4/misc/loremIpsum.js"></script>
-		<script src="https://unpkg.com/leaflet-rotate@0.1.4/lib/debug.js"></script>
+		<script src="https://unpkg.com/leaflet-rotate@0.2.0/misc/route.js"></script>
+		<script src="https://unpkg.com/leaflet-rotate@0.2.0/misc/places.js"></script>
+		<script src="https://unpkg.com/leaflet-rotate@0.2.0/misc/loremIpsum.js"></script>
+		<script src="https://unpkg.com/leaflet-rotate@0.2.0/lib/debug.js"></script>
 
 		<style>
 			#map {
@@ -31,6 +26,10 @@
 				border: 1px solid #ccc;
 				max-height: 50vh;
 			}
+			html, body {
+				/* margin: 0; */
+				/* padding: 0; */
+			}
 		</style>
 	</head>
 
@@ -63,30 +62,49 @@
 				maxZoom: 24,
 				maxNativeZoom: 18,
 				attribution: 'Tiles &copy; Esri &mdash; Source: Esri, i-cubed, USDA, USGS, AEX, GeoEye, Getmapping, Aerogrid, IGN, IGP, UPR-EGP, and the GIS User Community',
+				// noWrap: true
 			});
 
 			var osm = L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
 				maxZoom: 24,
 				maxNativeZoom: 19,
 				attribution: '&copy; <a href="http://openstreetmap.org/copyright">OpenStreetMap</a> contributors',
+				// noWrap: true
 			});
 
 			var map = L.map('map', {
 				center: [55, 10],
 				zoom: 2,
 				layers: [esri],
 				// worldCopyJump: true,
+				// preferCanvas: false,
 				rotate: true,
-				touchRotate: true,
 				rotateControl: {
-					closeOnZeroBearing: false
+					closeOnZeroBearing: false,
+					// position: 'bottomleft',
 				},
 				bearing: 30,
+				// attributionControl: false,
+				// zoomControl: false,
+				// compassBearing: false,
+				// trackContainerMutation: false,
+				// shiftKeyRotate: false,
+				// touchGestures: true,
+				touchRotate: true,
+				// touchZoom: true
 			});
 
-			// map.setBearing(30);
+			// map.setBearing(90);
 			// map.touchRotate.enable();
 
+			// map.touchZoom.disable()
+			// map.compassBearing.disable()
+			// map.touchGestures.enable()
+
+			// map.zoomControl.setPosition('bottomleft');
+			// map.rotateControl.setPosition('bottomleft');
+			// map.setMaxBounds([[-90,-180], [90,180]]);
+
 			var layers = L.control.layers({
 				'Empty': L.tileLayer(''),
 				'Streets': osm,
@@ -125,30 +143,11 @@
 
 			// Display some debug info
 			L.Rotate.debug(map);
-
-			var cluster = L.markerClusterGroup({
-				spiderfyOnMaxZoom: false,
-				showCoverageOnHover: false,
-				zoomToBoundsOnClick: false
-			})
-			.on('clusterclick', (a) => a.layer.spiderfy())
-			.addTo(map);
-
-			// populate cluster with random markers
-			for (var i = 0; i < 100; i++) {
-				var bounds = map.getBounds();
-				var southWest = bounds.getSouthWest();
-				var northEast = bounds.getNorthEast();
-				var lngSpan = northEast.lng - southWest.lng;
-				var latSpan = northEast.lat - southWest.lat;
-				var m = L.marker( L.latLng(southWest.lat + latSpan * Math.random(), southWest.lng + lngSpan * Math.random()) );
-				cluster.addLayer(m);
-			}
 		</script>
 
 		<a href="https://github.com/Raruto/leaflet-rotate" class="view-on-github" style="position: fixed;bottom: 10px;left: calc(50% - 60px);z-index: 9999;"> <img alt="View on Github" src="https://raruto.github.io/img/view-on-github.png" title="View on Github"
 			  width="163"> </a>
 
 	</body>
 
-</html>
+</html>
diff --git a/test/index.html b/test/index.html
@@ -150,4 +150,4 @@
 
 	</body>
 
-</html>
+</html>