d3.js滑块:如何获取值

Question

我在从我看到的例子中弄清楚这个问题时遇到了困难。我有一个d3滑块，它的年份范围很广。我正试图让它按照这个.value（）的思路来控制台，或者不管它的当前值是什么。

然而，我似乎甚至无法安慰.log滑块正在工作。如何让它读取当前值？

var timeSlider =  d3.select('#slider7').call(d3.slider().axis(true).min(1970).max(2000).step(1));
timeSlider.on("slide", function(evt, value) {
    console.log("slider is working!")
})

Answer 1

我假设您使用的是MasterMaps实现的D3 Slider。如果您是，我的理解是d3.select('#documentID').call(d3.slider())返回显示滑块的HTML块以及所有必要的样式。但是，滑块的HTML块不包括事件处理程序。

你可能需要这样的东西：

var timeSlider =  d3.select('#slider7').call(d3.slider().axis(true).min(1970).max(2000).step(1));
timeSlider.call(d3.slider().on("slide", function(evt, value) {
  // `value` is the percentage travelled on the slider
  // Selected year will therefore be value * (max - min) + min
  var year = value/100 * (2000-1970) + 1970;
  console.log("The slider's current value is:" + year);
}));