Visually explore, understand, and present your data.
Add these to the dependencies
section of your package.json
, then run npm install
:
"@msrvida/sanddance-react": "^4",
"react": "^17",
"react-dom": "^17",
"vega": "^5.30"
Import these in your JavaScript:
import * as vega from 'vega';
import * as React from 'react';
import * as ReactDOM from 'react-dom';
import * as SandDanceReact from '@msrvida/sanddance-react';
SandDanceReact.use(React, ReactDOM, vega);
const data = [
{ a: 1, b: "c1" },
{ a: 1, b: "c2" },
{ a: 2, b: "c3" },
{ a: 3, b: "c4" }
];
const insight = {
columns: {
x: "a",
color: "b",
},
scheme: "set1",
chart: "barchartV",
view: "2d",
size: {
height: 800,
width: 800
}
}
ReactDOM.render(
<SandDanceReact.Viewer
data={data}
insight={insight}
/>,
document.getElementById('app')
);
- renamed SandDanceReact to Viewer
- removed deck.gl dependency
Please visit the SandDance website.