diff --git a/templates/map.html b/templates/map.html
index a3adc55..009a076 100644
--- a/templates/map.html
+++ b/templates/map.html
@@ -19,8 +19,18 @@ let stops={{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)
 }
+let busIcon=L.icon({iconUrl:'static/bus.ico',iconSize:[32,32]})
 let layerControl=L.control.layers().addTo(map);
 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(){
 	let routes={};
 	fetch("tarc.csv").then(response=>response.text()).then(csv=>{
@@ -29,7 +39,7 @@ function updateMap(){
 			p=parseInt(p);
 			t=new Date(t*1000).toLocaleTimeString("en-US",{hour12:false});
 			if(!busLayers[r]){busLayers[r]=L.layerGroup().addTo(map)}
-			if(!busMarkers[id]){busMarkers[id]=L.marker([0,0],{icon:L.icon({iconUrl:'static/bus.ico',iconSize:[24,24]})}).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]}
 			routes[r][0]++;
 			routes[r][1]+=p;
@@ -37,7 +47,7 @@ function updateMap(){
 		})
 		let overlayLayers={};
 		for(let r in routes){
-			overlayLayers[`${r} | ${routes[r][0]} vehicle(s) with ${routes[r][1]} rider(s)`]=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=L.control.layers(null,overlayLayers,{collapsed:window.innerWidth<window.innerHeight}).addTo(map);
@@ -46,6 +56,7 @@ function updateMap(){
 }
 updateMap();
 setInterval(updateMap,5000);
+map.on('click',()=>filterRoutes())
 
 let locationMarker=L.marker([0,0]).addTo(map);
 let locationRadius=L.circle([0,0]).addTo(map).bringToBack();