chart.js-rangeslider
v1.2.5
Published
This adds the option of having a range slider to your charts, to allow you to select a specific data scale
Downloads
25
Maintainers
Readme
Chart.JS-RangeSlider
A range slider plugin for Chart.JS, that enables you to select a specific data scales.
Demo
JSFiddle: https://jsfiddle.net/schme16/xfyvvup8/195/
Installation:
bower install chart.js-rangeslider --save
npm install chart.js-rangeslider --save
or straight from the source:
- As a zip: https://github.com/schme16/Chart.js-RangeSlider/archive/master.zip)
- via git:
git clone https://github.com/schme16/Chart.js-RangeSlider.git
Dependencies
- jQuery (for now)
- Chart.js
- noUISlider
Which one should I use?
- Include the version that suits you best; the library comes in three flavours:
- Solo: Only the plugin is included.
- Minimal: The plugin and the slider library noUISlider is included
- All: This one is batteries included, as such it come with jQuery, Chart.js noUISlider and the plugin all bundled together.
Usage
new RangeSliderChart({
chartData: chartJSDatasets, //The same data you give to Chart.js
chartOpts: chartJSOptions, //Your Chart.js options
chartType: 'Line', //Which Chart.js chart you want (eg. Lie, Bar, Pie, etc.)
chartCTX: ctx, //your canvas context
class: 'my-chart-ranger', //Specifies a custom class you want applied to your sliders
initial: [3, 10] //Which data points to start the sliders on
})