flot：放大，懸停和系列選擇在同一個地塊

Question

我想在同一個地塊上繪製3個不同的系列。我想要做的情節如下：

• 允許用戶選擇哪個系列的繪製（」 Turning series on/off‘的海軍報網站上的例子），
• 允許用戶放大和縮小（’ Rectangular selection with zooming「示例），
• 顯示用戶懸停鼠標時曲線的值（」Tracking curves「示例）。

我一直在努力讓它工作很長一段時間，我無法讓所有的東西都能正常工作。 My current attempt未能正確打開/關閉系列。只要我選中一個框，圖表就會變成空白。定義所有繪圖功能等的JavaScript文件是plot_displacement.js。

代碼的相關部分是：

var choice_container = jQuery("#choices"); 
choice_container.find("input").change(do_plot); 

的HTML是：

<p id="choices">Show:</p> 
<div id="plotdiv" style="width:600px;height:300px;position:static;"></div> 

我使用change並沒有因爲this question's answerclick。如果我使用click，那麼選擇/取消選擇複選框似乎沒有任何作用。

我確定我忽略了一些簡單的東西，但我無法弄清楚什麼。我希望能夠完成我想要做的所有3件事。

謝謝！

Answer 1

你的問題很簡單，do_plot正在從您的更改事件中調用，其中xmin是一個jQuery事件對象。你期望它是未定義的，然後設置爲0，但相反，你傳遞的xmin：jQuery.Event flot，它不知道如何處理它。

編輯：既然有人問，實際的代碼，你可能想就擺在那裏，檢查時如果XMIN是不確定的，另外檢查是否是一個對象（jQuery.Event有一個typeof運算object）：

if (typeof(xmin) == 'undefined' || typeof(xmin) == 'object') xmin = 0; 

Answer 2

點擊確實對我有效。

我使用的代碼從海軍報例如：

$("#checkboxes").find("input").click(plotAccordingToChoices); 

點擊複選框電話：

function plotAccordingToChoices() { 
    var data = []; 

    $("#checkboxes").find("input:checked").each(function() { 
     var key = $(this).attr("name"); 
     if (key && datasets[key]) 
      data.push(datasets[key]); 
    }); 

    if (data.length > 0){ 
     plot = $.plot($("#chart1"), data, options); 
    } 
} 

數據集是集名稱鍵和初始化創建一個全局數組。