Perspective › Examples
Background Colors — Data grid with 6 categories. 3 categories have custom, solid color conditional formatting.
Data grid of Category, Sales, Discount and Profit, sorted by Sub-Category.

Data
Programmatic variations on the Superstore retail sales dataset, showing the flexibility of Perspective's configuration: the same table re-queried as data grids, pivot tables and charts by changing only the viewer's JSON config.
Loaded from /data/superstore.lz4.arrow as arrow into the perspective-server engine.
Configuration
This example is a saved <perspective-viewer> workspace. Pass this JSON to viewer.restoreWorkspace() to reproduce it over the same table:
{
"layout": {
"type": "tab-layout",
"tabs": [
"p0"
],
"selected": 0
},
"panels": {
"p0": {
"table": "",
"title": "Background Colors",
"plugin": "Datagrid",
"columns_config": {
"Discount": {
"bg_color": "linear-gradient(to right, #780aff 0%, #f5ac0f 100%)",
"bg_mode": "color",
"fg_mode": "disabled"
},
"Profit": {
"bg_color": "linear-gradient(to right, #f50fed 0%, #32cd82 100%)",
"bg_mode": "color",
"fg_mode": "disabled"
},
"Sales": {
"bg_color": "linear-gradient(to right, #f5ac0f 0%, #780aff 100%)",
"bg_mode": "color",
"fg_mode": "disabled"
}
},
"plugin_config": {
"scroll_lock": true
},
"columns": [
"Category",
"Sales",
"Discount",
"Profit",
"Sub-Category",
"Order Date"
],
"sort": [
[
"Sub-Category",
"desc"
]
],
"theme": null
}
},
"active": "p0"
}
About Perspective
Perspective is an open-source, WebAssembly-powered data grid, pivot table and charting component for large, real-time and streaming datasets — in the browser, Python, Jupyter, Node.js and Rust.
Documentation