Skip to content

Instantly share code, notes, and snippets.

@d3noob

d3noob/.block

Created June 19, 2021 08:47
Show Gist options
  • Save d3noob/ae23f9f96c55187dadc9f9dd53d2e6ee to your computer and use it in GitHub Desktop.
Save d3noob/ae23f9f96c55187dadc9f9dd53d2e6ee to your computer and use it in GitHub Desktop.
Download ZIP
Simple Difference Chart v7
Raw
.block
license: mit
Raw
README.md
Raw
downloads.csv
date_entered downloaded book_name
2015-04-19 5481 R Programming for Data Science
2015-04-19 23751 The Elements of Data Analytic Style
2015-04-20 5691 R Programming for Data Science
2015-04-20 23782 The Elements of Data Analytic Style
2015-04-21 6379 R Programming for Data Science
2015-04-21 23820 The Elements of Data Analytic Style
2015-04-22 7281 R Programming for Data Science
2015-04-22 23857 The Elements of Data Analytic Style
2015-04-23 7554 R Programming for Data Science
2015-04-23 23881 The Elements of Data Analytic Style
2015-04-24 9331 R Programming for Data Science
2015-04-24 23932 The Elements of Data Analytic Style
2015-04-25 9614 R Programming for Data Science
2015-04-25 23961 The Elements of Data Analytic Style
2015-04-26 9785 R Programming for Data Science
2015-04-26 23978 The Elements of Data Analytic Style
2015-04-27 9951 R Programming for Data Science
2015-04-27 24001 The Elements of Data Analytic Style
2015-04-28 10087 R Programming for Data Science
2015-04-28 24018 The Elements of Data Analytic Style
2015-04-29 11039 R Programming for Data Science
2015-04-29 24061 The Elements of Data Analytic Style
2015-04-30 11906 R Programming for Data Science
2015-04-30 24102 The Elements of Data Analytic Style
2015-05-01 12210 R Programming for Data Science
2015-05-01 24130 The Elements of Data Analytic Style
2015-05-02 12424 R Programming for Data Science
2015-05-02 24148 The Elements of Data Analytic Style
2015-05-03 12588 R Programming for Data Science
2015-05-03 24160 The Elements of Data Analytic Style
2015-05-04 12903 R Programming for Data Science
2015-05-04 24181 The Elements of Data Analytic Style
2015-05-05 13198 R Programming for Data Science
2015-05-05 24229 The Elements of Data Analytic Style
2015-05-06 13445 R Programming for Data Science
2015-05-06 24260 The Elements of Data Analytic Style
2015-05-07 13646 R Programming for Data Science
2015-05-07 24508 The Elements of Data Analytic Style
2015-05-08 13853 R Programming for Data Science
2015-05-08 25220 The Elements of Data Analytic Style
2015-05-09 13967 R Programming for Data Science
2015-05-09 25327 The Elements of Data Analytic Style
2015-05-10 14084 R Programming for Data Science
2015-05-10 25408 The Elements of Data Analytic Style
2015-05-11 14216 R Programming for Data Science
2015-05-11 25475 The Elements of Data Analytic Style
2015-05-12 15302 R Programming for Data Science
2015-05-12 25560 The Elements of Data Analytic Style
2015-05-13 15674 R Programming for Data Science
2015-05-13 25602 The Elements of Data Analytic Style
2015-05-14 15995 R Programming for Data Science
2015-05-14 25648 The Elements of Data Analytic Style
2015-05-15 16209 R Programming for Data Science
2015-05-15 25681 The Elements of Data Analytic Style
2015-05-16 16388 R Programming for Data Science
2015-05-16 25714 The Elements of Data Analytic Style
2015-05-17 16527 R Programming for Data Science
2015-05-17 25737 The Elements of Data Analytic Style
2015-05-18 16705 R Programming for Data Science
2015-05-18 25759 The Elements of Data Analytic Style
2015-05-19 16856 R Programming for Data Science
2015-05-19 25777 The Elements of Data Analytic Style
2015-05-20 17006 R Programming for Data Science
2015-05-20 25803 The Elements of Data Analytic Style
2015-05-21 17124 R Programming for Data Science
2015-05-21 25821 The Elements of Data Analytic Style
2015-05-22 17253 R Programming for Data Science
2015-05-22 25836 The Elements of Data Analytic Style
2015-05-23 17341 R Programming for Data Science
2015-05-23 25850 The Elements of Data Analytic Style
2015-05-24 17424 R Programming for Data Science
2015-05-24 25865 The Elements of Data Analytic Style
2015-05-25 17522 R Programming for Data Science
2015-05-25 25884 The Elements of Data Analytic Style
2015-05-26 17643 R Programming for Data Science
2015-05-26 25901 The Elements of Data Analytic Style
2015-05-27 17791 R Programming for Data Science
2015-05-27 25911 The Elements of Data Analytic Style
2015-05-28 17948 R Programming for Data Science
2015-05-28 25927 The Elements of Data Analytic Style
2015-05-29 18071 R Programming for Data Science
2015-05-29 25934 The Elements of Data Analytic Style
2015-05-30 18192 R Programming for Data Science
2015-05-30 25944 The Elements of Data Analytic Style
2015-05-31 18299 R Programming for Data Science
2015-05-31 25951 The Elements of Data Analytic Style
2015-06-01 18541 R Programming for Data Science
2015-06-01 25966 The Elements of Data Analytic Style
2015-06-02 18838 R Programming for Data Science
2015-06-02 25982 The Elements of Data Analytic Style
2015-06-03 19032 R Programming for Data Science
2015-06-03 25984 The Elements of Data Analytic Style
2015-06-04 19157 R Programming for Data Science
2015-06-04 25995 The Elements of Data Analytic Style
2015-06-05 19302 R Programming for Data Science
2015-06-05 26006 The Elements of Data Analytic Style
2015-06-06 19399 R Programming for Data Science
2015-06-06 26019 The Elements of Data Analytic Style
2015-06-07 19497 R Programming for Data Science
2015-06-07 26028 The Elements of Data Analytic Style
2015-06-08 19602 R Programming for Data Science
2015-06-08 26042 The Elements of Data Analytic Style
2015-06-09 20445 R Programming for Data Science
2015-06-09 26715 The Elements of Data Analytic Style
2015-06-10 20773 R Programming for Data Science
2015-06-10 26902 The Elements of Data Analytic Style
2015-06-11 21005 R Programming for Data Science
2015-06-11 26984 The Elements of Data Analytic Style
2015-06-12 21185 R Programming for Data Science
2015-06-12 27019 The Elements of Data Analytic Style
2015-06-13 21331 R Programming for Data Science
2015-06-13 27045 The Elements of Data Analytic Style
2015-06-14 21462 R Programming for Data Science
2015-06-14 27078 The Elements of Data Analytic Style
2015-06-15 21609 R Programming for Data Science
2015-06-15 27103 The Elements of Data Analytic Style
2015-06-16 21751 R Programming for Data Science
2015-06-16 27137 The Elements of Data Analytic Style
2015-06-17 21904 R Programming for Data Science
2015-06-17 27157 The Elements of Data Analytic Style
2015-06-18 22083 R Programming for Data Science
2015-06-18 27190 The Elements of Data Analytic Style
2015-06-19 22244 R Programming for Data Science
2015-06-19 27213 The Elements of Data Analytic Style
2015-06-20 22349 R Programming for Data Science
2015-06-20 27227 The Elements of Data Analytic Style
2015-06-21 22447 R Programming for Data Science
2015-06-21 27239 The Elements of Data Analytic Style
2015-06-22 22557 R Programming for Data Science
2015-06-22 27254 The Elements of Data Analytic Style
2015-06-23 22699 R Programming for Data Science
2015-06-23 28492 The Elements of Data Analytic Style
2015-06-24 22836 R Programming for Data Science
2015-06-24 28907 The Elements of Data Analytic Style
2015-06-25 22955 R Programming for Data Science
2015-06-25 29153 The Elements of Data Analytic Style
2015-06-26 23061 R Programming for Data Science
2015-06-26 29316 The Elements of Data Analytic Style
2015-06-27 23283 R Programming for Data Science
2015-06-27 29546 The Elements of Data Analytic Style
2015-06-28 23500 R Programming for Data Science
2015-06-28 29753 The Elements of Data Analytic Style
2015-06-29 23755 R Programming for Data Science
2015-06-29 30044 The Elements of Data Analytic Style
2015-06-30 24034 R Programming for Data Science
2015-06-30 30232 The Elements of Data Analytic Style
2015-07-01 24238 R Programming for Data Science
2015-07-01 30377 The Elements of Data Analytic Style
2015-07-02 24408 R Programming for Data Science
2015-07-02 30464 The Elements of Data Analytic Style
2015-07-03 24572 R Programming for Data Science
2015-07-03 30527 The Elements of Data Analytic Style
2015-07-04 24708 R Programming for Data Science
2015-07-04 30584 The Elements of Data Analytic Style
2015-07-05 24849 R Programming for Data Science
2015-07-05 30625 The Elements of Data Analytic Style
2015-07-06 25102 R Programming for Data Science
2015-07-06 30694 The Elements of Data Analytic Style
2015-07-07 25429 R Programming for Data Science
2015-07-07 30748 The Elements of Data Analytic Style
2015-07-08 25685 R Programming for Data Science
2015-07-08 30891 The Elements of Data Analytic Style
2015-07-09 25874 R Programming for Data Science
2015-07-09 31245 The Elements of Data Analytic Style
2015-07-10 26589 R Programming for Data Science
2015-07-10 31377 The Elements of Data Analytic Style
2015-07-11 26983 R Programming for Data Science
2015-07-11 31468 The Elements of Data Analytic Style
2015-07-12 27258 R Programming for Data Science
2015-07-12 31563 The Elements of Data Analytic Style
2015-07-13 27602 R Programming for Data Science
2015-07-13 31632 The Elements of Data Analytic Style
2015-07-14 27835 R Programming for Data Science
2015-07-14 31703 The Elements of Data Analytic Style
2015-07-15 28068 R Programming for Data Science
2015-07-15 31776 The Elements of Data Analytic Style
2015-07-16 28395 R Programming for Data Science
2015-07-16 31874 The Elements of Data Analytic Style
2015-07-17 28601 R Programming for Data Science
2015-07-17 31924 The Elements of Data Analytic Style
2015-07-18 28734 R Programming for Data Science
2015-07-18 31968 The Elements of Data Analytic Style
2015-07-19 28857 R Programming for Data Science
2015-07-19 31995 The Elements of Data Analytic Style
2015-07-20 29017 R Programming for Data Science
2015-07-20 32031 The Elements of Data Analytic Style
2015-07-21 29213 R Programming for Data Science
2015-07-21 32070 The Elements of Data Analytic Style
2015-07-22 29415 R Programming for Data Science
2015-07-22 32109 The Elements of Data Analytic Style
2015-07-23 29493 R Programming for Data Science
2015-07-23 32127 The Elements of Data Analytic Style
Raw
index.html
<!DOCTYPE html>
<meta charset="utf-8">
<style>
body { font: 10px sans-serif;}
text.shadow {
stroke: white;
stroke-width: 2px;
opacity: 0.9;
}
.axis path,
.axis line {
fill: none;
stroke: #000;
shape-rendering: crispEdges;
}
.x.axis path { display: none; }
.area.above { fill: rgb(252,141,89); }
.area.below { fill: rgb(145,207,96); }
.line {
fill: none;
stroke: #000;
stroke-width: 1.5px;
}
</style>
<body>
<script src="https://d3js.org/d3.v7.min.js"></script>
<script>
var title = "Science vs Style - Daily Leanpub Book Sales";
var margin = {top: 20, right: 20, bottom: 50, left: 50},
width = 960 - margin.left - margin.right,
height = 500 - margin.top - margin.bottom;
var parsedtg = d3.timeParse("%Y-%m-%d");
var x = d3.scaleTime().range([0, width]);
var y = d3.scaleLinear().range([height, 0]);
var xAxis = d3.axisBottom().scale(x);
var yAxis = d3.axisLeft().scale(y);
var lineScience = d3.area()
.curve(d3.curveBasis)
.x(function(d) { return x(d.dtg); })
.y(function(d) { return y(d["Science"]); });
var lineStyle = d3.area()
.curve(d3.curveBasis)
.x(function(d) { return x(d.dtg); })
.y(function(d) { return y(d["Style"]); });
var area = d3.area()
.curve(d3.curveBasis)
.x(function(d) { return x(d.dtg); })
.y1(function(d) { return y(d["Science"]); });
var svg = d3.select("body").append("svg")
.attr("width", width + margin.left + margin.right)
.attr("height", height + margin.top + margin.bottom)
.append("g")
.attr("transform",
"translate(" + margin.left + "," + margin.top + ")");
d3.csv("downloads.csv").then(function(dataNest) {
dataNest.forEach(function(d) {
d.dtg = parsedtg(d.date_entered);
d.downloaded = +d.downloaded;
});
var data = Array.from(
d3.group(dataNest, d => d.date_entered),
([key, value]) => ({key, value})
);
data.forEach(function(d) {
d.dtg = d.value[0]['dtg'];
d["Science"] = d.value[0]['downloaded'];
d["Style"] = d.value[1]['downloaded'];
});
for(i=data.length-1;i>0;i--) {
data[i].Science = data[i].Science -data[(i-1)].Science ;
data[i].Style = data[i].Style -data[(i-1)].Style ;
}
data.shift(); // Removes the first element in the array
x.domain(d3.extent(data, function(d) { return d.dtg; }));
y.domain([
// d3.min(data, function(d) {
// return Math.min(d["Science"], d["Style"]); }),
// d3.max(data, function(d) {
// return Math.max(d["Science"], d["Style"]); })
0,1400
]);
svg.datum(data);
svg.append("clipPath")
.attr("id", "clip-above")
.append("path")
.attr("d", area.y0(0));
svg.append("clipPath")
.attr("id", "clip-below")
.append("path")
.attr("d", area.y0(height));
svg.append("path")
.attr("class", "area above")
.attr("clip-path", "url(#clip-above)")
.attr("d", area.y0(function(d) { return y(d["Style"]); }));
svg.append("path")
.attr("class", "area below")
.attr("clip-path", "url(#clip-below)")
.attr("d", area.y0(function(d) { return y(d["Style"]); }));
svg.append("path")
.attr("class", "line")
.style("stroke", "darkgreen")
.attr("d", lineScience);
svg.append("path")
.attr("class", "line")
.style("stroke", "red")
.attr("d", lineStyle);
svg.append("g")
.attr("class", "x axis")
.attr("transform", "translate(0," + height + ")")
.call(xAxis);
svg.append("g")
.attr("class", "y axis")
.call(yAxis);
});
</script>
</body>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment