Published
Edited
Aug 25, 2020
1 fork
2 stars
Insert cell
Insert cell
viewof testTable = {
const container = html`<div id="example1" class="hot handsontable htRowHeaders htColumnHeaders" style="height: 320px; overflow: hidden; width: 100%;" data-originalstyle="height: 320px; overflow: hidden; width: 100%;"></div>`;
const hot = new handsontable(container, {
data: handsontable.helper.createSpreadsheetData(1000, 1000),
colWidths: 100,
width: '100%',
height: 320,
rowHeights: 23,
rowHeaders: true,
colHeaders: true
});
hot.updateSettings({
afterRender: isForced => {
hot.view.wt.wtOverlays.updateMainScrollableElements();
}
});
container.hot = hot;
container.value = hot.getSourceData();
// Hack to display table without needing to click on it or modify the surrounding DOM
window.setTimeout(() => {
container.hot.refreshDimensions();
}, 30);
return container;
}
Insert cell
handsontable = {
const styles = html`<link href="https://unpkg.com/handsontable/dist/handsontable.full.min.css" rel="stylesheet" media="screen">`;
document.head.appendChild(styles);
return require('handsontable');
}
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