visualization-snapshot
A state management system for implicit and explicit re-visitation in state based visualizations and dashboards.
Install the package
npm install @kiranbandi/snapshot
Import the required functions
import { initializeSnapshot, updateSnapshot } from '@kiranbandi/snapshot';
Set the class 'snapshot' on the canvas or svg element that you want to be stored as a thumbnail in each snapshot.
Then initialize snapshot by setting the automatic timer mode and interval (milliseconds), thumbnail options such as its class name, size and type and finally a callback that gets called with the data in the snapshot, that needs to be handled by you to update the visualization
initializeSnapshot(true, 1000,
{
'class': '.snapshot',
'type': 'svg',
'size': { 'width': 100, 'height': 100 }
},
(data) => { // update visualization with new data });
Finally call update snapshot everytime data to the chart is being updated so that snapshot module can access the latest available data
updateSnapshot(data);