https://github.com/lgsinnovations/react-sigplot
React wrapper for SigPlot.js
https://github.com/lgsinnovations/react-sigplot
canvas charting dsp javascript plot react sdr signal-processing sigplot software-defined-radio
Last synced: 3 months ago
JSON representation
React wrapper for SigPlot.js
- Host: GitHub
- URL: https://github.com/lgsinnovations/react-sigplot
- Owner: LGSInnovations
- License: apache-2.0
- Created: 2018-10-06T12:42:08.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2023-01-04T21:38:03.000Z (over 2 years ago)
- Last Synced: 2025-03-23T23:14:13.836Z (3 months ago)
- Topics: canvas, charting, dsp, javascript, plot, react, sdr, signal-processing, sigplot, software-defined-radio
- Language: JavaScript
- Homepage: https://sigplot.lgsinnovations.com
- Size: 14 MB
- Stars: 4
- Watchers: 6
- Forks: 9
- Open Issues: 29
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
react-sigplot
===============
[](https://opensource.org/licenses/Apache-2.0) [](https://travis-ci.org/LGSInnovations/react-sigplot) [](.github/CONTRIBUTING.md#pull-requests) [](https://badge.fury.io/js/react-sigplot) [](https://codecov.io/gh/LGSInnovations/react-sigplot)
SigPlot wrapper component for ReactJS.
Source: https://lgsinnovations.gitlab.com/axios/react-sigplot
Install: `npm install --save react-sigplot`
## What is it?
Provides a component that wraps the SigPlot library.
## Properties
### \
|Property|Type|Default|Explanation|
|---|---|---|---|
|`height`|`number`|300|Height of the `div` wrapping SigPlot|
|`width`|`number`|300|Width of the `div` wrapping SigPlot|
|`display`|`string`|inline-block|CSS display type for `div` wrapping SigPlot|
|`styles`|`object`|`undefined`|any other CSS Styles as JS object|
|`options`|`object`|`{all: true, expand: true, autol: 100, autohide_panbars: true}`|SigPlot `Plot` options|
### \
|Property|Type|Default|Explanation|
|---|---|---|---|
|`data`|`array(number)`|`undefined`|Array of values to plot|
|`options`|`object`|`undefined`|SigPlot data header|
|`layerOptions`|`object`|`undefined`|SigPlot `Layer` options|
### \
|Property|Type|Default|Explanation|
|---|---|---|---|
|`data`|`array(number)`|`undefined`|Array of values to plot|
|`options`|`object`|`undefined`|SigPlot `Layer` options|
### \
|Property|Type|Default|Explanation|
|---|---|---|---|
|`href`|`string`|`''`|URL or path to a bluefile or MATLAB file|
|`onload`|`function`|`null`|Function that will get executed when file is loaded|
|`options`|`object`|`undefined`|SigPlot `Layer` options|
### \
|Property|Type|Default|Explanation|
|---|---|---|---|
|`wsurl`|`string`|`''`|URL to the websocket server|
|`overrides`|`object`|`undefined`|SigPlot `Layer` overrides|
|`options`|`object`|`undefined`|SigPlot `Layer` options|
## Usage
### Basic
```js
/** Default plot an array three different ways
* 1. As a standard array
* 2. As a pipe
* 3. As a file/url
*/
```
## Example Preview
If you run
```
$ npm run build
$ python -m SimpleHTTPServer 8888
```
and in a browser, navigate to http://0.0.0.0:8888, you
should see the following
