Multi-color slider implemented in ReactJS. Configurable number of segments and colors!
npm i multicolorsliderTo run the example App locally:
npm install
npm run build
npm startOpen localhost:2222.
import ColorSlider from 'multicolorslider'<ColorSlider
min={Number}
max={Number}
name={String}
thresholds={Array}
colors={Array}
onChange={Function}
/>| Prop | Type | Default | Description |
|---|---|---|---|
min |
number | minimum value on the slider | |
max |
number | maximum value on the slider | |
name |
string | name of the slider | |
thresholds |
array | [] | array of thresholds with array [0] == min and array[length -1] == max |
colors |
array | [] | array of color codes, each representing a color segment on the slider in a sequence. The array length is equal to the thresholds array length - 1 |
onChange |
function | call back function whenever slider changes a value/threshold |
Please check the LICENSE file.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent