Full Stack Software Engineer at Alteryx in Boston, MA
{
let context = DOM.context2d(width, width);
context.canvas.width = width
context.canvas.height = width
const newTriangles = splitTriangles(triangles, ()=>0.5, 10)
newTriangles.forEach(t => drawTriangle(context, t, d3.interpolateRdYlGn(Math.random())))
return context.canvas;
}
{
let context = DOM.context2d(width, width);
context.canvas.width = width
context.canvas.height = width
const colors = [
"#845EC2",
"#D65DB1",
"#FF6F91",
"#FF9671",
"#FFC75F",
"#F9F871"
]
const newTriangles = splitTriangles(triangles, truncatedNormal, 10)
newTriangles.forEach(t => drawTriangle(context, t, colors[d3.randomInt(colors.length)()]))
return context.canvas;
}
function truncatedNormal() {
const r = d3.randomNormal(0.5, 0.05)()
if (r > 1) return 1
if (r < 0) return 0
return r
}
triangles = {
return [
[[0,0], [width,0], [0,width]],
[[0,width], [width,0], [width,width]]
]
}
function shift1(t) {
const d1 = Math.sqrt((t[0][0] - t[1][0])**2 + (t[0][1] - t[1][1])**2)
const d2 = Math.sqrt((t[0][0] - t[2][0])**2 + (t[0][1] - t[2][1])**2)
const d3 = Math.sqrt((t[1][0] - t[2][0])**2 + (t[1][1] - t[2][1])**2)
if ((d3 >= d2) && (d3 >= d1)) {
return t
} else if ((d2 >= d3) && (d2 >= d1)) {
return [t[2], t[1], t[0]]
} else {
return [t[2], t[1], t[0]]
}
}
shift1(triangles[0])
// width=500
height=width
a = [1,2,3]
a.slice(1).concat(a.slice(0,1))
d3.randomInt(3)()
d3 = require("d3@5", "d3-random@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.
