Skip to content

Instantly share code, notes, and snippets.

@MNoichl

MNoichl/.block

Last active June 5, 2018 20:15
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 MNoichl/27913d1ff9fc4d366bcf63e26fc1eb6a to your computer and use it in GitHub Desktop.
Save MNoichl/27913d1ff9fc4d366bcf63e26fc1eb6a to your computer and use it in GitHub Desktop.
Download ZIP
Heatmap of philosophy clusters
Raw
.block
license: mit
Raw
README.md
Raw
data.tsv
day value hour
0 0 0
0 0.499360828808073 2
0 0.646171462386778 3
0 0.724537971482451 4
0 0.772915346313415 5
0 0.790597450604855 6
0 0.605258082408502 7
0 0.593994843379318 8
0 0.771302823531314 9
0 0.898414417801664 10
0 0.700507697192271 11
0 0.881279129608788 12
0 0.814885659133107 13
1 0.499360828808073 1
1 0 2
1 0.629250564718281 3
1 0.483979702863399 4
1 0.654017537365611 5
1 0.716134375153161 6
1 0.489573491886926 7
1 0.543687669746093 8
1 0.490339290418001 9
1 0.844450725810197 10
1 0.602767393044145 11
1 0.666763914460639 12
1 0.772632799560219 13
2 0.646171462386778 1
2 0.629250564718281 2
2 0 3
2 0.752089560063444 4
2 0.701066268308364 5
2 0.873034222976729 6
2 0.696382388454511 7
2 0.687659933186817 8
2 0.785982799492429 9
2 0.951744830846131 10
2 0.810798331425467 11
2 0.948790278602744 12
2 0.877139166869436 13
3 0.724537971482451 1
3 0.483979702863399 2
3 0.752089560063444 3
3 0 4
3 0.857787757488206 5
3 0.87161267863574 6
3 0.778681732947048 7
3 0.726511615833749 8
3 0.636753841464479 9
3 0.949265957685621 10
3 0.838461628002143 11
3 0.821271301196426 12
3 0.903085355136475 13
4 0.772915346313415 1
4 0.654017537365611 2
4 0.701066268308364 3
4 0.857787757488206 4
4 0 5
4 0.691913492115269 6
4 0.684803081088696 7
4 0.584001680861031 8
4 0.851330722840482 9
4 0.910213994679453 10
4 0.647466826043069 11
4 0.967768149042121 12
4 0.796292904486306 13
5 0.790597450604855 1
5 0.716134375153161 2
5 0.873034222976729 3
5 0.87161267863574 4
5 0.691913492115269 5
5 0 6
5 0.770609146311489 7
5 0.713571188000068 8
5 0.917268762957185 9
5 0.875317301858386 10
5 0.590161843097976 11
5 0.945591079994638 12
5 0.904540746864066 13
6 0.605258082408502 1
6 0.489573491886926 2
6 0.696382388454511 3
6 0.778681732947048 4
6 0.684803081088696 5
6 0.770609146311489 6
6 0 7
6 0.573847099749542 8
6 0.849852236803839 9
6 0.692409483963428 10
6 0.743941946001007 11
6 0.931052642353079 12
6 0.627253461895036 13
7 0.593994843379318 1
7 0.543687669746093 2
7 0.687659933186817 3
7 0.726511615833749 4
7 0.584001680861031 5
7 0.713571188000068 6
7 0.573847099749542 7
7 0 8
7 0.830837782142027 9
7 0.917170381203069 10
7 0.754288057094977 11
7 0.956768214556707 12
7 0.793644308874264 13
8 0.771302823531314 1
8 0.490339290418001 2
8 0.785982799492429 3
8 0.636753841464479 4
8 0.851330722840482 5
8 0.917268762957185 6
8 0.849852236803839 7
8 0.830837782142027 8
8 0 9
8 0.968259604544775 10
8 0.875220786601587 11
8 0.883975095852201 12
8 0.936706102546991 13
9 0.898414417801664 1
9 0.844450725810197 2
9 0.951744830846131 3
9 0.949265957685621 4
9 0.910213994679453 5
9 0.875317301858386 6
9 0.692409483963428 7
9 0.917170381203069 8
9 0.968259604544775 9
9 0 10
9 0.886354318248595 11
9 0.963336912689863 12
9 0.897770085188581 13
10 0.700507697192271 1
10 0.602767393044145 2
10 0.810798331425467 3
10 0.838461628002143 4
10 0.647466826043069 5
10 0.590161843097976 6
10 0.743941946001007 7
10 0.754288057094977 8
10 0.875220786601587 9
10 0.886354318248595 10
10 0 11
10 0.924929831981997 12
10 0.895363090812114 13
11 0.881279129608788 1
11 0.666763914460639 2
11 0.948790278602744 3
11 0.821271301196426 4
11 0.967768149042121 5
11 0.945591079994638 6
11 0.931052642353079 7
11 0.956768214556707 8
11 0.883975095852201 9
11 0.963336912689863 10
11 0.924929831981997 11
11 0 12
11 0.971220333741755 13
12 0.814885659133107 1
12 0.772632799560219 2
12 0.877139166869436 3
12 0.903085355136475 4
12 0.796292904486306 5
12 0.904540746864066 6
12 0.627253461895036 7
12 0.793644308874264 8
12 0.936706102546991 9
12 0.897770085188581 10
12 0.895363090812114 11
12 0.971220333741755 12
12 0 13
Raw
index.html
<!DOCTYPE html>
<link rel="stylesheet" type="text/css" href="https://npmcdn.com/d3.compose@0.15.13/dist/d3.compose.css">
<style>
.chart {width: 940px; height: 480px; margin: 10px; font-family: sans-serif;}
.chart-axis .domain, .chart-axis .tick line {visibility: hidden;}
.chart-axis .tick text {font-family: Consolas, courier; fill: #aaa, font-size: 10px;}
.chart-heatmap rect {stroke: #ffffff; stroke-width: 2px;}
</style>
<div id="heatmap" class="chart"></div>
<script src="https://d3js.org/d3.v3.min.js" charset="utf-8"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3.chart/0.2.1/d3.chart.min.js"></script>
<script src="https://npmcdn.com/d3.compose@0.15.13/dist/d3.compose-all.js"></script>
<script>
var helpers = d3c.helpers;
var di = helpers.di;
var mixins = d3c.mixins;
// Heatmap Chart
// -------------
var Mixed = helpers.mixin(d3c.Chart, mixins.XY, mixins.XYValues, mixins.StandardLayer);
Mixed.extend('Heatmap', {
initialize: function() {
Mixed.prototype.initialize.apply(this, arguments);
this.standardLayer('Heatmap', this.base.append('g').classed('chart-heatmap', true));
},
zScale: helpers.property(),
onDataBind: function(selection, data) {
return selection.selectAll('rect')
.data(data, function(d) { return d.x + '-' + d.y; });
},
onInsert: function(selection) {
return selection.append('rect')
.attr('rx', 4)
.attr('ry', 4);
},
onEnter: function(selection) {
selection
.attr('fill', '#fff');
},
onMerge: function(selection) {
selection
.attr('x', this.barX)
.attr('y', this.barY)
.attr('width', this.barWidth)
.attr('height', this.barHeight);
},
onMergeTransition: function(selection) {
selection
.attr('fill', this.barFill);
},
itemHeight: function() {
var scale = this.yScale();
if (scale && scale.width) {
return scale.width();
} else if (scale && scale.rangeBand) {
return scale.rangeBand() || 0;
} else {
return 0;
}
},
barX: di(function(chart, d, i, j) {
return chart.x.call(this, d, i, j) - (chart.itemWidth() / 2);
}),
barY: di(function(chart, d, i, j) {
return chart.y.call(this, d, i, j) - (chart.itemHeight() / 2);
}),
barWidth: di(function(chart, d, i, j) {
return chart.itemWidth();
}),
barHeight: di(function(chart, d, i, j) {
return chart.itemHeight();
}),
barFill: di(function(chart, d, i, j) {
return chart.zScale()(d.z);
})
});
// Create chart
// ------------
// (from http://bl.ocks.org/tjdecke/5558084)
var config = {
colors: ["#ffffd9","#edf8b1","#c7e9b4","#7fcdbb","#41b6c4","#1d91c0","#225ea8","#253494","#081d58"],
days: ['Logic','Pract & Polit Ph.','Ph. of Mind','Epistemology','Continental Ph.','Ph. of Physics','General Ph. - ?','Theory of Science','Ph. of Mathematics','Ph. of language, Linguistic','??','Metaphysics','Decision-Theory'],
times: ['Logic','Pract & Polit Ph.','Ph. of Mind','Epistemology','Continental Ph.','Ph. of Physics','General Ph. - ?','Theory of Science','Ph. of Mathematics','Ph. of language, Linguistic','??','Metaphysics','Decision-Theory'],
buckets: 8
};
var chart = d3.select('#heatmap').chart('Compose', function(data) {
var xScale = {type: 'ordinal', domain: config.times, padding: 0};
var yScale = {type: 'ordinal', domain: config.days.reverse(), padding: 0};
var zScale = d3.scale.quantile()
.domain([0, config.buckets - 1, d3.max(data, function(d) { return d.value; })])
.range(config.colors);
var charts = [
{type: 'Heatmap', id: 'heatmap', data: data, xScale: xScale, yScale: yScale, zScale: zScale}
];
var xAxis = d3c.axis({scale: xScale});
var yAxis = d3c.axis({scale: yScale});
return [
xAxis,
[yAxis, d3c.layered(charts)],
];
}).width(940).height(300);
// Draw chart
// ----------
d3.tsv('data.tsv', function(d) {
return {
hour: +d.hour,
day: +d.day,
value: +d.value,
x: config.times[+d.hour -1],
y: config.days[+d.day ],
z: +d.value
};
}, function(err, data) {
chart.draw(data);
});
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment