Skip to content

Instantly share code, notes, and snippets.

@floofydugong

floofydugong/.block

Last active October 19, 2016 16:56
Show Gist options
  • Save floofydugong/b4397a66748674b347fe9d2c71f72284 to your computer and use it in GitHub Desktop.
Save floofydugong/b4397a66748674b347fe9d2c71f72284 to your computer and use it in GitHub Desktop.
Download ZIP
Multi-Series Line Chart
Raw
.block
license: gpl-3.0
Raw
README.md

This line chart is constructed from a TSV file storing the Emoji and Chat counts for the following DOTA 2 previously Recorded Broadcast

forked from mbostock's block: Multi-Series Line Chart

Raw
index.html
<!DOCTYPE html>
<meta charset="utf-8">
<style>
.axis--x path {
display: none;
}
.line {
fill: none;
stroke: steelblue;
stroke-width: 1.5px;
}
</style>
<svg width="960" height="500"></svg>
<script src="//d3js.org/d3.v4.min.js"></script>
<script>
var svg = d3.select("svg"),
margin = {top: 20, right: 80, bottom: 30, left: 50},
width = svg.attr("width") - margin.left - margin.right,
height = svg.attr("height") - margin.top - margin.bottom,
g = svg.append("g").attr("transform", "translate(" + margin.left + "," + margin.top + ")");
var parseTime = d3.timeParse("%H:%M:%S");
var x = d3.scaleTime().range([0, width]),
y = d3.scaleLinear().range([height, 0]),
z = d3.scaleOrdinal(d3.schemeCategory10);
var line = d3.line()
.curve(d3.curveBasis)
.x(function(d) { return x(d.date); })
.y(function(d) { return y(d.Count); });
d3.tsv("twitch_data.tsv", type, function(error, data) {
if (error) throw error;
var cities = data.columns.slice(1).map(function(id) {
return {
id: id,
values: data.map(function(d) {
return {date: d.date, Count: d[id]};
})
};
});
x.domain(d3.extent(data, function(d) { return d.date; }));
y.domain([
d3.min(cities, function(c) { return d3.min(c.values, function(d) { return d.Count; }); }),
d3.max(cities, function(c) { return d3.max(c.values, function(d) { return d.Count; }); })
]);
z.domain(cities.map(function(c) { return c.id; }));
g.append("g")
.attr("class", "axis axis--x")
.attr("transform", "translate(0," + height + ")")
.call(d3.axisBottom(x));
g.append("g")
.attr("class", "axis axis--y")
.call(d3.axisLeft(y))
.append("text")
.attr("transform", "rotate(-90)")
.attr("y", 6)
.attr("dy", "0.71em")
.attr("fill", "#000")
.text("Count");
var city = g.selectAll(".city")
.data(cities)
.enter().append("g")
.attr("class", "city");
city.append("path")
.attr("class", "line")
.attr("d", function(d) { return line(d.values); })
.style("stroke", function(d) { return z(d.id); });
city.append("text")
.datum(function(d) { return {id: d.id, value: d.values[d.values.length - 1]}; })
.attr("transform", function(d) { return "translate(" + x(d.value.date) + "," + y(d.value.Count) + ")"; })
.attr("x", 3)
.attr("dy", "0.35em")
.style("font", "10px sans-serif")
.text(function(d) { return d.id; });
});
function type(d, _, columns) {
d.date = parseTime(d.date);
for (var i = 1, n = columns.length, c; i < n; ++i) d[c = columns[i]] = +d[c];
return d;
}
</script>
Raw
twitch_data.tsv
date Comment_Count Emoji_Count
10:10:01 32 11.0
10:10:02 33 10.0
10:10:04 25 11.0
10:10:05 21 10.0
10:10:07 14 9.0
10:10:08 31 15.0
10:10:10 19 15.0
10:10:11 24 14.0
10:10:13 22 14.0
10:10:14 31 19.0
10:10:16 28 18.0
10:10:17 43 26.0
10:10:19 25 18.0
10:10:20 28 15.0
10:10:22 17 8.0
10:10:23 28 14.0
10:10:25 23 12.0
10:10:26 31 12.0
10:10:28 13 5.0
10:10:29 40 14.0
10:10:30 18 9.0
10:10:32 15 4.0
10:10:33 18 2.0
10:10:35 31 8.0
10:10:36 26 4.0
10:10:38 26 6.0
10:10:39 28 5.0
10:10:41 22 5.0
10:10:42 26 2.0
10:10:44 37 6.0
10:10:45 41 5.0
10:10:47 22 1.0
10:10:48 27 2.0
10:10:50 14 1.0
10:10:51 24 4.0
10:10:53 12 2.0
10:10:54 36 8.0
10:10:55 19 3.0
10:10:57 23 6.0
10:10:58 33 7.0
10:11:00 29 10.0
10:11:01 22 6.0
10:11:03 26 5.0
10:11:04 23 6.0
10:11:06 20 6.0
10:11:07 22 3.0
10:11:09 17 5.0
10:11:10 33 5.0
10:11:12 22 6.0
10:11:13 22 7.0
10:11:15 25 8.0
10:11:16 33 11.0
10:11:18 14 1.0
10:11:19 28 7.0
10:11:21 15 5.0
10:11:22 25 4.0
10:11:24 16 3.0
10:11:25 29 5.0
10:11:27 7 0.0
10:11:28 28 2.0
10:11:30 4 2.0
10:11:31 28 6.0
10:11:32 14 3.0
10:11:33 4 1.0
10:11:34 27 1.0
10:11:35 12 3.0
10:11:36 3 0.0
10:11:37 17 4.0
10:11:38 22 3.0
10:11:39 8 2.0
10:11:40 10 2.0
10:11:41 16 2.0
10:11:42 12 0.0
10:11:43 5 2.0
10:11:44 22 3.0
10:11:45 18 6.0
10:11:46 7 2.0
10:11:47 23 3.0
10:11:48 14 1.0
10:11:49 9 1.0
10:11:50 24 1.0
10:11:51 23 2.0
10:11:53 11 0.0
10:11:54 23 1.0
10:11:56 9 0.0
10:11:57 30 3.0
10:11:58 16 0.0
10:12:00 11 2.0
10:12:01 37 3.0
10:12:02 18 1.0
10:12:04 21 2.0
10:12:05 22 4.0
10:12:07 21 6.0
10:12:08 31 7.0
10:12:10 59 8.0
10:12:11 86 9.0
10:12:13 102 5.0
10:12:14 108 4.0
10:12:16 87 7.0
10:12:17 112 5.0
10:12:18 1 0.0
10:12:19 78 3.0
10:12:20 74 3.0
10:12:22 59 2.0
10:12:23 60 2.0
10:12:25 36 0.0
10:12:26 58 1.0
10:12:28 40 3.0
10:12:29 51 1.0
10:12:31 35 4.0
10:12:32 41 5.0
10:12:34 33 4.0
10:12:35 45 6.0
10:12:37 29 2.0
10:12:38 48 2.0
10:12:40 32 3.0
10:12:41 55 3.0
10:12:43 31 0.0
10:12:44 27 0.0
10:12:46 20 0.0
10:12:47 37 0.0
10:12:49 17 1.0
10:12:50 37 3.0
10:12:52 19 0.0
10:12:53 37 3.0
10:12:55 12 2.0
10:12:56 32 8.0
10:12:58 11 4.0
10:12:59 38 11.0
10:13:01 12 3.0
10:13:02 40 13.0
10:13:04 8 1.0
10:13:05 44 7.0
10:13:06 17 4.0
10:13:08 13 0.0
10:13:09 21 3.0
10:13:11 20 3.0
10:13:12 22 6.0
10:13:14 22 4.0
10:13:15 29 10.0
10:13:17 21 4.0
10:13:18 33 3.0
10:13:20 20 5.0
10:13:21 33 11.0
10:13:23 30 11.0
10:13:24 34 11.0
10:13:26 41 11.0
10:13:27 39 16.0
10:13:29 27 6.0
10:13:30 41 12.0
10:13:32 35 14.0
10:13:33 41 20.0
10:13:35 25 8.0
10:13:36 25 6.0
10:13:38 20 11.0
10:13:39 26 7.0
10:13:41 23 6.0
10:13:42 32 2.0
10:13:44 35 2.0
10:13:45 52 2.0
10:13:47 39 3.0
10:13:48 56 3.0
10:13:50 32 1.0
10:13:51 54 1.0
10:13:53 32 2.0
10:13:54 44 0.0
10:13:56 37 6.0
10:13:57 42 4.0
10:13:59 31 5.0
10:14:00 37 7.0
10:14:02 31 1.0
10:14:03 44 5.0
10:14:05 37 5.0
10:14:06 52 5.0
10:14:07 1 0.0
10:14:08 17 1.0
10:14:09 40 4.0
10:14:11 17 3.0
10:14:12 27 4.0
10:14:14 23 7.0
10:14:15 38 8.0
10:14:17 16 5.0
10:14:18 33 7.0
10:14:20 17 5.0
10:14:21 39 8.0
10:14:23 10 1.0
10:14:24 25 4.0
10:14:26 13 5.0
10:14:27 33 8.0
10:14:29 9 2.0
10:14:30 24 6.0
10:14:32 10 0.0
10:14:33 26 4.0
10:14:35 15 2.0
10:14:36 35 6.0
10:14:38 7 0.0
10:14:39 33 10.0
10:14:41 15 2.0
10:14:42 32 4.0
10:14:44 12 1.0
10:14:45 30 5.0
10:14:47 2 0.0
10:14:48 30 5.0
10:14:50 4 0.0
10:14:51 34 2.0
10:14:53 6 0.0
10:14:54 34 9.0
10:14:56 4 0.0
10:14:57 42 7.0
10:14:58 19 7.0
10:15:00 26 11.0
10:15:01 25 13.0
10:15:03 41 22.0
10:15:04 37 27.0
10:15:06 38 23.0
10:15:07 55 28.0
10:15:09 49 36.0
10:15:10 45 26.0
10:15:12 53 32.0
10:15:13 38 20.0
10:15:15 31 19.0
10:15:16 43 21.0
10:15:18 37 18.0
10:15:19 33 19.0
10:15:21 33 17.0
10:15:22 39 21.0
10:15:24 23 8.0
10:15:25 32 18.0
10:15:27 24 13.0
10:15:28 29 9.0
10:15:30 18 8.0
10:15:31 39 8.0
10:15:33 27 7.0
10:15:34 34 10.0
10:15:36 19 5.0
10:15:37 27 12.0
10:15:39 10 1.0
10:15:40 24 11.0
10:15:42 7 1.0
10:15:43 29 8.0
10:15:45 5 0.0
10:15:46 34 9.0
10:15:47 20 4.0
10:15:49 14 1.0
10:15:50 38 7.0
10:15:51 16 4.0
10:15:53 20 7.0
10:15:54 15 4.0
10:15:56 19 1.0
10:15:57 19 6.0
10:15:59 17 1.0
10:16:00 17 1.0
10:16:02 11 2.0
10:16:03 33 3.0
10:16:04 18 3.0
10:16:06 12 3.0
10:16:07 44 4.0
10:16:08 18 1.0
10:16:10 18 3.0
10:16:11 23 3.0
10:16:13 21 0.0
10:16:14 25 4.0
10:16:16 15 0.0
10:16:17 19 2.0
10:16:19 18 3.0
10:16:20 33 1.0
10:16:21 23 6.0
10:16:23 30 1.0
10:16:24 17 2.0
10:16:26 17 3.0
10:16:27 16 2.0
10:16:29 20 0.0
10:16:30 18 2.0
10:16:32 11 1.0
10:16:33 24 4.0
10:16:35 15 1.0
10:16:36 20 1.0
10:16:38 15 1.0
10:16:39 24 5.0
10:16:41 15 1.0
10:16:42 40 5.0
10:16:43 19 2.0
10:16:45 17 4.0
10:16:46 33 6.0
10:16:47 15 3.0
10:16:49 17 4.0
10:16:50 24 6.0
10:16:51 13 5.0
10:16:52 12 3.0
10:16:53 23 7.0
10:16:54 14 5.0
10:16:55 14 2.0
10:16:56 25 5.0
10:16:57 14 2.0
10:16:58 9 2.0
10:16:59 32 9.0
10:17:00 19 4.0
10:17:02 13 1.0
10:17:03 19 2.0
10:17:05 8 1.0
10:17:06 37 2.0
10:17:07 18 2.0
10:17:09 15 2.0
10:17:10 18 4.0
10:17:12 11 0.0
10:17:13 21 3.0
10:17:15 16 2.0
10:17:16 19 2.0
10:17:18 7 0.0
10:17:19 39 8.0
10:17:20 14 2.0
10:17:22 19 3.0
10:17:23 15 3.0
10:17:25 19 2.0
10:17:26 16 1.0
10:17:28 17 2.0
10:17:29 14 3.0
10:17:31 17 1.0
10:17:32 30 5.0
10:17:33 26 5.0
10:17:35 18 2.0
10:17:36 15 3.0
10:17:38 10 0.0
10:17:39 25 7.0
10:17:41 15 4.0
10:17:42 18 1.0
10:17:44 18 5.0
10:17:45 14 3.0
10:17:47 13 3.0
10:17:48 19 6.0
10:17:50 13 1.0
10:17:51 30 8.0
10:17:52 14 3.0
10:17:53 11 2.0
10:17:54 29 10.0
10:17:55 19 6.0
10:17:57 16 3.0
10:17:58 16 2.0
10:18:00 11 4.0
10:18:01 30 8.0
10:18:02 14 5.0
10:18:03 6 1.0
10:18:04 29 7.0
10:18:05 13 4.0
10:18:06 10 4.0
10:18:07 29 6.0
10:18:08 16 5.0
10:18:09 13 1.0
10:18:10 24 4.0
10:18:12 6 2.0
10:18:13 25 6.0
10:18:14 16 4.0
10:18:15 1 1.0
10:18:16 22 4.0
10:18:17 21 4.0
10:18:19 8 1.0
10:18:20 24 4.0
10:18:21 16 3.0
10:18:22 12 1.0
10:18:23 24 5.0
10:18:24 11 1.0
10:18:25 9 2.0
10:18:26 23 4.0
10:18:27 15 3.0
10:18:28 9 2.0
10:18:29 25 3.0
10:18:30 13 0.0
10:18:31 7 1.0
10:18:32 38 7.0
10:18:33 20 3.0
10:18:35 13 1.0
10:18:36 19 1.0
10:18:38 17 3.0
10:18:39 17 3.0
10:18:41 11 1.0
10:18:42 22 7.0
10:18:44 11 1.0
10:18:45 27 8.0
10:18:46 24 6.0
10:18:48 16 4.0
10:18:49 19 6.0
10:18:51 15 6.0
10:18:52 20 7.0
10:18:54 16 4.0
10:18:55 28 9.0
10:18:57 19 8.0
10:18:58 31 9.0
10:19:00 13 2.0
10:19:01 27 4.0
10:19:03 8 1.0
10:19:04 24 5.0
10:19:05 16 1.0
10:19:06 2 0.0
10:19:07 27 4.0
10:19:08 15 4.0
10:19:09 2 1.0
10:19:10 33 2.0
10:19:11 10 2.0
10:19:12 4 1.0
10:19:13 36 3.0
10:19:14 18 4.0
10:19:16 18 0.0
10:19:17 23 1.0
10:19:19 25 5.0
10:19:20 30 6.0
10:19:22 14 2.0
10:19:23 17 2.0
10:19:25 15 2.0
10:19:26 17 5.0
10:19:28 13 4.0
10:19:29 28 9.0
10:19:30 15 4.0
10:19:31 6 1.0
10:19:32 36 11.0
10:19:33 18 2.0
10:19:34 7 1.0
10:19:35 35 9.0
10:19:36 17 0.0
10:19:38 14 1.0
10:19:39 39 4.0
10:19:40 21 3.0
10:19:42 23 1.0
10:19:43 40 7.0
10:19:45 26 4.0
10:19:46 26 4.0
10:19:48 30 8.0
10:19:49 33 7.0
10:19:51 29 11.0
10:19:52 35 6.0
10:19:54 32 8.0
10:19:55 20 5.0
10:19:57 26 5.0
10:19:58 42 7.0
10:20:00 23 11.0
10:20:01 31 5.0
10:20:03 30 9.0
10:20:04 26 6.0
10:20:06 21 5.0
10:20:07 39 8.0
10:20:09 18 3.0
10:20:10 30 8.0
10:20:12 17 1.0
10:20:13 25 7.0
10:20:15 13 4.0
10:20:16 25 4.0
10:20:18 15 5.0
10:20:19 24 6.0
10:20:21 14 2.0
10:20:22 29 3.0
10:20:23 20 2.0
10:20:25 17 3.0
10:20:26 27 3.0
10:20:28 17 5.0
10:20:29 16 6.0
10:20:31 28 7.0
10:20:32 23 5.0
10:20:34 38 17.0
10:20:35 41 16.0
10:20:37 15 6.0
10:20:38 22 7.0
10:20:40 20 4.0
10:20:41 25 2.0
10:20:43 22 7.0
10:20:44 17 3.0
10:20:46 14 4.0
10:20:47 36 5.0
10:20:48 18 2.0
10:20:50 13 2.0
10:20:51 30 4.0
10:20:52 17 4.0
10:20:53 16 4.0
10:20:54 25 4.0
10:20:55 12 3.0
10:20:56 10 2.0
10:20:57 31 4.0
10:20:58 23 4.0
10:21:00 15 3.0
10:21:01 18 1.0
10:21:02 20 3.0
10:21:03 12 3.0
10:21:04 24 6.0
10:21:05 26 5.0
10:21:07 21 4.0
10:21:08 18 8.0
10:21:10 18 7.0
10:21:11 20 4.0
10:21:13 14 5.0
10:21:14 30 10.0
10:21:15 18 9.0
10:21:17 17 4.0
10:21:18 19 4.0
10:21:19 22 6.0
10:21:20 16 4.0
10:21:21 18 4.0
10:21:23 11 4.0
10:21:24 35 9.0
10:21:25 18 3.0
10:21:27 15 3.0
10:21:28 21 2.0
10:21:30 17 6.0
10:21:31 18 5.0
10:21:33 23 8.0
10:21:34 31 12.0
10:21:36 42 16.0
10:21:37 54 23.0
10:21:39 58 29.0
10:21:40 77 37.0
10:21:42 40 20.0
10:21:43 74 35.0
10:21:45 40 19.0
10:21:46 56 22.0
10:21:48 35 20.0
10:21:49 56 21.0
10:21:51 18 8.0
10:21:52 47 21.0
10:21:54 22 8.0
10:21:55 30 9.0
10:21:57 14 4.0
10:21:58 39 9.0
10:22:00 12 4.0
10:22:01 23 6.0
10:22:03 16 4.0
10:22:04 30 6.0
10:22:05 1 0.0
10:22:06 17 5.0
10:22:07 29 6.0
10:22:09 6 3.0
10:22:10 39 7.0
10:22:11 26 8.0
10:22:13 12 3.0
10:22:14 22 5.0
10:22:16 25 3.0
10:22:17 13 2.0
10:22:19 12 4.0
10:22:20 29 7.0
10:22:21 16 2.0
10:22:22 7 0.0
10:22:23 18 3.0
10:22:24 11 2.0
10:22:25 17 0.0
10:22:26 26 6.0
10:22:27 13 0.0
10:22:28 10 1.0
10:22:29 33 1.0
10:22:30 19 4.0
10:22:32 18 3.0
10:22:33 23 1.0
10:22:35 13 0.0
10:22:36 37 2.0
10:22:37 20 1.0
10:22:39 15 1.0
10:22:40 19 3.0
10:22:41 18 1.0
10:22:42 12 1.0
10:22:43 14 1.0
10:22:44 11 1.0
10:22:45 7 0.0
10:22:46 22 2.0
10:22:47 17 2.0
10:22:48 8 1.0
10:22:49 21 5.0
10:22:50 21 4.0
10:22:51 5 1.0
10:22:52 27 4.0
10:22:53 11 0.0
10:22:54 1 0.0
10:22:55 19 5.0
10:22:56 18 2.0
10:22:57 13 3.0
10:22:58 12 1.0
10:22:59 18 4.0
10:23:00 8 1.0
10:23:01 4 1.0
10:23:02 11 1.0
10:23:03 19 3.0
10:23:04 10 4.0
10:23:05 9 5.0
10:23:06 29 16.0
10:23:07 13 7.0
10:23:08 4 4.0
10:23:09 53 42.0
10:23:10 26 21.0
10:23:12 17 12.0
10:23:13 25 18.0
10:23:15 18 11.0
10:23:16 20 14.0
10:23:18 14 7.0
10:23:19 34 22.0
10:23:20 16 9.0
10:23:22 14 9.0
10:23:23 31 20.0
10:23:24 11 2.0
10:23:25 12 3.0
10:23:26 33 13.0
10:23:27 18 8.0
10:23:29 20 8.0
10:23:30 31 16.0
10:23:32 15 4.0
10:23:33 26 11.0
10:23:35 12 4.0
10:23:36 29 13.0
10:23:37 14 7.0
10:23:38 18 6.0
10:23:39 21 6.0
10:23:41 19 6.0
10:23:42 18 8.0
10:23:44 10 3.0
10:23:45 32 10.0
10:23:46 17 5.0
10:23:48 12 3.0
10:23:49 40 11.0
10:23:50 15 1.0
10:23:52 25 8.0
10:23:53 22 2.0
10:23:55 16 8.0
10:23:56 17 5.0
10:23:58 22 5.0
10:23:59 21 5.0
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment