// Create a map
var map = L.map(divName).fitBounds(<%= @bbox.to_json %>);
- // Create layer and overlays variables
- var leaflet_layers = {}
- var leaflet_overlays = {}
+ // Create a layer switcher
+ var layers = L.control.layers(null, null, {collapsed:false});
// Add OpenStreetMap layer
- leaflet_layers["OpenStreetMap"] = L.tileLayer("http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png", {
+ layers.addBaseLayer(L.tileLayer("http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png", {
attribution: "© <a target=\"_parent\" href=\"http://www.openstreetmap.org\">OpenStreetMap</a> and contributors, under an <a target=\"_parent\" href=\"http://www.openstreetmap.org/copyright\">open license</a>",
maxZoom: 19
- });
+ }), "OpenStreetMap");
<% @layers.sort_by { |layer| layer[:name] }.each do |layer| -%>
-
- <% if layer[:overlay] -%>
- // Create <%= layer[:name] %> overlay
- var leaflet_overlays[<%= layer[:name] %>] = L.tileLayer(<%= layer[:url].to_json %>, {
+ // Create <%= layer[:name] %> layer
+ var <%= layer[:name] %> = L.tileLayer(<%= layer[:url].to_json %>, {
attribution: <%= layer[:attribution].to_json %>,
maxZoom: <%= layer[:maxZoom].to_json %>
});
- <% if layer[:default] -%>
- // Add <%= layer[:name] %> to map
- leaflet_overlays[<%= layer[:name] %>].addTo(map);
- <% end -%>
-
+ // Add <%= layer[:name] %> to layer switcher
+ <% if layer[:overlay] -%>
+ layers.addOverlay(<%= layer[:name] %>, <%= layer[:title].to_json %>);
<% else %>
- // Create <%= layer[:name] %> layer
- var leaflet_layers[<%= layer[:name] %>] = L.tileLayer(<%= layer[:url].to_json %>, {
- attribution: <%= layer[:attribution].to_json %>,
- maxZoom: <%= layer[:maxZoom].to_json %>
- });
+ layers.addBaseLayer(<%= layer[:name] %>, <%= layer[:title].to_json %>);
+ <% end -%>
<% if layer[:default] -%>
// Add <%= layer[:name] %> to map
- leaflet_layers[<%= layer[:name] %>].addTo(map);
- <% end -%>
-
+ <%= layer[:name] %>.addTo(map);
<% end -%>
<% end -%>
- // Create a layer switcher
- var layers = L.control.layers(leaflet_layers, leaflet_overlays, {collapsed:false});
-
// Add the layer switch to the mao
layers.addTo(map);
- map.addControl(new L.Control.Permalink({text: 'Permalink', layers: leaflet_layers, overlays: leaflet_overlays}));
+
return map;
}
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet/v0.7.7/leaflet.ie.css" />
<![endif]-->
<script type="text/javascript" src="http://cdn.leafletjs.com/leaflet/v0.7.7/leaflet.js"></script>
- <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/leaflet-plugins/1.6.1/control/Permalink.min.js"></script>
- <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/leaflet-plugins/1.6.1/control/Permalink.Layer.min.js"></script>
- <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/leaflet-plugins/1.6.1/control/Permalink.Overlay.js"></script>
<script type="text/javascript" src="imagery.js"></script>
+ <style type="text/css">
+ @media print {
+ .leaflet-control { display:none }
+ }
+ </style>
</head>
<body onload="createMap('map')">
<div id="map"></div>