@perspective-dev/viewer-charts 5.5.0 → 5.6.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +59 -0
- package/dist/cdn/perspective-viewer-charts.js +1 -1
- package/dist/cdn/perspective-viewer-charts.js.map +4 -4
- package/dist/esm/event-detail.d.ts +1 -1
- package/dist/esm/perspective-viewer-charts.js +1 -1
- package/dist/esm/perspective-viewer-charts.js.map +3 -3
- package/dist/esm/plugin/format-defaults.d.ts +1 -1
- package/dist/esm/plugin/plugin.d.ts +1 -1
- package/dist/esm/webgl/context-manager.d.ts +6 -6
- package/package.json +32 -7
- package/src/ts/charts/cartesian/glyphs/lines.ts +3 -33
- package/src/ts/charts/chart-base.ts +1 -1
- package/src/ts/event-detail.ts +1 -1
- package/src/ts/plugin/format-defaults.ts +1 -1
- package/src/ts/plugin/plugin.ts +25 -17
- package/src/ts/render/scheduler.ts +4 -6
- package/src/ts/webgl/context-manager.ts +16 -14
package/README.md
ADDED
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
# `@perspective-dev/viewer-charts`
|
|
2
|
+
|
|
3
|
+
[](https://www.npmjs.com/package/@perspective-dev/viewer-charts)
|
|
4
|
+
|
|
5
|
+
WebGL charts for large and streaming datasets. It is the charting plugin set
|
|
6
|
+
for `<perspective-viewer>`.
|
|
7
|
+
|
|
8
|
+
Perspective is an open-source data grid, pivot table and charting component for
|
|
9
|
+
large, real-time and streaming datasets.
|
|
10
|
+
|
|
11
|
+
Chart types: X Bar, Y Bar, Y Line, Y Area, Y Scatter, X/Y Scatter, X/Y Line,
|
|
12
|
+
Heatmap, Treemap, Sunburst, Candlestick, OHLC, and tile-based Map Scatter, Map
|
|
13
|
+
Line and Map Density.
|
|
14
|
+
|
|
15
|
+
- Rendered with WebGL, so scatter plots and heatmaps stay interactive at
|
|
16
|
+
dataset sizes where SVG and canvas charts stall.
|
|
17
|
+
- Charts redraw incrementally as the underlying `Table` updates in real time.
|
|
18
|
+
- Every chart is driven by the same pivot, filter, sort and expression
|
|
19
|
+
configuration as the data grid, and users can switch between them freely.
|
|
20
|
+
|
|
21
|
+
## Usage
|
|
22
|
+
|
|
23
|
+
Importing the package registers the plugins with `<perspective-viewer>`:
|
|
24
|
+
|
|
25
|
+
```html
|
|
26
|
+
<link rel="stylesheet" crossorigin="anonymous"
|
|
27
|
+
href="https://cdn.jsdelivr.net/npm/@perspective-dev/viewer/dist/css/themes.css" />
|
|
28
|
+
|
|
29
|
+
<perspective-viewer style="height: 600px"></perspective-viewer>
|
|
30
|
+
|
|
31
|
+
<script type="module">
|
|
32
|
+
import "https://cdn.jsdelivr.net/npm/@perspective-dev/viewer/dist/cdn/perspective-viewer.js";
|
|
33
|
+
import "https://cdn.jsdelivr.net/npm/@perspective-dev/viewer-datagrid/dist/cdn/perspective-viewer-datagrid.js";
|
|
34
|
+
import "https://cdn.jsdelivr.net/npm/@perspective-dev/viewer-charts/dist/cdn/perspective-viewer-charts.js";
|
|
35
|
+
import perspective from "https://cdn.jsdelivr.net/npm/@perspective-dev/client/dist/cdn/perspective.js";
|
|
36
|
+
|
|
37
|
+
const worker = await perspective.worker();
|
|
38
|
+
const table = worker.table("x,y\n1,2\n3,4");
|
|
39
|
+
document.querySelector("perspective-viewer").load(table);
|
|
40
|
+
</script>
|
|
41
|
+
```
|
|
42
|
+
|
|
43
|
+
With a bundler:
|
|
44
|
+
|
|
45
|
+
```javascript
|
|
46
|
+
import "@perspective-dev/viewer";
|
|
47
|
+
import "@perspective-dev/viewer-charts";
|
|
48
|
+
```
|
|
49
|
+
|
|
50
|
+
```javascript
|
|
51
|
+
await viewer.restore({ plugin: "Treemap", group_by: ["Category", "Sub-Category"], columns: ["Sales"] });
|
|
52
|
+
```
|
|
53
|
+
|
|
54
|
+
## Documentation
|
|
55
|
+
|
|
56
|
+
- [Project site and live examples](https://perspective-dev.github.io/)
|
|
57
|
+
- [User guide](https://perspective-dev.github.io/guide/)
|
|
58
|
+
- [Example gallery](https://perspective-dev.github.io/gallery/index.html)
|
|
59
|
+
- [GitHub](https://github.com/perspective-dev/perspective)
|