The avatar for @severo
Sylvain Lesage
Software engineer at Hugging Face. Prototyping here with JS, d3, three.js.
Published
Inputs
Edited
May 12, 2021
Fork of Intervals Timeline - SVG
Importers
1 star
Insert cell
Insert cell
Insert cell
viewof t1 = intervals()
Insert cell
t1
Insert cell
Insert cell
viewof t2.data
Insert cell
// Uncomment
//
// (viewof t2.data = [
// // { start: -1, end: 1 },
// // { start: 0, end: 2 },
// { start: 3, end: 6 }
// // { start: 2.5, end: 7 }
// ])
Insert cell
viewof t2 = {
const min = -2;
const max = 10;
const colorScale = d3
.scaleLinear()
.domain([min, max])
.range(["#a52a2a88", "#4682b488"])
.interpolate(d3.interpolateHcl);
return intervals({
value: 5.72,
min,
max,
step: 0.1,
width: 600,
zoomRange: [min, max],
zoomTranslateExtent: [-5, 11],
zoomScaleExtent: [1, 10000],
zoomDisabled: false,
data: [
//{ start: -1, end: 1 },
{ début: 0, end: 2 },
{ début: 1, end: 2 },
{ début: 3, end: 5 }
// { start: 2.5, end: 7 }
],
color: d => colorScale(d.début),
startof: d => d.début,
endof: d => d.end,
height: 12,
rectHeight: 8
});
}
Insert cell
t2
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell

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.
Learn more