Question

需要知道什么时候在一个rangelider上拖动。添加一个关于sliderDiv on＆＃39; dragend＆＃39;只偶尔产生通知。听plotly_relayout太多了事件。

Answer 1

我认为像＆＃34; plotly_rangeslider_dragend＆＃34;尚不支持。所以你必须使用一种解决方法。

要确定一个rangelider事件，您可以使用＆＃34; plotly_relayout＆＃34;并查看eventdata-Object，如下面的代码所示：

var timer=undefined;
var plotlyRelayoutEventFunction=function(eventdata){
  if( Object.prototype.toString.call(eventdata["xaxis.range"]) === '[object Array]' ) {
    console.log("rangeslider event!!");

    if(timer!==null){
      //timer is running: stop it
      window.clearTimeout(timer);
    }

    timer = window.setTimeout(function(){ 
      //fire end event
      console.log("rangeslider event ENDS");

      //reset timer to undefined
      delete timer;
      timer=undefined;
    }, 800);
  }
}

第一个if语句检查eventdata字段＆＃34; xaxis.range＆＃34;是一个数组。如果是，则是一个rangelider事件。（相比之下，zoom-event类似于它，但它不是数组）。

要确定rangelider事件的结束，您可以使用计时器。如果新事件以800ms的时间范围进入，则不是结束，计时器重新启动。如果800ms结束，并且在rangelider-end-event中没有新的事件。

当然这不是完整的解决方案，因为用户可以等待800毫秒而不释放滑块。所以你必须使用一些鼠标事件来构建一个非常正确的rangelider-end-event。希望能引导你朝着正确的方向前进。我认为有很多方法可以解决它。

以下是jsfiddle的完整示例，基于plotliders的plotly网站示例，并向控制台发出rangelider-end-event：https://jsfiddle.net/7d03n2k1/

修改

我更新了我的代码：https://jsfiddle.net/7d03n2k1/1/ 原因window.setTimout（...）返回一个Id，没有对象代码错误。

plotly rangelider如何确定是否选择范围

1 个答案: