The last 10 minutes of bus positions in Washington DC From WMATAAPIAPI

An example of how you could use the wmataapiapi API, based off of the hosted version.

Want to help? Improve the code, or host an instance! I'm hosting this out-of-pocket and would love for it to be owned instead by some organization with a vested interest.

<!DOCTYPE html>
<meta charset="utf-8">
<style>

body {
  margin:0;
  padding:0;
  background:#002833;
}

.bus {
    opacity:0.6;
    fill:#ffe;
}

p {
    color:#eef;
    position:absolute;
    font:12px/20px;
    right:20px;
    bottom:10px;
}
p a {
    color:#fff;
}

</style>
<body>
<script src="https://d3js.org/d3.v3.min.js"></script>
<script src="https://d3js.org/queue.v1.min.js"></script>
<script>

var width = window.innerWidth,
    height = window.innerHeight;

var svg = d3.select("body").append("svg")
    .attr("width", width)
    .attr("height", height);

var g = svg.append('g')
    .attr("width", width)
    .attr("height", height);

var projection = d3.geo.orthographic()
    .scale(99500)
    .translate([width / 2, height / 2])
    .clipAngle(90)
    .rotate([77.0398, -38.9058])
    .precision(.1);

var path = d3.geo.path()
    .pointRadius(3)
    .projection(projection);

d3.json("https://secret-wildwood-1777.herokuapp.com/bus/position/history/", function(error, list) {
    var q = queue(1);
    list.slice(0, 10).forEach(function(l) {
        q.defer(d3.json, l.url);
    });
    q.awaitAll(function(err, resp) {
        var i = 0;
        function run() {
            draw(resp[i].features);
            if (++i > resp.length - 1) i = 0;
        }
        window.setInterval(run, 100 * 1);
        run();
    });
});

function draw(features) {
    var buses = svg.selectAll("path")
        .data(features, function(d) {
            return d && d.properties.tripid;
        });
    buses.exit().remove();
    buses.enter().append("path")
        .attr('class', 'bus');
    buses.transition().attr("d", path);
}
</script>
<p>
<a href='https://github.com/tmcw/wmataapiapi'>tmcw/wmataapiapi</a> powered by
<a href='https://secret-wildwood-1777.herokuapp.com/'>wmataapiapi</a>
</p>

Modified http://d3js.org/d3.v3.min.js to a secure url

Modified http://d3js.org/queue.v1.min.js to a secure url

https://d3js.org/d3.v3.min.js

https://d3js.org/queue.v1.min.js