@photonviz/core 0.2.0 → 0.2.1
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 +70 -0
- package/package.json +1 -1
package/README.md
ADDED
|
@@ -0,0 +1,70 @@
|
|
|
1
|
+
<p align="center">
|
|
2
|
+
<img src="https://raw.githubusercontent.com/coredumpdev/photon/master/assets/banner.png" alt="Photon" width="100%" />
|
|
3
|
+
</p>
|
|
4
|
+
|
|
5
|
+
# @photonviz/core
|
|
6
|
+
|
|
7
|
+
**GPU-accelerated scientific plotting for the web — WebGL2, zero dependencies.**
|
|
8
|
+
|
|
9
|
+
<p align="center">
|
|
10
|
+
<img src="https://raw.githubusercontent.com/coredumpdev/photon/master/assets/streaming.gif" alt="Live streaming WebGL2 charts at 60fps" width="100%" />
|
|
11
|
+
</p>
|
|
12
|
+
|
|
13
|
+
<p align="center">
|
|
14
|
+
<img src="https://raw.githubusercontent.com/coredumpdev/photon/master/assets/gallery-full.png" alt="Photon chart gallery" width="100%" />
|
|
15
|
+
</p>
|
|
16
|
+
|
|
17
|
+
The framework-agnostic core of [Photon](https://github.com/coredumpdev/photon).
|
|
18
|
+
Renders geometry on the GPU (instanced WebGL2 + min/max decimation) and draws
|
|
19
|
+
axes, ticks, and labels on a crisp Canvas2D overlay — so you get both **scale**
|
|
20
|
+
(millions of points at 60fps) and **sharp text**.
|
|
21
|
+
|
|
22
|
+
```bash
|
|
23
|
+
npm i @photonviz/core
|
|
24
|
+
```
|
|
25
|
+
|
|
26
|
+
> Framework bindings: [`@photonviz/react`](https://www.npmjs.com/package/@photonviz/react) · [`@photonviz/vue`](https://www.npmjs.com/package/@photonviz/vue) · [`@photonviz/svelte`](https://www.npmjs.com/package/@photonviz/svelte)
|
|
27
|
+
> Vector maps: [`@photonviz/map`](https://www.npmjs.com/package/@photonviz/map)
|
|
28
|
+
|
|
29
|
+
## Quick start
|
|
30
|
+
|
|
31
|
+
```ts
|
|
32
|
+
import { Plot } from "@photonviz/core";
|
|
33
|
+
|
|
34
|
+
const plot = new Plot(document.getElementById("chart")!, {
|
|
35
|
+
theme: "dark",
|
|
36
|
+
scales: { y: { type: "log" } },
|
|
37
|
+
});
|
|
38
|
+
|
|
39
|
+
plot.addLine({ x: xs, y: ys, color: "#60a5fa", width: 2, name: "signal" });
|
|
40
|
+
// wheel to zoom · drag to pan · box-zoom + home from the toolbar · hover for tooltips
|
|
41
|
+
```
|
|
42
|
+
|
|
43
|
+
## Chart types
|
|
44
|
+
|
|
45
|
+
| Type | API |
|
|
46
|
+
| --- | --- |
|
|
47
|
+
| Line / Step | `plot.addLine({ x, y, color, width, step })` — real thick lines, round/miter/bevel joins |
|
|
48
|
+
| Scatter | `plot.addScatter({ x, y, size, colorBy })` — instanced, colormap by value |
|
|
49
|
+
| Bar | `plot.addBar({ x, y, width, offset, base })` — grouped / stacked |
|
|
50
|
+
| Area | `plot.addArea({ x, y, base })` |
|
|
51
|
+
| Histogram | `plot.addHistogram(values, { bins })` |
|
|
52
|
+
| Box / Violin | `plot.addBox({ groups, violin })` — Tukey quartiles, KDE |
|
|
53
|
+
| Heatmap | `plot.addHeatmap({ values, cols, rows, extent, colormap })` |
|
|
54
|
+
| Contour | `plot.addContour({ values, cols, rows, extent, levels })` |
|
|
55
|
+
| Hexbin | `plot.addHexbin({ x, y, radius, colormap })` |
|
|
56
|
+
| Error bar / Stem / Quiver / Candlestick | `plot.addErrorBar` · `addStem` · `addQuiver` · `addCandlestick` |
|
|
57
|
+
|
|
58
|
+
**Polar** — `new PolarPlot(el)` with `addLine` / `addScatter` (drag to rotate, wheel to zoom).
|
|
59
|
+
**3D** — `new Plot3D(el)` with `addSurface` / `addPointCloud` (orbit camera).
|
|
60
|
+
|
|
61
|
+
## Features
|
|
62
|
+
|
|
63
|
+
- **Scales** — linear, log (decade ticks + GPU log transform), time (large epoch timestamps via per-layer reference offsets).
|
|
64
|
+
- **Streaming** — line/scatter/bar/area expose `setData()` to re-upload GPU buffers each frame.
|
|
65
|
+
- **Interaction** — wheel-zoom, pan, box/X/Y zoom, hover crosshair + tooltips, multiple Y axes, custom ticks.
|
|
66
|
+
- **Many charts, one context** — a single shared WebGL2 context backs every plot, so a page can hold dozens.
|
|
67
|
+
|
|
68
|
+
## License
|
|
69
|
+
|
|
70
|
+
[MIT](https://github.com/coredumpdev/photon/blob/master/LICENSE) — full docs & source at [github.com/coredumpdev/photon](https://github.com/coredumpdev/photon).
|