Published
Edited
Jun 29, 2020
1 fork
1 star
chart = {
const svg = d3.create("svg")
.attr("viewBox", [0,0, width, 200])
.style("overflow", "visible")
// apply textures
var t1 = textures.lines()
.orientation("3/8", "7/8")
.stroke("darkorange");
svg.call(t1);
var t2 = textures.paths()
.d("waves")
.thicker()
.stroke("firebrick");
svg.call(t2);
svg.append("circle")
.attr("r", 40)
.attr("cx", 50)
.attr("cy", 50)
.style("fill", t1.url());
svg.append("circle")
.attr("r", 60)
.attr("cx", 120)
.attr("cy", 70)
.style("fill", t2.url());
return svg.node()
}
d3 = require("d3@5", "d3-array@2")
textures = require('https://bundle.run/textures@1.2.2')
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
