Published
Edited
Dec 29, 2020
Importers
md`# Vislog`
function makeLog(width=700, height=128) {
//d3 view
let e = html`<svg width="${width}" height="${height}" fill="none" stroke="black"></svg>`
let x = 0
let y = 0
function add(node){
let c = node.cloneNode(true)
c.setAttribute('x',x*100)
c.setAttribute('y',y*100)
c.setAttribute('width',100)
e.appendChild(c)
x++
if(width<x*100) this.newLine()
}
function newline(){
y++
if(y>4) e.attr('height',y*100)
x = 0
}
//DOM view
return Object.assign(e, {log:add, newLine:newline})
}
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.
