動態更改flot中的標記

我可以在創建時在flot上繪製分段，方法是將其添加到選項中。動態更改flot中的標記

markings: [ 
    { xaxis: { from: 150, to: 200 }, color: "#ff8888" }, 
    { xaxis: { from: 500, to: 750 }, color: "#ff8888" } 
]

現在我想刪除這些標記並通過調用函數添加新的標記。我已經嘗試了以下，但它還沒有工作。我想我不是以正確的方式訪問網格。它在選項中，但不知道如何去實現它。我也不知道如何去除舊的標記。

CustomPlot.prototype.setRibbons = function setRibbons(x1, x2) { 
    alert("ok"); \\this works 

    this.plot.getOptions().grid.markings.axis.from = x1; 
    this.plot.getOptions().grid.markings.axis.to = x2; 
    this.plot.getOptions().grid.markings.color = "#ff8888"; 
    this.plot.setupGrid(); 
    this.plot.draw();

這是plnkr example。

來源

2016-09-29 dorien

你有沒有[檢查你的控制檯]（http://stackoverflow.com/documentation/javascript/185/hello-world/714/using-console-log）的錯誤？在你的Plunker中，你似乎沒有在'grid.markings'爲'null'之前創建標記。 –

有幾件事情需要注意讓setRibbons函數在您的plnkr中按預期工作。

首先，你要通過選項設置爲空數組，消除當前的瑕疵：

this.plot.getOptions().grid.markings = [];

那麼你要重新添加你重繪的情節，然後通過選項標記：

this.plot.getOptions().grid.markings.push({ xaxis: { from: x1, to: x2 }, color: "#ff8888" });

全部放在一起時，setRibbons功能如下：

CustomPlot.prototype.setRibbons = function setRibbons(x1, x2) { 
    //remove old ribbons should there be any 
    this.plot.getOptions().grid.markings = []; 

    //draw new ones 
    this.plot.getOptions().grid.markings.push({ xaxis: { from: x1, to: x2 }, color: "#ff8888" }); 

    this.plot.setupGrid(); 
    this.plot.draw(); 
}

我已更新您的plnkr example。

來源

2016-09-29 19:11:43 mechenbier

動態更改flot中的標記

回答

相關問題