plotly rangeslider如何確定是否選擇了範圍

需要知道在滑塊上拖動完成時的情況。 'dragend'上的sliderDiv上添加事件僅產生偶爾的通知。在plotly_relayout上收聽會產生太多的事件事件。plotly rangeslider如何確定是否選擇了範圍

2016-10-31 mei

您可以添加生成圖形和滑塊的代碼嗎？ –

@mei：你對我的回答滿意嗎？我會在你的完整解決方案中感興趣 – flipperweid

@ flipperweid，我有一個更加棘手的解決方案，但它遵循類似你的邏輯線。（'plotly_relayout'，function（event，arguments）var _arg = arguments; var _keys = Object.keys（_arg）; var _str = _keys [0]; //window.console.log("relayout for ..「，_ str）; if（_str ==」xaxis.range「）{ minmaxAgain（）; } }）; ' – mei

我認爲像「plotly_rangeslider_dragend」這樣的事件尚未得到支持。所以你必須使用一種解決方法。

要確定您可以使用「plotly_relayout」，並考慮像下面的代碼EVENTDATA對象中的某個rangeslider事件：

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場「xaxis.range」是陣列。如果是的話，這是一個滑雪場事件。（相比之下，縮放事件類似，但它不是一個數組）。

要確定rangeslider事件的結束，您可以使用計時器。如果新事件在800ms的時間範圍內進入，它不會結束並且計時器重新啓動。如果800ms結束，並且rangelider結束事件中沒有新事件發生。

當然這不是完整的解決方案，導致用戶可以等待800毫秒而不釋放滑塊。所以你也必須使用一些鼠標事件來構建一個非常合適的距離滑翔機結束事件。希望能帶領你走向正確的方向。我認爲有很多方法可以解決這個問題。

這裏是的jsfiddle到基於rangesliders的plotly網站例如一個完整的例子，並觸發一個rangeslider端事件控制檯：https://jsfiddle.net/7d03n2k1/

編輯：

我updadet我的代碼：https://jsfiddle.net/7d03n2k1/1/ 原因window.setTimout（...）返回一個Id並且沒有代碼錯誤的對象。

來源

2016-11-15 10:25:12 flipperweid

plotly rangeslider如何確定是否選擇了範圍

回答

相關問題