將contextMenu附加到flot圖點

我正在嘗試將jQuery插件contextMenu附加到flot圖中的點。我用下面的代碼中右鍵單擊右鍵菜單：將contextMenu附加到flot圖點

$(".chart").bind("plotclick").contextMenu('myMenu1', { 
    bindings: { 
     'delete': function(t) { 

       // Do stuff when delete is clicked 

     } 
    } 
});

通過上述，如果我右鍵點擊任何一個小菜單，在它「刪除」，彈出圖上的點。

但是我需要訪問flot提供的關於被點擊的點的數據。通常情況下，plotclick功能應該是這樣的：

$(".chart").bind("plotclick", function (event, pos, item) { 

    // In here I can see details about the point that was clicked by looking at event, pos and item 

})

所以我的問題是，我如何通過傳遞event, pos, item變量的文本菜單的刪除功能在我上面的第一個代碼？我正在做什麼，甚至正確的方式來附加contextMenu？

感謝

來源

2013-12-17 superphonic

你能製作出你到目前爲止的jsFiddle嗎？我開始在這裏工作：http://jsfiddle.net/4FCqr/，但不能完全得到一個工作示例。 – Mark

@Mark做了一些調整，讓小提琴工作到我目前所在的位置。我不得不直接將上下文插件複製到JavaScript窗口中，鏈接文件無法正常工作。 http://jsfiddle.net/4FCqr/1/ – superphonic

談談你綁定一般的情節div容器，然後在上下文菜單中使用plothover事件來跟蹤你是否是「過」一點？如果你不是某個點，你可以抑制彈出窗口，如果你已經結束了，你可以從全局範圍變量中獲得點信息。

$("#placeholder").contextMenu('myMenu1', { 
    onContextMenu: function(e) { 
     if (somePoint) return true; 
     else return false; 
    }, 

    bindings: { 
     'delete': function(t) { 
     alert(lastPoint.series.label);  
     } 
    } 
}); 

var somePoint = null, lastPoint = null; 
$("#placeholder").bind("plothover", function (event, pos, item) { 
    if (item){ 
     somePoint = item; 
    }else{ 
     lastPoint = somePoint; 
     somePoint = null; 
    } 
});

小提琴here。

順便說一句，我原來的小提琴沒有工作的原因，是我有錯誤的jquery上下文菜單。我以爲你使用這個one而不是這個one。

來源

2013-12-17 22:37:34 Mark

我的不好，我應該更具體。這是一個聰明的解決方案，但它並不總是觸發刪除功能。我不確定這是什麼模式，但肯定來自全新的頁面加載，第一次右鍵單擊和「刪除」點擊會觸發警報，如果我然後右鍵單擊同一點並單擊「刪除」它不會觸發警報。它也隨機不發射警戒點擊不同的線點之間。 – superphonic

找到了模式。如果我右鍵單擊該點，然後將鼠標移動到圖上的其他位置，然後返回並單擊刪除。必須是因爲你正在將somePoint設置爲null，當我點擊鼠標右鍵時，鼠標懸停在任何地方...... – superphonic

我已經修復了以下更改（我認爲）的問題http://jsfiddle.net/4FCqr/3/您認爲什麼？ – superphonic

將contextMenu附加到flot圖點

回答

相關問題