A d3v4 boilerplate that is compatible with bl.ocks.org and utilizes the latest stable d3-workbench snapshot.
Size of preview.png
: 960x500
Size of thumbnail.png
: 230x120
d3v4: bl.ocks.org boilerplate with d3-workbench |
license: gpl-3.0 | |
height: 400 | |
border: no |
logfile | |
pidfile |
A d3v4 boilerplate that is compatible with bl.ocks.org and utilizes the latest stable d3-workbench snapshot.
Size of preview.png
: 960x500
Size of thumbnail.png
: 230x120
id | value | |
---|---|---|
1 | 2 |
<!doctype html> | |
<head> | |
<meta charset="utf-8"> | |
<base target="_blank"> | |
<!-- Alternative 1: Full distribution --> | |
<!-- <script src="https://bastitee.github.io/d3-workbench-ghp/0.9.0/d3-wb-distall.min.js"></script> --> | |
<!-- Alternative 2: Distribution subset with explicit dependencies --> | |
<script src="https://d3js.org/d3.v4.min.js"></script> | |
<script src="https://bastitee.github.io/d3-workbench-ghp/0.9.0/d3-wb.min.js"></script> | |
<script src="https://bastitee.github.io/d3-workbench-ghp/0.9.0/d3-wb-modules.min.js"></script> | |
</head> | |
<body id="standalone-body"> | |
<svg id="standalone-svg"></svg> | |
</body> | |
<script src="svg.js"></script> |
var cfg = d3wb.config() | |
.attr("margin", "50 50 50 50") | |
.attr("debug", true) // draw debug canvas | |
.data(["data.csv"]) | |
var cv = cfg.toCanvas() // converts config object to canvas object | |
d3.queue() // load-pattern for multiple datasets | |
.defer(d3.csv, cv.data[0]) | |
.await(function(error, data) { | |
// do something with the data.. | |
cv.selectAll("text") | |
.data(data).enter().append("text") | |
.text(function(d) { | |
return d["id"] + " != " + d["value"] | |
}) | |
.attr("text-anchor", "middle") | |
.attr("x", cv.wid / 2) | |
.attr("y", cv.margin.top + 10) | |
.attr("fill", d3wb.color.white) | |
}) |