first
This commit is contained in:
parent
2e1fa023eb
commit
03be0e849c
3 changed files with 286 additions and 4 deletions
|
|
@ -1,2 +1,3 @@
|
|||
# leafletmapstemplate
|
||||
Template for leaflet maps
|
||||
# datastats
|
||||
Smarty Pins: [here](smartypins.html)
|
||||
Land Lines: [here](landlines.html)
|
||||
|
|
@ -36,6 +36,8 @@
|
|||
<div id="mapid"></div>
|
||||
<script>
|
||||
/* Initialization */
|
||||
var data = L.layerGroup()
|
||||
var foundAnswer = []
|
||||
var mapboxattr = 'Map data © <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, ' + '<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' + 'Imagery © <a href="https://www.mapbox.com/">Mapbox</a>'
|
||||
var gmapsattr = 'Map data © <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, ' + '<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' + 'Imagery © <a href="https://maps.google.com/">Google Maps</a>'
|
||||
var esriattr = 'Map data © <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, ' + '<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' + 'Imagery © <a href="https://www.esri.com/">ESRI</a>'
|
||||
|
|
@ -189,7 +191,7 @@
|
|||
var mymap = L.map('mapid', {
|
||||
center: [0,0],
|
||||
zoom: 2,
|
||||
layers: [normal]
|
||||
layers: [normal, data]
|
||||
})
|
||||
|
||||
var layernames = {
|
||||
|
|
@ -213,7 +215,37 @@
|
|||
"Empty Tile": blank,
|
||||
}
|
||||
|
||||
/* Do whatever you want with your code here */
|
||||
layers = L.control.layers(layernames)
|
||||
layers.addTo(mymap)
|
||||
|
||||
var up = new URLSearchParams(window.location.search)
|
||||
var target = up.get("link") != null ? up.get("link") : "https://storage.googleapis.com/navigator-media-usa/media/connected_line/v2/site/www/draw/metadata-converted.json"
|
||||
var s = new XMLHttpRequest()
|
||||
s.open("GET", target)
|
||||
|
||||
s.onreadystatechange = function() {
|
||||
if (this.readyState == 4 && this.status <= 399) {
|
||||
datac = JSON.parse(this.response)
|
||||
for (k in datac) {
|
||||
lldata = datac[k].url.split("@")[1].split(",")
|
||||
lat = lldata[0]; lng = lldata[1];
|
||||
place = datac[k]["line-1"] + ", " + datac[k]["line-2"]
|
||||
if (foundAnswer.indexOf(lldata[0]) == -1) {
|
||||
foundAnswer.push(lldata[0])
|
||||
assisturl = "https://crawlerop.github.io/psassist/js/getmaplace.html?lat="+lat+"&lng="+lng
|
||||
let m = L.marker([lat,lng], {title: place})
|
||||
|
||||
m.on('click', function(e){
|
||||
mymap.setView([lat, lng], 15);
|
||||
})
|
||||
|
||||
m.bindPopup("<h1>"+place+"</h1><h3>In "+lat+","+lng+"</h3><a href=\""+assisturl+"\">PassiveAssist</a>")
|
||||
m.addTo(data)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
s.send()
|
||||
|
||||
</script>
|
||||
</body>
|
||||
249
smartypins.html
Normal file
249
smartypins.html
Normal file
|
|
@ -0,0 +1,249 @@
|
|||
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="shortcut icon" type="image/x-icon" href="docs/images/favicon.ico" />
|
||||
|
||||
<link rel="stylesheet" href="https://unpkg.com/leaflet@latest/dist/leaflet.css" crossorigin=""/>
|
||||
<script src="https://unpkg.com/leaflet@latest/dist/leaflet.js" crossorigin=""></script>
|
||||
<style>
|
||||
body {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
html, body, #mapid {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
textarea.righttext {
|
||||
position:absolute;
|
||||
right:1px;
|
||||
bottom:15px;
|
||||
resize:none;
|
||||
}
|
||||
button.rightbutton {
|
||||
position:absolute;
|
||||
right:1px;
|
||||
bottom:15px;
|
||||
resize:none;
|
||||
}
|
||||
</style>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<div id="mapid"></div>
|
||||
<script>
|
||||
/* Initialization */
|
||||
var data = L.layerGroup()
|
||||
var foundAnswer = []
|
||||
var mapboxattr = 'Map data © <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, ' + '<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' + 'Imagery © <a href="https://www.mapbox.com/">Mapbox</a>'
|
||||
var gmapsattr = 'Map data © <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, ' + '<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' + 'Imagery © <a href="https://maps.google.com/">Google Maps</a>'
|
||||
var esriattr = 'Map data © <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, ' + '<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' + 'Imagery © <a href="https://www.esri.com/">ESRI</a>'
|
||||
var osmattr = 'Map data © <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors'
|
||||
|
||||
normal = L.tileLayer('https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}@2x?access_token=pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpejY4NXVycTA2emYycXBndHRqcmZ3N3gifQ.rJcFIG214AriISLbB6B5aw', {
|
||||
maxZoom: 21,
|
||||
attribution: mapboxattr,
|
||||
id: 'user12435235124125235824592457/ckao1rqf85kh01imwyf5b0pvc',
|
||||
tileSize: 512,
|
||||
zoomOffset: -1
|
||||
})
|
||||
|
||||
mdefault = L.tileLayer('https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}@2x?access_token=pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpejY4NXVycTA2emYycXBndHRqcmZ3N3gifQ.rJcFIG214AriISLbB6B5aw', {
|
||||
maxZoom: 21,
|
||||
attribution: mapboxattr,
|
||||
id: 'mapbox/streets-v11',
|
||||
tileSize: 512,
|
||||
zoomOffset: -1
|
||||
})
|
||||
|
||||
mgray = L.tileLayer('https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}@2x?access_token=pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpejY4NXVycTA2emYycXBndHRqcmZ3N3gifQ.rJcFIG214AriISLbB6B5aw', {
|
||||
maxZoom: 21,
|
||||
attribution: mapboxattr,
|
||||
id: 'mapbox/light-v9',
|
||||
tileSize: 512,
|
||||
zoomOffset: -1
|
||||
})
|
||||
|
||||
esrinormal = L.tileLayer('https://services.arcgisonline.com/arcgis/rest/services/World_Street_Map/MapServer/tile/{z}/{y}/{x}', {
|
||||
maxZoom: 21,
|
||||
attribution: esriattr,
|
||||
id: 'user12435235124125235824592457/ckao1rqf85kh01imwyf5b0pvc',
|
||||
tileSize: 256,
|
||||
zoomOffset: 0
|
||||
})
|
||||
|
||||
esriterrain = L.tileLayer('https://services.arcgisonline.com/arcgis/rest/services/World_Topo_Map/MapServer/tile/{z}/{y}/{x}', {
|
||||
maxZoom: 21,
|
||||
attribution: esriattr,
|
||||
id: 'user12435235124125235824592457/ckao1rqf85kh01imwyf5b0pvc',
|
||||
tileSize: 256,
|
||||
zoomOffset: 0
|
||||
})
|
||||
|
||||
osm = L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
|
||||
maxZoom: 21,
|
||||
attribution: osmattr,
|
||||
id: 'user12435235124125235824592457/ckao1rqf85kh01imwyf5b0pvc',
|
||||
tileSize: 256,
|
||||
zoomOffset: 0
|
||||
})
|
||||
|
||||
satellite = L.tileLayer('https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}@2x?access_token=pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpejY4NXVycTA2emYycXBndHRqcmZ3N3gifQ.rJcFIG214AriISLbB6B5aw', {
|
||||
maxZoom: 21,
|
||||
attribution: mapboxattr,
|
||||
id: 'user12435235124125235824592457/ckanekpxi1o3y1ipkm8tl6v3i',
|
||||
tileSize: 512,
|
||||
zoomOffset: -1
|
||||
})
|
||||
|
||||
satellitenotext = L.tileLayer('https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}@2x?access_token=pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpejY4NXVycTA2emYycXBndHRqcmZ3N3gifQ.rJcFIG214AriISLbB6B5aw', {
|
||||
maxZoom: 21,
|
||||
attribution: mapboxattr,
|
||||
id: 'user12435235124125235824592457/ckb7ik2nf4rel1ip61enm2h23',
|
||||
tileSize: 512,
|
||||
zoomOffset: -1
|
||||
})
|
||||
|
||||
gmapsnormal = L.tileLayer('https://www.google.com/maps/vt/pb=!1m4!1m3!1i{z}!2i{x}!3i{y}!2m1!1i0!3m2!2sen-US!5i1106!5m1!5f4.0!23i1358902', {
|
||||
maxZoom: 21,
|
||||
attribution: gmapsattr,
|
||||
id: 'user12435235124125235824592457/ckao1rqf85kh01imwyf5b0pvc',
|
||||
tileSize: 256,
|
||||
zoomOffset: 0
|
||||
})
|
||||
|
||||
gmapsvue = L.tileLayer('https://maps.googleapis.com/maps/vt?pb=!1m5!1m4!1i{z}!2i{x}!3i{y}!4i256!2m3!1e0!2sm!3i520236120!3m17!2sen-US!3sUS!5e18!12m4!1e68!2m2!1sset!2sRoadmap!12m3!1e37!2m1!1ssmartmaps!12m4!1e26!2m2!1sstyles!2zcy50OjF8cy5lOmwudC5mfHAuYzojZmY0NDQ0NDQscy50OjV8cC5jOiNmZmYyZjJmMixzLnQ6MnxwLnY6b2ZmLHMudDozfHAuczotMTAwfHAubDo0NSxzLnQ6NDl8cC52OnNpbXBsaWZpZWQscy50OjUwfHMuZTpsLml8cC52Om9mZixzLnQ6NHxwLnY6b2ZmLHMudDo2fHAuYzojZmYyNjJlNDV8cC52Om9uLHMudDo2fHMuZTpsfHAudjpvZmY!4e0!5m1!5f4.0', {
|
||||
maxZoom: 21,
|
||||
attribution: gmapsattr,
|
||||
id: 'user12435235124125235824592457/ckao1rqf85kh01imwyf5b0pvc',
|
||||
tileSize: 256,
|
||||
zoomOffset: 0
|
||||
})
|
||||
|
||||
gmapsfb = L.tileLayer('https://maps.googleapis.com/maps/vt?pb=!1m5!1m4!1i{z}!2i{x}!3i{y}!4i256!2m3!1e0!2sm!3i520236108!3m17!2sen-US!3sUS!5e18!12m4!1e68!2m2!1sset!2sRoadmap!12m3!1e37!2m1!1ssmartmaps!12m4!1e26!2m2!1sstyles!2zcy5lOmwuaXxwLnY6b2ZmLHMudDoxfHAudjpvbixzLnQ6NXxwLmM6I2ZmZThlOWU5LHMudDoyfHMuZTpnfHAuYzojZmZlOGU5ZTkscy50OjQwfHAuYzojZmZiYWQyOTQscy50OjQwfHMuZTpsfHAudjpvZmYscy50OjQ5fHMuZTpnLmZ8cC5jOiNmZmZmZmZmZixzLnQ6NDl8cy5lOmcuc3xwLnY6b2ZmLHMudDo1MHxzLmU6Zy5mfHAuYzojZmZmZmZmZmYscy50OjUwfHMuZTpnLnN8cC52Om9mZixzLnQ6NTF8cy5lOmcuZnxwLmM6I2ZmZmJmYmZiLHMudDo0fHAudjpvZmYscy50OjZ8cy5lOmd8cC5jOiNmZjQxYWVjOSxzLnQ6NnxzLmU6bC50LmZ8cC5jOiNmZjA2NTk3MSxzLnQ6NnxzLmU6bC50LnN8cC52OnNpbXBsaWZpZWQ!4e0!5m1!5f4.0', {
|
||||
maxZoom: 21,
|
||||
attribution: gmapsattr,
|
||||
id: 'user12435235124125235824592457/ckao1rqf85kh01imwyf5b0pvc',
|
||||
tileSize: 256,
|
||||
zoomOffset: 0
|
||||
})
|
||||
|
||||
gmapsgray = L.tileLayer('https://maps.googleapis.com/maps/vt?pb=!1m5!1m4!1i{z}!2i{x}!3i{y}!4i256!2m3!1e0!2sm!3i520233372!3m17!2sen-US!3sUS!5e18!12m4!1e68!2m2!1sset!2sRoadmap!12m3!1e37!2m1!1ssmartmaps!12m4!1e26!2m2!1sstyles!2zcy50OjZ8cy5lOmd8cC5jOiNmZmU5ZTllOXxwLmw6MTcscy50OjV8cy5lOmd8cC5jOiNmZmY1ZjVmNXxwLmw6MjAscy50OjQ5fHMuZTpnLmZ8cC5jOiNmZmZmZmZmZnxwLmw6MTcscy50OjQ5fHMuZTpnLnN8cC5jOiNmZmZmZmZmZnxwLmw6Mjl8cC53OjAuMixzLnQ6NTB8cy5lOmd8cC5jOiNmZmZmZmZmZnxwLmw6MTgscy50OjUxfHMuZTpnfHAuYzojZmZmZmZmZmZ8cC5sOjE2LHMudDoyfHMuZTpnfHAuYzojZmZmNWY1ZjV8cC5sOjIxLHMudDo0MHxzLmU6Z3xwLmM6I2ZmZGVkZWRlfHAubDoyMSxzLmU6bC50LnN8cC52Om9ufHAuYzojZmZmZmZmZmZ8cC5sOjE2LHMuZTpsLnQuZnxwLnM6MzZ8cC5jOiNmZjMzMzMzM3xwLmw6NDAscy5lOmwuaXxwLnY6b2ZmLHMudDo0fHMuZTpnfHAuYzojZmZmMmYyZjJ8cC5sOjE5LHMudDoxfHMuZTpnLmZ8cC5jOiNmZmZlZmVmZXxwLmw6MjAscy50OjF8cy5lOmcuc3xwLmM6I2ZmZmVmZWZlfHAubDoxN3xwLnc6MS4y!4e0!5m1!5f4.0', {
|
||||
maxZoom: 21,
|
||||
attribution: gmapsattr,
|
||||
id: 'user12435235124125235824592457/ckao1rqf85kh01imwyf5b0pvc',
|
||||
tileSize: 256,
|
||||
zoomOffset: 0
|
||||
})
|
||||
|
||||
gmapsbold = L.tileLayer('https://www.google.com/maps/vt?pb=!1m4!1m3!1i{z}!2i{x}!3i{y}!2m2!2sm!3i504221335!3m7!2sen-US!5i1105!12m4!1i68!2m2!1sset!2sTerrain!5m1!5f4.0!23i1358902', {
|
||||
maxZoom: 21,
|
||||
attribution: gmapsattr,
|
||||
id: 'user12435235124125235824592457/ckao1rqf85kh01imwyf5b0pvc',
|
||||
tileSize: 256,
|
||||
zoomOffset: 0
|
||||
})
|
||||
|
||||
esrisatellite = L.tileLayer('https://services.arcgisonline.com/arcgis/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}', {
|
||||
maxZoom: 21,
|
||||
attribution: esriattr,
|
||||
id: 'user12435235124125235824592457/ckao1rqf85kh01imwyf5b0pvc',
|
||||
tileSize: 256,
|
||||
zoomOffset: 0
|
||||
})
|
||||
|
||||
esrisatellitealt = L.tileLayer('https://clarity.maptiles.arcgis.com/arcgis/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}', {
|
||||
maxZoom: 21,
|
||||
attribution: esriattr,
|
||||
id: 'user12435235124125235824592457/ckao1rqf85kh01imwyf5b0pvc',
|
||||
tileSize: 256,
|
||||
zoomOffset: 0
|
||||
})
|
||||
|
||||
gmapssatellite = L.tileLayer('https://mt{s}.googleapis.com/vt?lyrs=y&hl=en-US&x={x}&y={y}&z={z}', {
|
||||
maxZoom: 21,
|
||||
attribution: gmapsattr,
|
||||
id: 'user12435235124125235824592457/ckanekpxi1o3y1ipkm8tl6v3i',
|
||||
tileSize: 256,
|
||||
zoomOffset: 0,
|
||||
subdomains: ["0", "1", "2", "3"]
|
||||
})
|
||||
|
||||
gmapssatellitenotext = L.tileLayer('https://mt{s}.googleapis.com/vt?lyrs=s&hl=en-US&x={x}&y={y}&z={z}', {
|
||||
maxZoom: 21,
|
||||
attribution: gmapsattr,
|
||||
id: 'user12435235124125235824592457/ckanekpxi1o3y1ipkm8tl6v3i',
|
||||
tileSize: 256,
|
||||
zoomOffset: 0,
|
||||
subdomains: ["0", "1", "2", "3"]
|
||||
})
|
||||
|
||||
blank = L.tileLayer('http://nope', {
|
||||
maxZoom: 21,
|
||||
attribution: "",
|
||||
tileSize: 256,
|
||||
zoomOffset: 0,
|
||||
})
|
||||
|
||||
var mymap = L.map('mapid', {
|
||||
center: [0,0],
|
||||
zoom: 2,
|
||||
layers: [normal, data]
|
||||
})
|
||||
|
||||
var layernames = {
|
||||
"Mapbox Normal": normal,
|
||||
"Mapbox Streets": mdefault,
|
||||
"Mapbox Grayscale": mgray,
|
||||
"Google Maps Normal": gmapsnormal,
|
||||
"Google Maps Normal (Better)": gmapsfb,
|
||||
"Google Maps Bold": gmapsbold,
|
||||
"Google Maps Vue": gmapsvue,
|
||||
"Google Maps Grayscale": gmapsgray,
|
||||
"OSM": osm,
|
||||
"ESRI Normal": esrinormal,
|
||||
"ESRI Terrain": esriterrain,
|
||||
"Mapbox Satellite": satellite,
|
||||
"Mapbox Satellite (no label)": satellitenotext,
|
||||
"Google Maps Satellite": gmapssatellite,
|
||||
"Google Maps Satellite (no label)": gmapssatellitenotext,
|
||||
"ESRI Satellite": esrisatellite,
|
||||
"ESRI Satellite (alt)": esrisatellitealt,
|
||||
"Empty Tile": blank,
|
||||
}
|
||||
|
||||
layers = L.control.layers(layernames)
|
||||
layers.addTo(mymap)
|
||||
|
||||
var up = new URLSearchParams(window.location.search)
|
||||
var target = up.get("link") != null ? up.get("link") : "https://raw.githubusercontent.com/crawlerop/everysmartypinsquestions/newheights/main-orig.json"
|
||||
var s = new XMLHttpRequest()
|
||||
s.open("GET", target)
|
||||
|
||||
s.onreadystatechange = function() {
|
||||
if (this.readyState == 4 && this.status <= 399) {
|
||||
datac = JSON.parse(this.response).items
|
||||
datac.forEach(function(i) {
|
||||
if (foundAnswer.indexOf([i.answer.location.lat, i.answer.location.lng].join(",")) == -1) {
|
||||
foundAnswer.push([i.answer.location.lat, i.answer.location.lng].join(","))
|
||||
assisturl = "https://crawlerop.github.io/psassist/js/getmaplace.html?lat="+i.answer.location.lat+"&lng="+i.answer.location.lng
|
||||
let m = L.marker([i.answer.location.lat, i.answer.location.lng], {title: i.answer.title})
|
||||
|
||||
m.on('click', function(e){
|
||||
mymap.setView([i.answer.location.lat, i.answer.location.lng], 19);
|
||||
})
|
||||
|
||||
m.bindPopup("<h1>"+i.answer.title+"</h1><h3>In "+i.answer.location.lat+","+i.answer.location.lng+"</h3><a href=\""+assisturl+"\">PassiveAssist</a>")
|
||||
m.addTo(data)
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
s.send()
|
||||
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Add table
Add a link
Reference in a new issue