https://github.com/gl-vis/regl-splom
Matrix of scatter2d plots
https://github.com/gl-vis/regl-splom
plot scatter scatter-matrix splom
Last synced: 30 days ago
JSON representation
Matrix of scatter2d plots
- Host: GitHub
- URL: https://github.com/gl-vis/regl-splom
- Owner: gl-vis
- License: mit
- Created: 2018-03-08T05:31:23.000Z (over 7 years ago)
- Default Branch: master
- Last Pushed: 2023-03-01T16:09:50.000Z (over 2 years ago)
- Last Synced: 2025-08-18T11:10:58.701Z (about 2 months ago)
- Topics: plot, scatter, scatter-matrix, splom
- Language: JavaScript
- Homepage: https://gl-vis.github.io/regl-splom
- Size: 307 KB
- Stars: 2
- Watchers: 1
- Forks: 2
- Open Issues: 1
-
Metadata Files:
- Readme: readme.md
- License: license.md
Awesome Lists containing this project
README
# regl-splom
Matrix of scatter plots. A wrapper over [regl-scatter2d](https://github.com/gl-vis/regl-scatter2d) for optimized intersected data rendering.
* [x] minimal GPU memory footprint: N vs N*N in direct [regl-scatter2d](https://github.com/dy/regl-scatter2d) passes case.
* [ ] optimized performance due to binary trees for 1d point clustering, opposed to default 2d quad clustering.## Usage
[](https://npmjs.org/package/regl-splom/)
```js
let regl = require('regl')({extensions: 'oes_element_index_uint'})
let createMatrix = require('regl-splom')let scatterMatrix = createMatrix(regl)
// pass data and views to display
scatterMatrix.update(
{ data: [[], [], ...], ranges, domains, viewport, size, color, border },
{ data: [[], [], ...], ranges, domains, viewport, size, color, border }
)// draw views by ids
scatterMatrix.draw(0, 1, ...views)
```## API
### `splom = createSplom(regl)`
Creates scatter matrix instance.
### `splom.update(trace1, trace2, ...traces)`
Define passes for `draw` method. Every trace can include the following options:
Option | Description
---|---
`data` | An array with arrays for the columns.
`range` | Array with data ranges corresponding to `data`. Every range can be an array `[min, max]` or `[minX, minY, maxX, maxY]`. If undefined - detected automatically.
`domain` | Array with domains for the data, ie. the area data dimension holds within the `viewport`. Each domain can be an array `[min, max]` for symmetric placement or `[minX, minY, maxX, maxY]` for precise position. Domain values are from `0..1` interval, defining what area of the `viewport` a dimension holds. By default domains cover viewport evnely.
`padding` | Padding within domains (in px), or list of paddings per-domain. By default `[0,0,0,0]`. Can be a number, an array or any [rectangle](https://github.com/dy/parse-rect) format.
`color`, `size`, `borderColor`, `borderSize`, `opacity` | Points style.
`marker` | Points marker.
`diagonal` | Show or hide diagonal.
`upper` | Show or hide upper half matrix.
`lower` | Show or hide lower half matrix.
`viewport` | Area that the plot holds within the canvas. Can take any [rectangle](https://github.com/dy/parse-rect) format.### `splom.draw(...ids?|...points?)`
Draw all defined passes, or only selected ones provided by `ids`. Optionally define point indexes to render.
```js
// draw 1 and 3 passes
splom.draw(1, 3)// draw 1, 2 and 3 points from the first pass and 3 point from the second pass
splom.draw([1, 2, 3], [3])
```### `splom.destroy()`
Dispose renderer and all the associated resources
## Related
* [regl-scatter2d](https://github.com/dy/regl-scatter2d)
* [regl-line2d](https://github.com/dy/regl-line2d)
* [regl-error2d](https://github.com/dy/regl-error2d)## License
© 2018 Dmitry Yv. MIT License
Development supported by [plot.ly](https://github.com/plotly/).