JSFiddle - React, Tailwind, and code Playground
by Andra Jimenez
HTML
<h3>Bus Routes </h3>
<div id="placeholder"></div>
JavaScript
//Bus route (near) draft 2
function BusStops(json) {
this.name = json.locations[1].name;
this.stop = json.locations[1].stops[0].name;
}
BusStops.prototype.toString = function () {
return "One of the nearest locations to me is: " + this.name + " and one of the stops is " + this.stop;
};
var BusStops = new BusStops({
"locations": [{
"id": 11725,
"uri": "edward_and_elizabeth",
"lng": -79.38546,
"distance": 57.1644892630458,
"name": "Edward and Elizabeth",
"stops": [{
"id": 3030,
"uri": "westbound_on_edward_at_elizabeth",
"lng": -79.385323,
"distance": 61.05536,
"name": "Westbound on Edward at Elizabeth",
"lat": 43.656212
}],
"lat": 43.656113
}, {
"id": 15240,
"uri": "chestnut_and_dundas",
"lng": -79.385986,
"distance": 92.8330108686347,
"name": "Chestnut and Dundas",
"stops": [{
"id": 8429,
"uri": "eastbound_on_dundas_at_chestnut",
"lng": -79.386116,
"distance": 107.74337,
"name": "Eastbound on Dundas at Chestnut",
"lat": 43.655148
}, {
"id": 8449,
"uri": "westbound_on_dundas_at_chestnut",
"lng": -79.385864,
"distance": 78.927466,
"name": "Westbound on Dundas at Chestnut",
"lat": 43.655342
}],
"lat": 43.655247
}, {
"id": 10882,
"uri": "bay_and_dundas",
"lng": -79.38372,
"distance": 104.902941811137,
"name": "Bay and Dundas",
"stops": [{
"id": 130,
"uri": "eastbound_on_dundas_at_bay",
"lng": -79.383987,
"distance": 84.588971,
"name": "Eastbound on Dundas at Bay",
"lat": 43.655579
}, {
"id": 688,
"uri": "northbound_on_bay_at_dundas",
...