Show tabular data to your users and let them edit it. This package is very small and short enough that you might consider just modifying its source to add the features you need for your use case.
If you're using a bundler, run npm install nanosheets then import it with import {NanoSheets} from
"nanosheets".
You can also
pull the library from jsdeliver
.
This example show how data is saved. It's a simple object with cell coordinates as keys and cell content as value. Cells can only contain string value.
See changes on the left reflected on the right side. This just uses the same object for both editor's data, and lets them know when to redraw.
You can initialize the sheet with readOnly:true, or update it later by setting the instance readOnly
property.
Nanosheets can easily display and edit large datasets. Below is a 100 000 cells dataset (100x1000). The scroll area adjusts to the current data. There's no penalty for having empty space between the defined values in your dataset, as the cells are accessed as keys of an object.
to create and then cleaned up an instance with instance.destroy().
to change the selection wiht the instance.select(x,y) method.
There are a few parameters you can change. If that's not enough, you can add css rules, or change the source directly.
This lib is MIT licensed, do what you want with it. Don't expect free support and bugfixes though.
GitHub