动态更改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中的标记

回答

相关问题