Full-stack data visualizer.
That means I enjoy doing everything, from raw data to revealing & pretty interactive data visualizations.
randomLines = {
const svg = d3.select(DOM.svg(width, height))
.attr("fill", "none")
.attr("stroke", "black")
.attr("stroke-width", 0.5);
for (let i = 0; i < 50; ++i) {
yield svg.node();
svg.append("path")
.attr("d", line(dampenedRandomWalk()))
}
}
function dampenedRandomWalk() {
let target = 0.5 + (Math.random() - 0.5)
let value = Math.random();
let values = [value];
for (let i = 0; i < n; ++i) {
let dec = decay + (Math.random() - 0.5);
console.log(value)
values.push(value += (Math.random() - 0.5) * noise + (target - value) * dec);
}
return values;
}
function strokeNone() {
return `0 ${this.getTotalLength()}`;
}
function strokeIn() {
const l = this.getTotalLength();
return d3.interpolate(`0 ${l}`, `${l} 0`);
}
function strokeOut() {
const l = this.getTotalLength();
return d3.interpolate(`0 0 ${l}`, `0 ${l} 0`);
}
line = d3.line().x((d, i) => i / n * width).y(d => d * height).curve(d3.curveBasis)
n = 10
height = 830
width = 1440
d3 = require("d3@5")
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.
