-
Notifications
You must be signed in to change notification settings - Fork 2
/
Copy pathfull.html
68 lines (53 loc) · 2.97 KB
/
full.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
<!DOCTYPE html>
<html>
<head>
<title>Leaflet.draw vector editing handlers</title>
<script src="./js/leaflet.markercluster/node_modules/leaflet/dist/leaflet-src.js"></script>
<link rel="stylesheet" href="./js/leaflet.markercluster/node_modules/leaflet/dist/leaflet.css" />
<script src="./js/leaflet-draw/dist/Leaflet.draw.js"></script>
<link rel="stylesheet" href="./js/leaflet-draw/dist/leaflet.draw.css" />
<script src="./js/Leaflet-draw/src/Toolbar.js"></script>
<script src="./js/Leaflet-draw/src/Tooltip.js"></script>
<script src="./js/Leaflet-draw/src/ext/GeometryUtil.js"></script>
<script src="./js/Leaflet-draw/src/ext/LatLngUtil.js"></script>
<script src="./js/Leaflet-draw/src/ext/LineUtil.Intersect.js"></script>
<script src="./js/Leaflet-draw/src/ext/Polygon.Intersect.js"></script>
<script src="./js/Leaflet-draw/src/ext/Polyline.Intersect.js"></script>
<script src="./js/Leaflet-draw/src/ext/TouchEvents.js"></script>
<script src="./js/Leaflet-draw/src/draw/DrawToolbar.js"></script>
<script src="./js/Leaflet-draw/src/draw/handler/Draw.Feature.js"></script>
<script src="./js/Leaflet-draw/src/draw/handler/Draw.SimpleShape.js"></script>
<script src="./js/Leaflet-draw/src/draw/handler/Draw.Polyline.js"></script>
<script src="./js/Leaflet-draw/src/draw/handler/Draw.Circle.js"></script>
<script src="./js/Leaflet-draw/src/draw/handler/Draw.Marker.js"></script>
<script src="./js/Leaflet-draw/src/draw/handler/Draw.Polygon.js"></script>
<script src="./js/Leaflet-draw/src/draw/handler/Draw.Rectangle.js"></script>
<script src="./js/Leaflet-draw/src/edit/EditToolbar.js"></script>
<script src="./js/Leaflet-draw/src/edit/handler/EditToolbar.Edit.js"></script>
<script src="./js/Leaflet-draw/src/edit/handler/EditToolbar.Delete.js"></script>
<script src="./js/Leaflet-draw/src/Control.Draw.js"></script>
<script src="./js/Leaflet-draw/src/edit/handler/Edit.Poly.js"></script>
<script src="./js/Leaflet-draw/src/edit/handler/Edit.SimpleShape.js"></script>
<script src="./js/Leaflet-draw/src/edit/handler/Edit.Circle.js"></script>
<script src="./js/Leaflet-draw/src/edit/handler/Edit.Rectangle.js"></script>
<script src="./js/Leaflet-draw/src/edit/handler/Edit.Marker.js"></script>
</head>
<body>
<div id="map" style="width: 800px; height: 600px; border: 1px solid #ccc"></div>
<script>
var osmUrl = 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
osmAttrib = '© <a href="http://openstreetmap.org/copyright">OpenStreetMap</a> contributors',
osm = L.tileLayer(osmUrl, {maxZoom: 18, attribution: osmAttrib});
map = new L.Map('map', {layers: [osm], center: new L.LatLng(51.505, -0.04), zoom: 13}),
drawnItems = L.featureGroup().addTo(map);
map.addControl(new L.Control.Draw({
edit: { featureGroup: drawnItems }
}));
map.on('draw:created', function(event) {
var layer = event.layer;
drawnItems.addLayer(layer);
});
L.circle([51.505, -0.04], 500).addTo(map);
</script>
</body>
</html>