histogram-canvas v0.1.3
histogram-canvas
Install
yarn add histogram-canvas
or
npm i --save histogram-canvas
Usage
Import it:
const HistogramCanvas = require('histogram-canvas')
or include the standalone file, which is attached on each release or found in the dist
folder when downloaded from the npm registry:
<script src="path/to/histogram-canvas.min.js"></script>
The constructor takes a Canvas
and an optional options object:
let histogram = new HistogramCanvas(canvas, options)
Methods
update(data, dontClear)
data
Object Object with propertiesred
,green
, andblue
, each arrays of numbers, representing the heights of the histogram bars. Arrays can be any length.dontClear
Boolean (false) If true, the canvas will be cleared.
Options
Can be passed in constructor options object and are available as properties on the instance.
Default values are in parentheses.
red
Boolean (true) Whether or not to draw red graph.green
Boolean (true) Whether or not to draw green graph.blue
Boolean (true) Whether or not to draw blue graph.redColor
String ('#FF0000') Color for drawing red datagreenColor
String ('#00FF00) Color for drawing green datablueColor
String ('#0000FF') Color for drawing blue datacompositeOperation
String ('screen') See options here
The following are for drawing the histogram at a specific location in the canvas. By default the histogram will fill the canvas.
x
Number (0) X coordinate of left side of histogramy
Number (canvas.height) Y coordinate of bottom of histogramwidth
Number (canvas.width) Width of histogramheight
Number (canvas.height) Height of histogram
License
MIT © Stephen Tuso