D3.js Slider Examples

http://github.com/turban/d3.slider

Default slider

d3.slider()

Slider controlled from an external

var slider = d3.slider().axis(true);
var pos = 0;
d3.select('#slider-button').on('click', function() { slider.slide_to(++pos); });

Slider with start value

d3.slider().value(25)

Slider with slide event: 0

d3.slider().on("slide", function(evt, value) {
  d3.select('#slider3text').text(value);
})

Slider with default axis

d3.slider().axis(true)

Slider with custom axis

d3.slider().axis( d3.svg.axis().orient("top").ticks(6) )

Slider with min, max and step values

d3.slider().axis(true).min(2000).max(2100).step(5)

Vertical slider

d3.slider().value(50).orientation("vertical")