// makes spline path out of array of points [[x, y], [x, y], [x, y], ]
// second param tells if path should be closed or not
pointsToSplinePath = (points, closed) => {
if (closed) {
// add some extra points to make spline close nicely.
// we will remove these segments later
points.push(...points.slice(0, 3))
let bezierCortages = Spline.toPoints(points)
let splinePath = d3.path()
splinePath.moveTo(points[1][0], points[1][1])
bezierCortages.pop()
bezierCortages.pop()
bezierCortages.shift()
bezierCortages.forEach(bezierCortage => {
splinePath.bezierCurveTo(...bezierCortage)
})
return splinePath.toString()
}
else {
let bezierCortages = Spline.toPoints(points)
let splinePath = d3.path()
splinePath.moveTo(points[0][0], points[0][1])
// last bezier cortage is useless
bezierCortages.pop()
bezierCortages.forEach(bezierCortage => {
splinePath.bezierCurveTo(...bezierCortage)
})
return splinePath.toString()
}
// let iSart = 0
// let iEnd = bezierCortages.length - 1
if (closed) {
// add some extra points to make spline close nicely
}
}
distance = (p1, p2) => {
const [x1, y1] = p1
const [x2, y2] = p2
return Math.sqrt((x1 - x2) ** 2 + (y1 - y2) ** 2)
}
noise = require('simplex-noise@2.4.0')
colorScale = d3.interpolateCool
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.
