Software engineer at Hugging Face. Prototyping here with JS, d3, three.js.
layerStack = new LayerStack()
{
const stringsLayerStack = new LayerStack({
validate: el => el instanceof HTMLImageElement
});
try {
// We try to insert a string: it fails
stringsLayerStack.insertAboveAll('a string');
} catch (e) {
return e.message;
}
}
layerStack.length
[...layerStack]
colorsStack = LayerStack.from([
'blue',
'green',
'red',
'green',
'green',
'brown'
])
colorsStackClone = LayerStack.from(colorsStack)
[...colorsStack]
{
const clone = LayerStack.from(colorsStack);
clone.insertAboveAll('gray');
return [...clone];
}
{
const clone = LayerStack.from(colorsStack);
clone.insertBelowAll('lightgray');
return [...clone];
}
{
const clone = LayerStack.from(colorsStack);
clone.insertAbove('darkred', 'red');
clone.insertBelow('lightred', 'red');
return [...clone];
}
{
const clone = LayerStack.from(colorsStack);
clone.remove('green');
return [...clone];
}
{
const clone = LayerStack.from(colorsStack);
clone.replace('green', 'darkgreen');
return [...clone];
}
{
const clone = LayerStack.from(colorsStack);
clone.raiseOne('blue');
clone.raiseOne('blue');
clone.lowerOne('red');
return [...clone];
}
{
const events = [];
const clone = LayerStack.from(colorsStack);
const appendEvent = e => events.push(e.type);
clone.addEventListener('insert', appendEvent);
clone.addEventListener('remove', appendEvent);
clone.addEventListener('replace', appendEvent);
clone.addEventListener('reorder', appendEvent);
invalidation.then(() => {
clone.removeEventListener('insert', appendEvent);
clone.removeEventListener('remove', appendEvent);
clone.removeEventListener('replace', appendEvent);
clone.removeEventListener('reorder', appendEvent);
});
clone.remove('blue');
clone.insertBelowAll('pink');
clone.raiseOne('pink');
clone.replace('green', 'darkgreen');
clone.lowerOne('pink');
return events;
}
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.
