Compare commits
2 commits
baae37b4c9
...
4143e1e78f
Author | SHA1 | Date | |
---|---|---|---|
4143e1e78f | |||
d859317986 |
1 changed files with 16 additions and 5 deletions
|
@ -14,13 +14,23 @@
|
||||||
<body>
|
<body>
|
||||||
<div id="map"></div>
|
<div id="map"></div>
|
||||||
<script>
|
<script>
|
||||||
let map=L.map("map",{center:[38.2,-85.75],zoom:13,layers:[L.tileLayer("https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png")]});
|
let map=L.map("map",{center:[38.22,-85.7],zoom:12,layers:[L.tileLayer("https://tile.thunderforest.com/transport/{z}/{x}/{y}.png?apikey=cf957cde4a7b40bbb49479c8fa4d60f7")]});
|
||||||
let stops={{stops}};
|
let stops={{stops}};
|
||||||
for (stop in stops){
|
for (stop in stops){
|
||||||
L.circle(stops[stop]).bindPopup(`<iframe src="https://tarc.rideralerts.com/InfoPoint/Minimal/Departures/ForStop?stopId=${stop}">Stop #${stop}</iframe>`).addTo(map)
|
L.circle(stops[stop]).bindPopup(`<iframe src="https://tarc.rideralerts.com/InfoPoint/Minimal/Departures/ForStop?stopId=${stop}">Stop #${stop}</iframe>`).addTo(map)
|
||||||
}
|
}
|
||||||
|
let busIcon=L.icon({iconUrl:'static/bus.ico',iconSize:[32,32]})
|
||||||
let layerControl=L.control.layers().addTo(map);
|
let layerControl=L.control.layers().addTo(map);
|
||||||
let busLayers={},busMarkers={};
|
let busLayers={},busMarkers={};
|
||||||
|
function filterRoutes(wanted){
|
||||||
|
for(r in busLayers){
|
||||||
|
if(!wanted||wanted==r){
|
||||||
|
map.addLayer(busLayers[r])
|
||||||
|
} else{
|
||||||
|
map.removeLayer(busLayers[r])
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
function updateMap(){
|
function updateMap(){
|
||||||
let routes={};
|
let routes={};
|
||||||
fetch("tarc.csv").then(response=>response.text()).then(csv=>{
|
fetch("tarc.csv").then(response=>response.text()).then(csv=>{
|
||||||
|
@ -29,7 +39,7 @@ function updateMap(){
|
||||||
p=parseInt(p);
|
p=parseInt(p);
|
||||||
t=new Date(t*1000).toLocaleTimeString("en-US",{hour12:false});
|
t=new Date(t*1000).toLocaleTimeString("en-US",{hour12:false});
|
||||||
if(!busLayers[r]){busLayers[r]=L.layerGroup().addTo(map)}
|
if(!busLayers[r]){busLayers[r]=L.layerGroup().addTo(map)}
|
||||||
if(!busMarkers[id]){busMarkers[id]=L.marker([0,0]).addTo(busLayers[r])}
|
if(!busMarkers[id]){busMarkers[id]=L.marker([0,0],{icon:busIcon}).on('click',()=>filterRoutes(r)).addTo(busLayers[r])}
|
||||||
if(!routes[r]){routes[r]=[0,0]}
|
if(!routes[r]){routes[r]=[0,0]}
|
||||||
routes[r][0]++;
|
routes[r][0]++;
|
||||||
routes[r][1]+=p;
|
routes[r][1]+=p;
|
||||||
|
@ -37,15 +47,16 @@ function updateMap(){
|
||||||
})
|
})
|
||||||
let overlayLayers={};
|
let overlayLayers={};
|
||||||
for(let r in routes){
|
for(let r in routes){
|
||||||
overlayLayers[`${r} (${routes[r][0]} vehicle(s) with ${routes[r][1]} riders)`]=busLayers[r]
|
overlayLayers[`${r.padStart(2,0)} | ${String(routes[r][0]).padStart(2,0)} vehicle(s) | ${routes[r][1]} rider(s)`]=busLayers[r]
|
||||||
}
|
}
|
||||||
layerControl.remove();
|
layerControl.remove();
|
||||||
layerControl=L.control.layers(null,overlayLayers,{collapsed:window.innerWidth<window.innerHeight}).addTo(map);
|
layerControl=L.control.layers(null,overlayLayers,{collapsed:window.innerWidth<window.innerHeight}).addTo(map);
|
||||||
let iframe=document.querySelector("iframe");if(iframe)iframe.src=iframe.src;
|
let iframe=document.querySelector("iframe");if(iframe)iframe.src=iframe.src
|
||||||
setTimeout(updateMap,5000)
|
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
updateMap();
|
updateMap();
|
||||||
|
setInterval(updateMap,5000);
|
||||||
|
map.on('click',()=>filterRoutes())
|
||||||
|
|
||||||
let locationMarker=L.marker([0,0]).addTo(map);
|
let locationMarker=L.marker([0,0]).addTo(map);
|
||||||
let locationRadius=L.circle([0,0]).addTo(map).bringToBack();
|
let locationRadius=L.circle([0,0]).addTo(map).bringToBack();
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue