-
Notifications
You must be signed in to change notification settings - Fork 0
/
testingLayerFunction.html
117 lines (99 loc) · 3.79 KB
/
testingLayerFunction.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
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta property="og:image" content="https://raw.githubusercontent.com/tuttlepower/VotingMap/master/VoteMap.PNG" />
<link rel="icon"
href="https://raw.githubusercontent.com/tuttlepower/tuttlepower/master/Resources/Images/facelighting.png"
type="Head" sizes="16x16">
<title>Vote Map - 2000 </title>
<!-- Load Leaflet from CDN -->
<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css"
integrity="sha512-xwE/Az9zrjBIphAcBb3F6JVqxf46+CDLwfLMHloNu6KEQCAWi6HcDUbeOfBIptF7tcCzusKFjFw2yuvEpDL9wQ=="
crossorigin="" />
<script src="https://unpkg.com/[email protected]/dist/leaflet.js"
integrity="sha512-GffPMF3RvMeYyc1LWMHtK8EbPv0iNZ8/oTtHPx9/cc2ILxQ+u905qIwdpULaqDkyBKgOaB57QTMg7ztg8Jm2Og=="
crossorigin=""></script>
<!-- Load Esri Leaflet from CDN -->
<script src="https://unpkg.com/[email protected]/dist/esri-leaflet.js"
integrity="sha512-1tScwpjXwwnm6tTva0l0/ZgM3rYNbdyMj5q6RSQMbNX6EUMhYDE3pMRGZaT41zHEvLoWEK7qFEJmZDOoDMU7/Q=="
crossorigin=""></script>
<!-- Load Esri Leaflet Geocoder from CDN, needed for Search Bar -->
<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/esri-leaflet-geocoder.css"
integrity="sha512-v5YmWLm8KqAAmg5808pETiccEohtt8rPVMGQ1jA6jqkWVydV5Cuz3nJ9fQ7ittSxvuqsvI9RSGfVoKPaAJZ/AQ=="
crossorigin="">
<script src="https://unpkg.com/[email protected]/dist/esri-leaflet-geocoder.js"
integrity="sha512-uK5jVwR81KVTGe8KpJa1QIN4n60TsSV8+DPbL5wWlYQvb0/nYNgSOg9dZG6ViQhwx/gaMszuWllTemL+K+IXjg=="
crossorigin=""></script>
<link rel="stylesheet" href="js/leaflet.groupedlayercontrol.css" />
<style>
body {
margin: 0;
padding: 0;
}
#map {
position: fixed;
top: 0;
bottom: 0;
right: 0;
left: 0;
}
#legend {
position: absolute;
left: 10px;
bottom: 10px;
}
#links {
position: absolute;
right: 10px;
bottom: 20px;
}
#info-pane {
position: absolute;
top: 10px;
right: 10px;
z-index: 400;
padding: 1em;
background: white;
}
#demo {
top: 30px;
}
</style>
</head>
<body>
<div id="map"></div>
<script src="js/leaflet.groupedlayercontrol.js"></script>
<script type="text/javascript" src="js/reworked.js"></script>
<script src="js/layersfunction.js"></script>
<script src="Rebuild/js/Layers/2016.js"></script>
<script>
var map = L.map('map', {
center: [39.0902, -95.7129],
zoom: 5,
layers: [ExampleData.Basemaps.Grayscale, ExampleData.LayerGroups.cities]
});
// Overlay layers are grouped
var groupedOverlays = {
"Landmarks": {
"Cities": ExampleData.LayerGroups.cities,
"Restaurants": ExampleData.LayerGroups.restaurants,
"2000":ExampleData.LayerGroups.Election_2000,
"2012":ExampleData.LayerGroups.Election_2012
},
};
var options = {
// Make the "Landmarks" group exclusive (use radio inputs)
exclusiveGroups: ["Landmarks"],
// Show a checkbox next to non-exclusive group labels for toggling all
groupCheckboxes: true
};
// Use the custom grouped layer control, not "L.control.layers"
var layerControl = L.control.groupedLayers(ExampleData.Basemaps, groupedOverlays, options);
map.addControl(layerControl);
// Remove and add a layer
//layerControl.removeLayer(cities);
//layerControl.addOverlay(cities, "Cities", "New Category");
</script>
</body>
</html>