open web tools for creativity and community
Also listed in…
teamviz
data = table(demoData)
function table(arrayOfRecords) {
const keys = Object.keys(arrayOfRecords[0]);
const table = html`<table>`;
const thead = html`<thead>`;
table.appendChild(thead);
thead.appendChild(html`<th>index`);
keys.forEach(key => {
thead.appendChild(html`<th>${key}`);
});
const tbody = html`<tbody>`;
table.appendChild(tbody);
arrayOfRecords.forEach((record, index) => {
const tr = html`<tr>`;
tbody.appendChild(tr);
tr.appendChild(html`<th>${index}`);
keys.forEach(key => {
tr.appendChild(html`<td>${record[key]}`);
});
});
// TODO: click to edit
return table;
}
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.
