Skip to content

Instantly share code, notes, and snippets.

@BobHarper1

BobHarper1/.block

Last active March 28, 2017 13:34
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save BobHarper1/da1e97ecf3828ae01b0950cf554c96d6 to your computer and use it in GitHub Desktop.
Save BobHarper1/da1e97ecf3828ae01b0950cf554c96d6 to your computer and use it in GitHub Desktop.
Download ZIP
Rail and Road Disruptions Calendar
Raw
.block
license: gpl-3.0
border: no
Raw
disrup.csv
date rail road number
2006-01-25 23 23
2006-01-27 19 19
2006-04-19 41 41
2006-04-20 61 61
2006-04-21 10 10
2006-05-24 58 58
2006-05-25 6 6
2006-06-09 23 23
2006-06-10 1 1
2006-06-11 14 14
2006-06-22 10 10
2006-06-27 9 9
2006-07-14 1 1
2006-08-09 10 10
2006-08-11 22 22
2006-08-12 27 27
2006-08-13 10 10
2006-09-23 3 3
2006-11-12 7 7
2006-11-13 49 49
2007-03-29 1 1
2007-03-30 151 151
2007-03-31 104 104
2007-04-01 42 42
2007-04-02 115 115
2007-04-03 51 51
2007-04-04 70 70
2007-04-05 95 95
2007-04-06 23 23
2007-04-19 21 21
2007-07-16 18 18
2007-07-17 20 20
2007-11-18 10 10
2007-11-21 10 10
2007-12-12 136 136
2008-01-01 6 6
2008-03-04 2 2
2008-04-29 15 15
2008-05-08 14 14
2008-05-17 6 6
2008-07-21 39 39
2008-07-22 10 10
2008-07-23 13 13
2008-08-02 2 2
2008-08-03 11 11
2008-08-05 13 13
2008-08-07 3 3
2008-08-08 14 14
2008-08-15 3 3
2008-08-22 4 4
2008-08-23 19 19
2008-10-20 83 83
2008-10-31 3 3
2008-11-01 21 21
2008-11-02 5 5
2008-11-09 2 2
2008-11-10 34 34
2008-12-02 1 1
2009-02-22 3 3
2009-03-08 16 16
2009-03-11 1 1
2009-03-24 3 3
2009-03-25 1 1
2009-03-27 16 16
2009-03-28 10 10
2009-03-30 5 5
2009-03-31 38 38
2009-04-04 8 8
2009-04-05 2 2
2009-04-12 5 5
2009-04-25 7 7
2009-05-01 1 1
2009-06-18 32 32
2009-06-19 19 19
2009-07-05 8 8
2009-07-10 80 80
2009-07-13 1 1
2009-07-20 6 6
2009-07-24 2 2
2009-09-12 3 3
2009-09-17 21 21
2009-09-18 45 45
2009-09-19 34 34
2009-09-20 15 15
2009-09-21 34 34
2009-09-22 27 27
2009-09-23 1 1
2009-09-25 1 1
2009-09-26 29 29
2009-12-18 30 30
2010-03-19 54 54
2010-03-20 18 18
2010-03-21 10 10
2010-03-22 18 18
2010-03-23 18 18
2010-03-25 48 48
2010-04-04 1 1
2010-04-05 76 76
2010-04-06 15 15
2010-04-13 4 4
2010-04-18 4 4
2010-05-02 12 12
2010-05-05 14 14
2010-05-17 51 51
2010-05-25 5 5
2010-06-10 45 45
2010-06-17 11 11
2010-06-24 1 1
2010-07-01 5 5
2010-07-02 2 2
2010-07-04 27 27
2010-07-08 34 34
2010-07-12 30 30
2010-07-13 79 79
2010-08-14 39 39
2010-08-16 79 79
2010-09-28 12 12
2010-10-16 21 21
2010-10-29 83 83
2010-10-30 65 65
2010-12-17 3 3
2011-02-23 8 8
2011-04-08 19 19
2011-05-14 6 6
2011-05-16 15 15
2011-05-17 18 18
2011-05-18 23 23
2011-05-27 69 69
2011-06-21 11 11
2011-06-27 8 8
2011-07-06 18 18
2011-07-07 19 19
2011-07-08 14 14
2011-07-12 5 5
2011-07-13 2 2
2011-09-19 65 65
2011-09-26 1 1
2011-10-07 24 24
2011-11-13 3 3
2012-05-04 6 6
2012-07-11 18 18
2012-08-01 66 66
2012-11-15 11 11
2012-12-20 7 7
2013-01-11 2 2
2013-01-12 28 28
2013-01-14 1 1
2013-01-18 1 1
2013-01-29 1 1
2013-01-30 1 1
2013-02-01 1 1
2013-02-02 1 1
2013-02-07 1 1
2013-02-14 2 2
2013-02-15 1 1
2013-02-16 1 1
2013-02-18 14 14
2013-02-22 1 1
2013-02-23 1 1
2013-02-26 1 1
2013-02-27 1 1
2013-02-28 1 1
2013-03-02 2 2
2013-03-03 1 1
2013-03-07 1 1
2013-03-08 4 3 7
2013-03-09 2 1 3
2013-03-11 16 1 17
2013-03-15 1 1
2013-03-16 1 1
2013-03-17 1 1
2013-03-22 2 2
2013-03-24 1 1
2013-03-28 1 1
2013-03-29 4 4
2013-03-30 1 1
2013-03-31 1 1
2013-04-01 1 1
2013-04-03 2 2
2013-04-08 1 1
2013-04-12 1 1
2013-04-16 1 1
2013-04-25 2 2
2013-05-06 1 1
2013-05-16 1 1
2013-05-21 1 1
2013-05-24 1 1
2013-05-28 1 1
2013-06-02 1 1
2013-06-07 1 1
2013-06-16 2 2
2013-06-17 104 1 105
2013-06-18 1 1
2013-07-08 1 1
2013-07-12 27 27
2013-07-18 2 2
2013-07-19 22 1 23
2013-07-28 1 1
2013-08-02 2 2
2013-08-06 1 1
2013-08-12 1 1
2013-08-23 1 1
2013-08-26 1 1
2013-08-27 1 1
2013-08-28 1 1
2013-09-04 1 1
2013-09-09 1 1
2013-09-11 2 2
2013-09-22 2 2
2013-10-02 1 1
2013-10-03 61 61
2013-10-04 91 91
2013-10-07 1 1
2013-10-08 1 1
2013-10-10 1 1
2013-10-14 2 2
2013-10-18 2 2
2013-10-26 36 1 37
2013-10-30 1 1
2013-11-05 1 1
2013-11-08 1 1
2013-11-10 10 10
2013-11-11 27 27
2013-11-16 1 1
2013-11-21 1 1
2013-11-23 1 1
2013-11-24 3 3
2013-11-25 1 1
2013-11-26 1 1
2013-12-06 1 1
2013-12-10 1 1
2013-12-14 1 1
2013-12-15 1 1
2013-12-20 1 1
2014-01-14 1 1
2014-01-20 1 1
2014-01-24 1 1
2014-02-03 13 13
2014-02-27 1 1
2014-03-07 1 1
2014-03-08 2 2
2014-03-14 2 2
2014-03-16 18 18
2014-03-26 1 1
2014-03-27 1 1
2014-03-30 3 3
2014-04-01 1 1
2014-04-02 1 1
2014-04-24 1 1
2014-05-15 1 1
2014-05-29 1 1
2014-06-12 1 1
2014-06-18 1 1
2014-06-30 1 1
2014-07-03 1 1
2014-07-15 1 1
2014-07-18 1 1
2014-08-07 1 1
2014-08-08 1 1
2014-08-20 1 1
2014-09-17 1 1
2014-09-26 1 1
2014-09-27 6 6
2014-10-08 1 1
2014-10-21 1 1
2014-10-27 1 1
2014-10-29 1 1
2014-11-02 1 1
2014-11-16 1 1
2014-11-17 1 1
2014-11-20 1 1
2014-11-21 1 1
2014-12-09 1 1
2014-12-11 1 1
2014-12-20 8 8
2014-12-30 1 1
2015-01-08 1 1
2015-01-20 1 1
2015-01-26 44 2 46
2015-02-04 29 1 30
2015-02-05 62 1 63
2015-02-06 1 1
2015-02-08 1 1
2015-02-13 1 1
2015-02-16 2 2
2015-02-25 1 1
2015-02-27 1 1
2015-03-12 2 2
2015-03-15 4 1 5
2015-03-16 66 66
2015-03-18 1 1
2015-03-30 1 1
2015-04-03 1 1
2015-04-05 1 1
2015-04-08 1 1
2015-04-22 1 1
2015-05-01 2 2
2015-05-04 11 11
2015-05-07 6 1 7
2015-05-19 1 1
2015-05-26 1 1
2015-07-06 1 1
2015-07-10 1 1
2015-07-13 2 2
2015-07-18 35 1 36
2015-07-19 2 2
2015-07-21 1 1
2015-07-23 1 1
2015-08-01 1 1
2015-08-04 1 1
2015-08-11 2 2
2015-08-19 1 1
2015-09-09 1 1
2015-10-09 3 3
2015-10-15 1 1
2015-10-16 2 2
2015-10-17 8 8
2015-10-18 8 8
2015-10-19 1 1
2015-10-23 1 1
2015-10-26 2 2
2015-10-30 9 9
2015-10-31 13 13
2015-11-07 1 1
2015-11-11 1 1
2015-11-12 1 1
2015-11-26 2 2
2015-12-05 27 1 28
2015-12-06 4 4
Raw
index.html
<!DOCTYPE html>
<meta charset="utf-8">
<style>
.calendar {
font: 10px sans-serif;
shape-rendering: crispEdges;
}
.day {
fill: #fff;
stroke: #ccc;
}
.month {
fill: none;
stroke: #000;
stroke-width: 2px;
}
.RdYlGn .q0-11{fill:rgb(254,204,92)}
.RdYlGn .q1-11{fill:rgb(253,141,60)}
.RdYlGn .q2-11{fill:rgb(240,59,32)}
.RdYlGn .q3-11{fill:rgb(189,0,38)}
#tooltip {
font: 12px sans-serif;
background-color: #fff;
border: 2px solid #ccc;
padding: 10px;
}
</style>
<body>
<div class="calendar"></div>
<script src="https://d3js.org/d3.v3.min.js" charset="utf-8"></script>
<script>
var width = 921, // width
height = 156, // height
cellSize = 17; // cell size
var format = d3.time.format("%Y-%m-%d"),
month_name = d3.time.format("%b"),
week_days = ['Sun','Mon','Tue','Wed','Thu','Fri','Sat'];
var color = d3.scale.quantize()
.domain([1,50])
.range(d3.range(4).map(function(d) { return "q" + d + "-11"; }));
var svg = d3.select(".calendar").selectAll("svg")
.data(d3.range(2013, 2016))
.enter().append("svg")
.attr("width", '100%')
.attr("viewBox", '0 0 960 156')
.attr("class", "RdYlGn")
.append("g")
.attr("transform", "translate(" + ((width - cellSize * 53) / 2 + 11) + "," + (height - cellSize * 7 - 1) + ")");
svg.append("text")
.attr("transform", "translate(-11," + cellSize * 3.5 + ")rotate(-90)")
.style("text-anchor", "middle")
.text(function(d) { return d; });
for (var i=0; i<7; i++)
{
svg.append("text")
.attr("transform", "translate(" + (width-11) + ',' + cellSize*(i+1) + ")")
.style("text-anchor", "start")
.attr("dy", "-.25em")
.text(function(d) { return week_days[i]; });
}
var rect = svg.selectAll(".day")
.data(function(d) { return d3.time.days(new Date(d, 0, 1), new Date(d + 1, 0, 1)); })
.enter().append("rect")
.attr("class", "day")
.attr("width", cellSize)
.attr("height", cellSize)
.attr("x", function(d) { return d3.time.weekOfYear(d) * cellSize; })
.attr("y", function(d) { return d.getDay() * cellSize; })
.datum(format);
svg.selectAll(".month")
.data(function(d) { return d3.time.months(new Date(d, 0, 1), new Date(d + 1, 0, 1)); })
.enter().append("path")
.attr("class", "month")
.attr("d", monthPath);
svg.selectAll("text.month")
.data(function(d) { return d3.time.months(new Date(d, 0, 1), new Date(d + 1, 0, 1)); })
.enter().append("text")
.attr("class", "month")
.attr("x", function(d) { return d3.time.weekOfYear(d) * cellSize + cellSize; })
.attr("y", -10)
.style("stroke-width", "0px")
.style("fill", "#000")
.text(month_name);
d3.csv("disrup.csv", function(error, csv) {
if (error) throw error;
var data = d3.nest()
.key(function(d) { return d.date; })
.rollup(function(d) {
return {
number: d[0].number,
rail: d[0].rail,
road: d[0].road
};
})
.map(csv);
console.log(data);
rect.filter(function(d) { return d in data; })
.attr("class", function(d) { return "day " + color(data[d].number); })
// Tooltip
rect.on("mouseover", mouseover);
rect.on("mouseout", mouseout);
function mouseover(d) {
tooltip.style("visibility", "visible");
var disruptions = (data[d] !== undefined) ? ": " + data[d].number + " disruptions" : (': no incidents');
var rail = (data[d].rail !== "") ? + data[d].rail + " rail services affected</br>" : ('');
var road = (data[d].road !== "") ? + data[d].road + " road closures" : ('');
var date_text = "<b>" + d + disruptions + "</b></br>" + rail + road;
tooltip.transition()
.duration(200)
.style("opacity", .9);
tooltip.html(date_text)
.style("left", (d3.event.pageX)+30 + "px")
.style("top", (d3.event.pageY) + "px");
}
function mouseout (d) {
tooltip.transition()
.duration(500)
.style("opacity", 0);
var $tooltip = $("#tooltip");
$tooltip.empty();
}
});
function monthPath(t0) {
var t1 = new Date(t0.getFullYear(), t0.getMonth() + 1, 0),
d0 = t0.getDay(), w0 = d3.time.weekOfYear(t0),
d1 = t1.getDay(), w1 = d3.time.weekOfYear(t1);
return "M" + (w0 + 1) * cellSize + "," + d0 * cellSize
+ "H" + w0 * cellSize + "V" + 7 * cellSize
+ "H" + w1 * cellSize + "V" + (d1 + 1) * cellSize
+ "H" + (w1 + 1) * cellSize + "V" + 0
+ "H" + (w0 + 1) * cellSize + "Z";
}
// TOOLTIP
var tooltip = d3.select("body")
.append("div").attr("id", "tooltip")
.style("position", "absolute")
.style("z-index", "10")
.style("visibility", "hidden")
.text("a simple tooltip");
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment