2.0.16 • Published 4 years ago
histoslider v2.0.16
histoslider
A D3 based histogram slider component for React. Useful for exploring distributions of things within data visualisations.
Usage
histoslider
has a few peer dependencies. Make sure these are installed before you go any further.
react
react-dom
d3-array
d3-format
d3-scale
Then, to install, either
npm install histoslider --save
or
yarn add histoslider
Yay, glad we got that out of the way.
Component API
<Histoslider
// An array of objects to create the histogram
data={[
{
x0: 0, // Start of the bucket
x: 1, // End of the bucket
y: 100 // Value
},
{
x0: 1, // Start of the bucket
x: 2, // End of the bucket
y: 120 // Value
},
...
]}
// How much to pad the slider and histogram by, defaults to 20
padding={20}
// The extent of the selection, this doesn't have to be sorted (and you shouldn't sort it to store it)
selection={[number, number]}
// A function to handle a change in the selection
onChange={array => { console.log(array) }}
/>
more docs to come
Development
yarn start
Hack away :)
2.0.16
4 years ago
2.0.15
5 years ago
2.0.14
7 years ago
2.0.13
7 years ago
2.0.12
7 years ago
2.0.11
7 years ago
2.0.10
7 years ago
2.0.9
7 years ago
2.0.8
7 years ago
2.0.7
7 years ago
2.0.6
7 years ago
2.0.5
7 years ago
2.0.4
7 years ago
2.0.3
7 years ago
2.0.2
7 years ago
2.0.1
7 years ago
2.0.0
7 years ago
1.0.1
7 years ago
0.0.4
8 years ago
0.0.3
8 years ago
0.0.2
8 years ago