You have played MapRoulette. You have seen some of the fun challenges. If you are reading this, you are probably thinking: 'I have a great idea for the next MapRoulette challenge!'
Great! That is exactly what I am here to explain step by step. So let's get started!
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta charset="utf-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /> | |
| <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet/v0.7.7/leaflet.css" /> | |
| <style> | |
| body { | |
| padding: 0; | |
| margin: 0; |
| var initialCoordinates = [-22.91, -43.20]; // Rio de Janeiro | |
| var initialZoomLevel = 13; | |
| // create a map in the "map" div, set the view to a given place and zoom | |
| var map = L.map('map').setView(initialCoordinates, initialZoomLevel); | |
| // add an OpenStreetMap tile layer | |
| L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', { | |
| attribution: '© Contribuidores do <a href="http://osm.org/copyright">OpenStreetMap</a>' | |
| }).addTo(map); |
| var muxiCoordinates = [-22.903719, -43.1760605]; | |
| var muxiMarkerMessage = "A Muxi fica aqui.<br>Olá mundo!"; | |
| L.marker(muxiCoordinates).addTo(map) | |
| .bindPopup(muxiMarkerMessage) | |
| .openPopup(); |
| var muxiCoordinates = [-22.903719, -43.1760605]; | |
| var muxiMarkerMessage = "A Muxi fica aqui.<br>Olá mundo!"; | |
| var muxiIconProperties = { | |
| iconUrl: "http://muxi.com.br/app/webroot/img/maps-marker.png" | |
| , iconSize: [44, 59] | |
| , iconAnchor: [22, 59] | |
| , popupAnchor: [0, -50] | |
| }; |
| // Extract timetables from BHTrans page | |
| // for instance: http://servicosbhtrans.pbh.gov.br/bhtrans/e-servicos/S01F02-quadroHorarioResultado.asp?linha=SC01R | |
| // fetch tables | |
| let tables = document.querySelectorAll('table') | |
| // work on each table | |
| Array.from(tables).map((table, index) => { | |
| // ignore first table | |
| if (index) { |
| // EXACT TIMES | |
| /* input: | |
| * Origin 12:34 | |
| * Origin 23:45 | |
| * | |
| * output: | |
| * 12:34, 23:45 | |
| */ | |
| e = t => console.log(t.split(`\n`).map(r => { let a = r.split(`\t`); return a[1] }).join(', ')) |
