bumbeishvili / data-driven-range-slider

D3.js based data-driven range slider, date time support

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

SWUbanner

Data driven range slider

Add interactivity to your web apps

NPM Version

D3 and svg based data driven range slider, with good performance

Check out Introduction

Check out examples

Check out several libraries and frameworks integrations

Integrations

Installing

npm i data-driven-range-slider

Usage

const RangeSlider = require ('https://bundle.run/data-driven-range-slider@1.0.0');


new RangeSlider()
   .container(<myDOMElement>)
   .data(<myData>)
   .accessor(d=> d.<myDataPropertyName>)
   .aggregator(group => group.values.length)
   .onBrush(d=> /* Handle range values */)
  
   .svgWidth(800)
   .svgHeight(100)
   .render()
 

Author

David B (twitter)
David B (linkedin)

I am available for freelance data visualization work. Please contact me in case you'd like me to help you with my experience and expertise

You can also book data viz related consultation session with me

About

D3.js based data-driven range slider, date time support

License:MIT License


Languages

Language:JavaScript 100.0%