Various debug fixes (#4515)
* various debug fixes * fix mixed spaces and tabs
This commit is contained in:
Nathan Cahill
Vladimir Agafonkin
parent
19f048110f
commit
425fa13cb4
@ -28,8 +28,8 @@
|
||||
map.addLayer(osm);
|
||||
|
||||
var bounds = new L.LatLngBounds(
|
||||
new L.LatLng(40.71222,-74.22655),
|
||||
new L.LatLng(40.77394,-74.12544));
|
||||
new L.LatLng(40.71222,-74.22655),
|
||||
new L.LatLng(40.77394,-74.12544));
|
||||
|
||||
map.fitBounds(bounds);
|
||||
|
||||
|
||||
@ -1,23 +1,23 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Leaflet debug page</title>
|
||||
<title>Leaflet debug page</title>
|
||||
|
||||
<link rel="stylesheet" href="../../dist/leaflet.css" />
|
||||
<link rel="stylesheet" href="../../dist/leaflet.css" />
|
||||
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
|
||||
<link rel="stylesheet" href="../css/screen.css" />
|
||||
<link rel="stylesheet" href="../css/screen.css" />
|
||||
|
||||
<script type="text/javascript" src="../../build/deps.js"></script>
|
||||
<script src="../leaflet-include.js"></script>
|
||||
<script type="text/javascript" src="../../build/deps.js"></script>
|
||||
<script src="../leaflet-include.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div id="map"></div>
|
||||
<div id="map"></div>
|
||||
<button id="removeAdd">Remove and Add Layer</button>
|
||||
|
||||
<script type="text/javascript">
|
||||
<script type="text/javascript">
|
||||
map = L.map('map', { center: [0, 0], zoom: 3, maxZoom: 4 });
|
||||
|
||||
L.Icon.Default.imagePath = 'http://cdn.leafletjs.com/leaflet-0.7.3/images';
|
||||
@ -40,6 +40,6 @@
|
||||
|
||||
|
||||
};
|
||||
</script>
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@ -1,22 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Leaflet debug page</title>
|
||||
<title>Leaflet debug page</title>
|
||||
|
||||
<link rel="stylesheet" href="../../dist/leaflet.css" />
|
||||
<link rel="stylesheet" href="../../dist/leaflet.css" />
|
||||
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
|
||||
<link rel="stylesheet" href="../css/screen.css" />
|
||||
<link rel="stylesheet" href="../css/screen.css" />
|
||||
|
||||
<script type="text/javascript" src="../../build/deps.js"></script>
|
||||
<script src="../leaflet-include.js"></script>
|
||||
<script type="text/javascript" src="../../build/deps.js"></script>
|
||||
<script src="../leaflet-include.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div id="map"></div>
|
||||
<div id="map"></div>
|
||||
|
||||
<script type="text/javascript">
|
||||
<script type="text/javascript">
|
||||
map = L.map('map', { center: [0, 0], zoom: 3, maxZoom: 4 });
|
||||
|
||||
L.Icon.Default.imagePath = 'http://cdn.leafletjs.com/leaflet-0.7.3/images';
|
||||
@ -64,6 +64,6 @@
|
||||
maxZoom: 12,
|
||||
minZoom: 2
|
||||
}).addTo(map);
|
||||
</script>
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@ -13,22 +13,22 @@
|
||||
<script src="../leaflet-include.js"></script>
|
||||
<style>
|
||||
.mapcontainer {
|
||||
float:left;
|
||||
position: relative;
|
||||
width: 32%;
|
||||
font-size: 12px;
|
||||
font-family: sans-serif;
|
||||
height: 340px;
|
||||
margin-bottom: 15px;
|
||||
background-color: #eee;
|
||||
margin-right: 1%;
|
||||
float:left;
|
||||
position: relative;
|
||||
width: 32%;
|
||||
font-size: 12px;
|
||||
font-family: sans-serif;
|
||||
height: 340px;
|
||||
margin-bottom: 15px;
|
||||
background-color: #eee;
|
||||
margin-right: 1%;
|
||||
}
|
||||
|
||||
.map {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 280px;
|
||||
bottom: 0px;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 280px;
|
||||
bottom: 0px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
@ -67,8 +67,8 @@
|
||||
|
||||
<script type="text/javascript">
|
||||
var mapopts = {
|
||||
center: [35, -122],
|
||||
zoom : 5
|
||||
center: [35, -122],
|
||||
zoom : 5
|
||||
};
|
||||
|
||||
var map1 = L.map('map1', mapopts);
|
||||
@ -83,17 +83,18 @@
|
||||
**********/
|
||||
// OSM Basemap
|
||||
var osmUrl = 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
|
||||
osmAttrib = '© <a href="http://openstreetmap.org/copyright">OpenStreetMap</a> contributors';
|
||||
|
||||
var osm = L.tileLayer(osmUrl, {maxZoom: 18, attribution: ''}).addTo(map1);
|
||||
|
||||
// EEZs / Nations
|
||||
var eez1 = L.tileLayer('http://tile1.mpatlas.org/tilecache/eezs/{z}/{x}/{y}.png', {
|
||||
tms: true
|
||||
tms: true
|
||||
}).addTo(map1);
|
||||
|
||||
// Marine Protected Areas overlay
|
||||
var mpa1 = L.tileLayer('http://tile1.mpatlas.org/tilecache/mpas/{z}/{x}/{y}.png', {
|
||||
tms: false
|
||||
tms: false
|
||||
}).addTo(map1);
|
||||
|
||||
|
||||
@ -105,14 +106,14 @@
|
||||
|
||||
// EEZs / Nations
|
||||
var eez2 = L.tileLayer('http://tile1.mpatlas.org/tilecache/eezs/{z}/{x}/{y}.png', {
|
||||
tms: true,
|
||||
opacity: 0.99
|
||||
tms: true,
|
||||
opacity: 0.99
|
||||
}).addTo(map2);
|
||||
|
||||
// Marine Protected Areas overlay
|
||||
var mpa2 = L.tileLayer('http://tile1.mpatlas.org/tilecache/mpas/{z}/{x}/{y}.png', {
|
||||
tms: false,
|
||||
opacity: 0.99
|
||||
tms: false,
|
||||
opacity: 0.99
|
||||
}).addTo(map2);
|
||||
|
||||
|
||||
@ -124,14 +125,14 @@
|
||||
|
||||
// EEZs / Nations
|
||||
var eez3 = L.tileLayer('http://tile1.mpatlas.org/tilecache/eezs/{z}/{x}/{y}.png', {
|
||||
tms: true,
|
||||
opacity: 0.99
|
||||
tms: true,
|
||||
opacity: 0.99
|
||||
}).addTo(map3);
|
||||
|
||||
// Marine Protected Areas overlay
|
||||
var mpa3 = L.tileLayer('http://tile1.mpatlas.org/tilecache/mpas/{z}/{x}/{y}.png', {
|
||||
tms: false,
|
||||
opacity: 0.99
|
||||
tms: false,
|
||||
opacity: 0.99
|
||||
}).addTo(map3);
|
||||
|
||||
|
||||
@ -143,14 +144,14 @@
|
||||
|
||||
// EEZs / Nations
|
||||
var eez4 = L.tileLayer('http://tile1.mpatlas.org/tilecache/eezs/{z}/{x}/{y}.png', {
|
||||
tms: true,
|
||||
opacity: 0.99
|
||||
tms: true,
|
||||
opacity: 0.99
|
||||
}).addTo(map4);
|
||||
|
||||
// Marine Protected Areas overlay
|
||||
var mpa4 = L.tileLayer('http://tile1.mpatlas.org/tilecache/mpas/{z}/{x}/{y}.png', {
|
||||
tms: false,
|
||||
opacity: 0.99
|
||||
tms: false,
|
||||
opacity: 0.99
|
||||
}).addTo(map4);
|
||||
|
||||
|
||||
@ -162,14 +163,14 @@
|
||||
|
||||
// EEZs / Nations
|
||||
var eez5 = L.tileLayer('http://tile1.mpatlas.org/tilecache/eezs/{z}/{x}/{y}.png', {
|
||||
tms: true,
|
||||
opacity: 0.99
|
||||
tms: true,
|
||||
opacity: 0.99
|
||||
}).addTo(map5);
|
||||
|
||||
// Marine Protected Areas overlay
|
||||
var mpa5 = L.tileLayer('http://tile1.mpatlas.org/tilecache/mpas/{z}/{x}/{y}.png', {
|
||||
tms: false,
|
||||
opacity: 0.99
|
||||
tms: false,
|
||||
opacity: 0.99
|
||||
}).addTo(map5);
|
||||
|
||||
|
||||
@ -181,14 +182,14 @@
|
||||
|
||||
// EEZs / Nations
|
||||
var eez6 = L.tileLayer('http://tile1.mpatlas.org/tilecache/eezs/{z}/{x}/{y}.png', {
|
||||
tms: true,
|
||||
opacity: 1
|
||||
tms: true,
|
||||
opacity: 1
|
||||
}).addTo(map6);
|
||||
|
||||
// Marine Protected Areas overlay
|
||||
var mpa6 = L.tileLayer('http://tile1.mpatlas.org/tilecache/mpas/{z}/{x}/{y}.png', {
|
||||
tms: false,
|
||||
opacity: 0.99
|
||||
tms: false,
|
||||
opacity: 0.99
|
||||
}).addTo(map6);
|
||||
|
||||
|
||||
|
||||
@ -197,7 +197,7 @@
|
||||
map.addLayer(grid);
|
||||
|
||||
var marker1 = L.marker(kyiv).addTo(map),
|
||||
marker2 = L.marker(lnd).addTo(map);
|
||||
marker2 = L.marker(lnd).addTo(map),
|
||||
marker3 = L.marker(dc).addTo(map),
|
||||
marker4 = L.marker(sf).addTo(map),
|
||||
marker5 = L.marker(trd).addTo(map),
|
||||
|
||||
@ -16,10 +16,10 @@
|
||||
<div id="map"></div>
|
||||
|
||||
<script type="text/javascript">
|
||||
// Check the 'center' setting of the scroll-wheel, double-click and touch-zoom
|
||||
// handlers
|
||||
// Check the 'center' setting of the scroll-wheel, double-click and touch-zoom
|
||||
// handlers
|
||||
|
||||
var osmUrl = 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
|
||||
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, {minZoom: 14, attribution: osmAttrib}),
|
||||
latlng = new L.LatLng(51.1788409,-1.82618);
|
||||
@ -29,8 +29,8 @@
|
||||
zoom: 15,
|
||||
layers: [osm],
|
||||
scrollWheelZoom: 'center', // zoom to center regardless where mouse is
|
||||
doubleClickZoom: 'center',
|
||||
touchZoom: 'center'
|
||||
doubleClickZoom: 'center',
|
||||
touchZoom: 'center'
|
||||
});
|
||||
|
||||
L.marker(latlng).addTo(map);
|
||||
|
||||
@ -65,7 +65,7 @@
|
||||
var path = new L.Polyline([kyiv, trd, lnd, mad, dc, sf]).addTo(map);
|
||||
|
||||
var marker1 = L.marker(kyiv).addTo(map),
|
||||
marker2 = L.marker(lnd).addTo(map);
|
||||
marker2 = L.marker(lnd).addTo(map),
|
||||
marker3 = L.marker(dc).addTo(map),
|
||||
marker4 = L.marker(sf).addTo(map),
|
||||
marker5 = L.marker(trd).addTo(map),
|
||||
|
||||
@ -10,7 +10,6 @@
|
||||
<link rel="stylesheet" href="../css/screen.css" />
|
||||
<script type="text/javascript" src="../../build/deps.js"></script>
|
||||
<script src="../leaflet-include.js"></script>
|
||||
<script type='text/javascript' src='http://code.jquery.com/jquery-1.8.0.js'></script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
@ -26,7 +25,7 @@
|
||||
|
||||
map.addLayer(demoMap);
|
||||
|
||||
$('#foo').click(function() {
|
||||
document.getElementById('foo').addEventListener('click', function() {
|
||||
var topoUrl='http://server.arcgisonline.com/ArcGIS/rest/services/USA_Topo_Maps/MapServer/tile/{z}/{y}/{x}';
|
||||
var topoMap = new L.TileLayer(topoUrl, { maxZoom: 19, attribution: 'Tiles: © Esri' });
|
||||
map.addLayer(topoMap);
|
||||
|
||||
@ -3,8 +3,9 @@
|
||||
<link rel="stylesheet" href="../../dist/leaflet.css" />
|
||||
<link rel="stylesheet" href="../css/screen.css" />
|
||||
|
||||
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="../../build/deps.js"></script>
|
||||
|
||||
<script src="../leaflet-include.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
@ -12,8 +13,6 @@
|
||||
|
||||
|
||||
<script>
|
||||
|
||||
$(document).ready(function() {
|
||||
//Init a map, and attempt a locate.
|
||||
var map = L.map('map', {
|
||||
center: [39.84, -96.591],
|
||||
@ -33,13 +32,8 @@
|
||||
});
|
||||
|
||||
//For experiments using setRadius
|
||||
window.marker = L.circleMarker(map.getCenter(),{radius:30}).addTo(vanillaLayer);
|
||||
});
|
||||
|
||||
var marker = L.circleMarker(map.getCenter(),{radius:30}).addTo(vanillaLayer);
|
||||
</script>
|
||||
<script type="text/javascript" src="../../build/deps.js"></script>
|
||||
|
||||
<script src="../leaflet-include.js"></script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@ -8,51 +8,47 @@
|
||||
<link rel="stylesheet" href="../../dist/leaflet.css" />
|
||||
|
||||
<link rel="stylesheet" href="../css/screen.css" />
|
||||
<script type='text/javascript' src='http://code.jquery.com/jquery-1.8.0.js'></script>
|
||||
|
||||
<script>
|
||||
$(document).ready(function() {
|
||||
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});
|
||||
|
||||
var map = L.map('map', {
|
||||
minZoom: 1,
|
||||
maxZoom: 19,
|
||||
center: [51.505, -0.09],
|
||||
zoom: 9,
|
||||
layers: [osm],
|
||||
preferCanvas: true
|
||||
});
|
||||
|
||||
var polygons = new L.FeatureGroup();
|
||||
var points = [[51.505, -0.01], [51.505, -0.09], [51.55, -0.09]];
|
||||
|
||||
polygons.addLayer(
|
||||
new L.Polyline(
|
||||
points, {
|
||||
weight: 10,
|
||||
opacity: 1,
|
||||
smoothFactor: 1,
|
||||
color: 'red',
|
||||
interactive:true
|
||||
}));
|
||||
|
||||
polygons.on('click', function(m) {
|
||||
// m.layer is the clicked polygon here
|
||||
//m.layer.bindPopup('hello!').openPopup();
|
||||
console.log(m.layer)
|
||||
});
|
||||
|
||||
polygons.addTo(map);
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
<script type="text/javascript" src="../../build/deps.js"></script>
|
||||
<script src="../leaflet-include.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="map"></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});
|
||||
|
||||
var map = L.map('map', {
|
||||
minZoom: 1,
|
||||
maxZoom: 19,
|
||||
center: [51.505, -0.09],
|
||||
zoom: 9,
|
||||
layers: [osm],
|
||||
preferCanvas: true
|
||||
});
|
||||
|
||||
var polygons = new L.FeatureGroup();
|
||||
var points = [[51.505, -0.01], [51.505, -0.09], [51.55, -0.09]];
|
||||
|
||||
polygons.addLayer(
|
||||
new L.Polyline(
|
||||
points, {
|
||||
weight: 10,
|
||||
opacity: 1,
|
||||
smoothFactor: 1,
|
||||
color: 'red',
|
||||
interactive:true
|
||||
}));
|
||||
|
||||
polygons.on('click', function(m) {
|
||||
// m.layer is the clicked polygon here
|
||||
//m.layer.bindPopup('hello!').openPopup();
|
||||
console.log(m.layer)
|
||||
});
|
||||
|
||||
polygons.addTo(map);
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@ -9,11 +9,11 @@
|
||||
<script src="../leaflet-include.js"></script>
|
||||
<script>
|
||||
var map,
|
||||
mapDiv,
|
||||
osm = L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png');
|
||||
mapDiv,
|
||||
osm = L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png');
|
||||
|
||||
|
||||
recreateMap = function(){
|
||||
var recreateMap = function(){
|
||||
// destroy previous map and div
|
||||
|
||||
if(map) map.remove(); // This will destroy all DOM childs from layers and controls
|
||||
|
||||
@ -11,7 +11,6 @@
|
||||
<link rel="stylesheet" href="../css/screen.css" />
|
||||
<script type="text/javascript" src="../../build/deps.js"></script>
|
||||
<script src="../leaflet-include.js"></script>
|
||||
<script type='text/javascript' src='http://code.jquery.com/jquery-1.8.0.js'></script>
|
||||
</head>
|
||||
<body>
|
||||
<p>
|
||||
@ -47,11 +46,9 @@
|
||||
dragging : false,
|
||||
worldCopyJump : true
|
||||
});
|
||||
$("#foo").click(function() {
|
||||
map2.dragging.enable();
|
||||
});
|
||||
|
||||
|
||||
document.getElementById("foo").addEventListener('click', function() {
|
||||
map2.dragging.enable();
|
||||
});
|
||||
|
||||
addLayerAndMarker(map1);
|
||||
addLayerAndMarker(map2);
|
||||
|
||||
@ -49,9 +49,9 @@
|
||||
<script type="text/javascript">
|
||||
|
||||
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}),
|
||||
latlng = new L.LatLng(39.05, 8.40);
|
||||
osmAttrib = '© <a href="http://openstreetmap.org/copyright">OpenStreetMap</a> contributors',
|
||||
osm = L.tileLayer(osmUrl, {maxZoom: 18, attribution: osmAttrib}),
|
||||
latlng = new L.LatLng(39.05, 8.40);
|
||||
|
||||
var map = new L.Map('map', {center: latlng, zoom: 12, layers: [osm]});
|
||||
|
||||
@ -70,24 +70,24 @@
|
||||
[39.10, 8.50],
|
||||
[39.05, 8.30]
|
||||
])).addTo(map).on('mouseover',update('enter1'))
|
||||
.on('mousemove',update('move1'))
|
||||
.on('mouseout',update('exit1'))
|
||||
.on('click',update('click1'))
|
||||
.bindPopup('Triangle 1');
|
||||
.on('mousemove',update('move1'))
|
||||
.on('mouseout',update('exit1'))
|
||||
.on('click',update('click1'))
|
||||
.bindPopup('Triangle 1');
|
||||
|
||||
var polygon2 = (new L.Polygon([
|
||||
[39.03, 8.30],
|
||||
[39.10, 8.40],
|
||||
[39.00, 8.30]
|
||||
])).addTo(map).on('mouseover',update('enter2'))
|
||||
.on('mousemove',update('move2'))
|
||||
.on('mouseout',update('exit2'))
|
||||
.on('click',update('click2'))
|
||||
.bindPopup('Triangle 2');
|
||||
.on('mousemove',update('move2'))
|
||||
.on('mouseout',update('exit2'))
|
||||
.on('click',update('click2'))
|
||||
.bindPopup('Triangle 2');
|
||||
|
||||
|
||||
var marker = new L.Marker(latlng, {draggable: true})
|
||||
.bindPopup('Marker');;
|
||||
.bindPopup('Marker');;
|
||||
map.addLayer(marker);
|
||||
|
||||
|
||||
@ -95,9 +95,9 @@
|
||||
// marker.setLatLng(e.latlng);
|
||||
// });
|
||||
map.on('mouseover',update('enter3'))
|
||||
.on('mousemove',update('move3'))
|
||||
.on('mouseout',update('exit3'))
|
||||
.on('click',update('click3'));
|
||||
.on('mousemove',update('move3'))
|
||||
.on('mouseout',update('exit3'))
|
||||
.on('click',update('click3'));
|
||||
|
||||
// We should be able to move marker around in a fluid way,
|
||||
// plus going over the polygon with no issue.
|
||||
|
||||
@ -31,19 +31,21 @@
|
||||
var map = new L.Map('map', {center: latlng, zoom: 15, layers: [osm]});
|
||||
|
||||
//Create a marker, clicking it toggles opacity
|
||||
var marker = new L.Marker(latlng, { icon: new L.DivIcon({ className: 'mybox', iconSize: new L.Point(100,100), html: 'opaque. click to toggle' }) });
|
||||
var opaqueIcon = new L.DivIcon({ className: 'mybox', iconSize: new L.Point(100,100), html: 'opaque. click to toggle' });
|
||||
var transparentIcon = new L.DivIcon({ className: 'mybox', iconSize: new L.Point(100,100), html: 'transparent' });
|
||||
var marker = new L.Marker(latlng, { icon: opaqueIcon });
|
||||
map.addLayer(marker);
|
||||
|
||||
var visible = true;
|
||||
marker.on('click', function () {
|
||||
if (visible) {
|
||||
marker.setOpacity(0.3);
|
||||
marker._icon.innerHTML = 'transparent';
|
||||
} else {
|
||||
marker.setOpacity(1);
|
||||
marker._icon.innerHTML = 'opaque';
|
||||
}
|
||||
visible = !visible;
|
||||
if (visible) {
|
||||
marker.setOpacity(0.3);
|
||||
marker.setIcon(transparentIcon)
|
||||
} else {
|
||||
marker.setOpacity(1);
|
||||
marker.setIcon(opaqueIcon);
|
||||
}
|
||||
visible = !visible;
|
||||
});
|
||||
|
||||
var marker2 = new L.Marker(new L.LatLng(50.5, 30.52));
|
||||
|
||||
@ -1,23 +1,23 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Leaflet debug page</title>
|
||||
<title>Leaflet debug page</title>
|
||||
|
||||
<link rel="stylesheet" href="../../dist/leaflet.css" />
|
||||
<link rel="stylesheet" href="../../dist/leaflet.css" />
|
||||
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
|
||||
<link rel="stylesheet" href="../css/screen.css" />
|
||||
<link rel="stylesheet" href="../css/screen.css" />
|
||||
|
||||
<script type="text/javascript" src="../../build/deps.js"></script>
|
||||
<script src="../leaflet-include.js"></script>
|
||||
<script type="text/javascript" src="../../build/deps.js"></script>
|
||||
<script src="../leaflet-include.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div id="map"></div>
|
||||
<button id="populate">Populate with 10 markers</button>
|
||||
<div id="map"></div>
|
||||
<button id="populate">Populate with 10 markers</button>
|
||||
|
||||
<script type="text/javascript">
|
||||
<script type="text/javascript">
|
||||
|
||||
var map = L.map('map').setView([36.9, -95.4], 5);
|
||||
map.on('contextmenu', function (e) {
|
||||
@ -53,6 +53,6 @@ var marker = L.marker([36, -95]).addTo(map);
|
||||
marker.bindPopup('Right-click me <br> to test contextmenu <br> event capture').openPopup();
|
||||
|
||||
|
||||
</script>
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@ -20,7 +20,7 @@
|
||||
var marker = L.marker([50, 50], {draggable: true}).addTo(map);
|
||||
|
||||
setTimeout(function() {
|
||||
map.removeLayer(marker);
|
||||
map.removeLayer(marker);
|
||||
}, 3000);
|
||||
|
||||
</script>
|
||||
|
||||
@ -1,27 +1,26 @@
|
||||
<html dir="rtl">
|
||||
<head>
|
||||
|
||||
<link rel="stylesheet" href="../../dist/leaflet.css" />
|
||||
<link rel="stylesheet" href="../../dist/leaflet.css" />
|
||||
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
|
||||
<link rel="stylesheet" href="../css/mobile.css" />
|
||||
<link rel="stylesheet" href="../css/mobile.css" />
|
||||
|
||||
<script type="text/javascript" src="../../build/deps.js"></script>
|
||||
<script src="../leaflet-include.js"></script>
|
||||
<style>
|
||||
#map { height: 100%; }
|
||||
</style>
|
||||
<script type="text/javascript" src="../../build/deps.js"></script>
|
||||
<script src="../leaflet-include.js"></script>
|
||||
<style>
|
||||
#map { height: 100%; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="map"></div>
|
||||
<script>
|
||||
var map = L.map('map').setView([51.505, -0.09], 13);
|
||||
L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png').addTo(map);
|
||||
map.on('click', function(e) {
|
||||
L.popup().setLatLng(e.latlng).setContent('Hello').openOn(map);
|
||||
});
|
||||
|
||||
var map = L.map('map').setView([51.505, -0.09], 13);
|
||||
L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png').addTo(map);
|
||||
map.on('click', function(e) {
|
||||
L.popup().setLatLng(e.latlng).setContent('Hello').openOn(map);
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@ -24,29 +24,29 @@
|
||||
initmap();
|
||||
|
||||
function initmap() {
|
||||
// set up the map
|
||||
map = new L.Map('map');
|
||||
// set up the map
|
||||
map = new L.Map('map');
|
||||
|
||||
// create the tile layer with correct attribution
|
||||
var osmUrl = 'http://a.tile.openstreetmap.org/{z}/{x}/{y}.png';
|
||||
var osm = new L.TileLayer(osmUrl, { minZoom: 1, maxZoom: 17 });
|
||||
map.addLayer(osm);
|
||||
map.fitBounds(new L.LatLngBounds([51,7],[51,7]));
|
||||
// create the tile layer with correct attribution
|
||||
var osmUrl = 'http://a.tile.openstreetmap.org/{z}/{x}/{y}.png';
|
||||
var osm = new L.TileLayer(osmUrl, { minZoom: 1, maxZoom: 17 });
|
||||
map.addLayer(osm);
|
||||
map.fitBounds(new L.LatLngBounds([51,7],[51,7]));
|
||||
|
||||
var route = L.polyline([
|
||||
[51, 7.000],
|
||||
[51.002, 7.004],
|
||||
[51.004, 7.006]
|
||||
]).addTo(map).on('click',function(e){console.log('bottom')})
|
||||
var route = L.polyline([
|
||||
[51, 7.000],
|
||||
[51.002, 7.004],
|
||||
[51.004, 7.006]
|
||||
]).addTo(map).on('click',function(e){console.log('bottom')})
|
||||
|
||||
var route2 = L.polyline([
|
||||
[51, 7.000],
|
||||
[51.002, 7.004]
|
||||
],
|
||||
{ interactive:false,color:'#f00' }
|
||||
).addTo(map);
|
||||
var route2 = L.polyline([
|
||||
[51, 7.000],
|
||||
[51.002, 7.004]
|
||||
],
|
||||
{ interactive:false,color:'#f00' }
|
||||
).addTo(map);
|
||||
|
||||
// when the mouse hovers over the red route2, you cannot click through the blue route1 beneath
|
||||
// when the mouse hovers over the red route2, you cannot click through the blue route1 beneath
|
||||
};
|
||||
|
||||
</script>
|
||||
|
||||
@ -21,8 +21,8 @@
|
||||
|
||||
<script type="text/javascript">
|
||||
var mapopts = {
|
||||
center: [35, -122],
|
||||
zoom : 5
|
||||
center: [35, -122],
|
||||
zoom : 5
|
||||
};
|
||||
|
||||
var map = L.map('map', mapopts);
|
||||
|
||||
@ -74,7 +74,7 @@
|
||||
// Map bounds
|
||||
L.rectangle(bounds,{
|
||||
fill: false,
|
||||
stroke: 3,
|
||||
weight: 3,
|
||||
color: 'black'
|
||||
}).addTo(map);
|
||||
|
||||
|
||||
@ -15,18 +15,18 @@
|
||||
<script src="../leaflet-include.js"></script>
|
||||
|
||||
<script src="../../node_modules/prosthetic-hand/dist/prosthetic-hand.js"></script>
|
||||
<meta charset="utf-8">
|
||||
<title>Leaflet test for pinch-zoom-without-bounce</title>
|
||||
<style>
|
||||
#map {
|
||||
position:absolute;
|
||||
top: 50px;
|
||||
bottom: 0;
|
||||
left:0;
|
||||
right:0;
|
||||
}
|
||||
body {margin:0; padding: 0}
|
||||
</style>
|
||||
<meta charset="utf-8">
|
||||
<title>Leaflet test for pinch-zoom-without-bounce</title>
|
||||
<style>
|
||||
#map {
|
||||
position:absolute;
|
||||
top: 50px;
|
||||
bottom: 0;
|
||||
left:0;
|
||||
right:0;
|
||||
}
|
||||
body {margin:0; padding: 0}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
@ -150,6 +150,6 @@
|
||||
pinchAndPanV();
|
||||
// pinchAndPanII();
|
||||
|
||||
</script>
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,35 +1,35 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Leaflet debug page</title>
|
||||
<title>Leaflet debug page</title>
|
||||
|
||||
<link rel="stylesheet" href="../../dist/leaflet.css" />
|
||||
<link rel="stylesheet" href="../../dist/leaflet.css" />
|
||||
|
||||
<link rel="stylesheet" href="../css/screen.css" />
|
||||
<link rel="stylesheet" href="../css/screen.css" />
|
||||
|
||||
<script type="text/javascript" src="../../build/deps.js"></script>
|
||||
<script src="../leaflet-include.js"></script>
|
||||
<script type="text/javascript" src="../../build/deps.js"></script>
|
||||
<script src="../leaflet-include.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="map" style="width: 800px; height: 600px; border: 1px solid #ccc"></div>
|
||||
<div id="map" style="width: 800px; height: 600px; border: 1px solid #ccc"></div>
|
||||
<button onclick="boundsExtendBounds();">Extend the bounds of the center rectangle with the upper right rectangle</button>
|
||||
<button onclick="boundsExtendLatLng()">Extend the bounds of the center rectangle with the lower left marker</button>
|
||||
<script src="route.js"></script>
|
||||
<script>
|
||||
var osmUrl = 'http://{s}.tile.osm.org/{z}/{x}/{y}.png',
|
||||
osm = new L.TileLayer(osmUrl, {maxZoom: 18});
|
||||
<script src="route.js"></script>
|
||||
<script>
|
||||
var osmUrl = 'http://{s}.tile.osm.org/{z}/{x}/{y}.png',
|
||||
osm = new L.TileLayer(osmUrl, {maxZoom: 18});
|
||||
|
||||
var latLng = new L.LatLng(54.18815548107151, -7.657470703124999);
|
||||
|
||||
var bounds1 = new L.LatLngBounds(new L.LatLng(54.559322, -5.767822), new L.LatLng(56.1210604, -3.021240));
|
||||
var bounds1 = new L.LatLngBounds(new L.LatLng(54.559322, -5.767822), new L.LatLng(56.1210604, -3.021240));
|
||||
var bounds2 = new L.LatLngBounds(new L.LatLng(56.56023925701561, -2.076416015625), new L.LatLng(57.01158038001565, -0.9777832031250001));
|
||||
var bounds3;
|
||||
|
||||
var map = new L.Map('map', {
|
||||
layers: [osm],
|
||||
center: bounds1.getCenter(),
|
||||
zoom: 7
|
||||
});
|
||||
var map = new L.Map('map', {
|
||||
layers: [osm],
|
||||
center: bounds1.getCenter(),
|
||||
zoom: 7
|
||||
});
|
||||
|
||||
var rectangle1 = new L.Rectangle(bounds1);
|
||||
var rectangle2 = new L.Rectangle(bounds2);
|
||||
@ -37,52 +37,52 @@
|
||||
|
||||
var marker = new L.Marker(latLng);
|
||||
|
||||
map.addLayer(rectangle1).addLayer(rectangle2).addLayer(marker);
|
||||
map.addLayer(rectangle1).addLayer(rectangle2).addLayer(marker);
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
function boundsExtendBounds() {
|
||||
if (rectangle3) {
|
||||
map.removeLayer(rectangle3);
|
||||
rectangle3 = null;
|
||||
}
|
||||
if (bounds3) {
|
||||
bounds3 = null;
|
||||
}
|
||||
bounds3 = new L.LatLngBounds(bounds1.getSouthWest(), bounds1.getNorthEast());
|
||||
bounds3.extend(bounds2);
|
||||
rectangle3 = new L.Rectangle(bounds3, {
|
||||
color: "#ff0000",
|
||||
weight: 1,
|
||||
opacity: 1,
|
||||
fillOpacity: 0
|
||||
});
|
||||
if (rectangle3) {
|
||||
map.removeLayer(rectangle3);
|
||||
rectangle3 = null;
|
||||
}
|
||||
if (bounds3) {
|
||||
bounds3 = null;
|
||||
}
|
||||
bounds3 = new L.LatLngBounds(bounds1.getSouthWest(), bounds1.getNorthEast());
|
||||
bounds3.extend(bounds2);
|
||||
rectangle3 = new L.Rectangle(bounds3, {
|
||||
color: "#ff0000",
|
||||
weight: 1,
|
||||
opacity: 1,
|
||||
fillOpacity: 0
|
||||
});
|
||||
|
||||
map.addLayer(rectangle3);
|
||||
map.addLayer(rectangle3);
|
||||
}
|
||||
|
||||
function boundsExtendLatLng() {
|
||||
if (rectangle3) {
|
||||
map.removeLayer(rectangle3);
|
||||
rectangle3 = null;
|
||||
}
|
||||
if (bounds3) {
|
||||
bounds3 = null;
|
||||
}
|
||||
bounds3 = new L.LatLngBounds(bounds1.getSouthWest(), bounds1.getNorthEast());
|
||||
bounds3.extend(marker.getLatLng());
|
||||
rectangle3 = new L.Rectangle(bounds3, {
|
||||
color: "#ff0000",
|
||||
weight: 1,
|
||||
opacity: 1,
|
||||
fillOpacity: 0
|
||||
});
|
||||
if (rectangle3) {
|
||||
map.removeLayer(rectangle3);
|
||||
rectangle3 = null;
|
||||
}
|
||||
if (bounds3) {
|
||||
bounds3 = null;
|
||||
}
|
||||
bounds3 = new L.LatLngBounds(bounds1.getSouthWest(), bounds1.getNorthEast());
|
||||
bounds3.extend(marker.getLatLng());
|
||||
rectangle3 = new L.Rectangle(bounds3, {
|
||||
color: "#ff0000",
|
||||
weight: 1,
|
||||
opacity: 1,
|
||||
fillOpacity: 0
|
||||
});
|
||||
|
||||
map.addLayer(rectangle3);
|
||||
map.addLayer(rectangle3);
|
||||
}
|
||||
|
||||
</script>
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@ -78,13 +78,13 @@
|
||||
// get color depending on population density value
|
||||
function getColor(d) {
|
||||
return d > 1000 ? '#800026' :
|
||||
d > 500 ? '#BD0026' :
|
||||
d > 200 ? '#E31A1C' :
|
||||
d > 100 ? '#FC4E2A' :
|
||||
d > 50 ? '#FD8D3C' :
|
||||
d > 20 ? '#FEB24C' :
|
||||
d > 10 ? '#FED976' :
|
||||
'#FFEDA0';
|
||||
d > 500 ? '#BD0026' :
|
||||
d > 200 ? '#E31A1C' :
|
||||
d > 100 ? '#FC4E2A' :
|
||||
d > 50 ? '#FD8D3C' :
|
||||
d > 20 ? '#FEB24C' :
|
||||
d > 10 ? '#FED976' :
|
||||
'#FFEDA0';
|
||||
}
|
||||
|
||||
function style(feature) {
|
||||
@ -137,9 +137,10 @@
|
||||
geojson = L.geoJson(statesData, {
|
||||
style: style,
|
||||
onEachFeature: onEachFeature
|
||||
}).addTo(map);
|
||||
});
|
||||
|
||||
map.attributionControl.addAttribution('Population data © <a href="http://census.gov/">US Census Bureau</a>');
|
||||
geojson.getAttribution = function() { return 'Population data © <a href="http://census.gov/">US Census Bureau</a>' };
|
||||
geojson.addTo(map);
|
||||
|
||||
|
||||
var legend = L.control({position: 'bottomright'});
|
||||
|
||||
@ -51,9 +51,9 @@
|
||||
var poly = new L.Polygon(latlngs2);
|
||||
|
||||
var map = new L.Map('map', {
|
||||
layers: [osm],
|
||||
center: new L.LatLng(39.69596043694606, -104.95084762573242),
|
||||
zoom: 12
|
||||
layers: [osm],
|
||||
center: new L.LatLng(39.69596043694606, -104.95084762573242),
|
||||
zoom: 12
|
||||
});
|
||||
|
||||
//map.fitBounds(new L.LatLngBounds(latlngs));
|
||||
|
||||
@ -12,9 +12,9 @@
|
||||
</head>
|
||||
<body>
|
||||
<div id="map" style="width: 800px; height: 600px; border: 1px solid #ccc"></div>
|
||||
<button onclick="group.removeLayer(path)">Remove path</button>
|
||||
<button onclick="group.removeLayer(circle)">Remove circle</button>
|
||||
<button onclick="group.clearLayers()">Remove all layers</button>
|
||||
<button onclick="group.removeLayer(path)">Remove path</button>
|
||||
<button onclick="group.removeLayer(circle)">Remove circle</button>
|
||||
<button onclick="group.clearLayers()">Remove all layers</button>
|
||||
|
||||
|
||||
<script src="route.js"></script>
|
||||
@ -37,10 +37,10 @@
|
||||
|
||||
var circleLocation = new L.LatLng(51.508, -0.11),
|
||||
circleOptions = {
|
||||
color: 'red',
|
||||
fillColor: 'yellow',
|
||||
fillOpacity: 0.7,
|
||||
renderer: canvas
|
||||
color: 'red',
|
||||
fillColor: 'yellow',
|
||||
fillOpacity: 0.7,
|
||||
renderer: canvas
|
||||
};
|
||||
|
||||
var circle = new L.Circle(circleLocation, 500000, circleOptions),
|
||||
@ -55,9 +55,9 @@
|
||||
path.bindPopup('I am a polyline');
|
||||
|
||||
var p1 = latlngs[0],
|
||||
p2 = latlngs[parseInt(len/4)],
|
||||
p3 = latlngs[parseInt(len/3)],
|
||||
p4 = latlngs[parseInt(len/2)],
|
||||
p2 = latlngs[Math.round(len / 4)],
|
||||
p3 = latlngs[Math.round(len / 3)],
|
||||
p4 = latlngs[Math.round(len / 2)],
|
||||
p5 = latlngs[len - 1],
|
||||
polygonPoints = [p1, p2, p3, p4, p5];
|
||||
|
||||
|
||||
@ -18,7 +18,9 @@
|
||||
osmAttrib = '© <a href="http://openstreetmap.org/copyright">OpenStreetMap</a> contributors',
|
||||
osm = L.tileLayer(osmUrl, {maxZoom: 18, attribution: osmAttrib});
|
||||
|
||||
var map = new L.Map('map', {layers: [osm]});
|
||||
var svg = L.svg();
|
||||
|
||||
var map = new L.Map('map', {layers: [osm], renderer: svg});
|
||||
|
||||
map.addLayer(L.marker(route[0]));
|
||||
map.addLayer(L.marker(route[route.length - 1]));
|
||||
@ -51,7 +53,7 @@
|
||||
'circle': circle,
|
||||
'circleMarker': circleMarker,
|
||||
'canvas': canvas,
|
||||
'svg': map._renderer,
|
||||
'svg': svg,
|
||||
}, {collapsed: false});
|
||||
map.addControl(layersControl);
|
||||
</script>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user