Published
Edited
Nov 15, 2019
Importers
Insert cell
md`# Everyday Tableware Demo Data`
Insert cell
items = ['皿', '丼', '汁椀', 'カップ']
Insert cell
colors = ['白', '黒', '赤', '青']
Insert cell
dates = d3.range(12, 19)
Insert cell
hours = d3.range(6, 23)
Insert cell
demoCSV = {
const keys = Object.keys(demo[0])
let result = keys.join(',') + `\n`
demo.forEach(d => {
let values = []
keys.forEach(key => {
values.push(d[key])
})
result += values.join(',') + `\n`
})
return result
}
Insert cell
demoJSON = JSON.stringify(demo)
Insert cell
demo = {
const arr = new Array(dates.length * hours.length).fill().map((d,i) => {
return item(Math.floor(i / hours.length), Math.floor(i % hours.length))
})
return arr.sort((a,b) => a.time - b.time).sort((a,b) => a.date - b.date)
}
Insert cell
item = (date, hour) => {
return {
date: dates[date],
time: [7, 12, 19][Math.floor(Math.random() * 3)],
item: items[Math.floor(Math.random() * items.length)],
color: colors[Math.floor(Math.random() * colors.length)],
size: Math.floor(d3.randomUniform(8, 30)())
}
}
Insert cell
d3 = require('d3@5')
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