2

我正在寻找一种方法来通过触发单击外部按钮来激活 jquery flot 折线图上的一个/一些数据点。我怎么能做到这一点 - 我如何在不使用鼠标的情况下获得数据点的句柄 - 我将如何激活它并激活工具提示？

感谢任何专家的建议！

4

2 回答 2

6

在我之前的评论中，我不知道 FLOT 中存在的 API 钩子和方法。旧文档是一个非常原始的txt文件。这是一个简单的示例，使用highlight/unhighlight以及使用该pointOffset()方法计算图表中数据点的像素位置以定位工具提示。

<button data-index="4">Highlight 5th point</button>
<button data-index="9">Highlight 10th point</button>
<button data-index="19">Highlight 20th point</button>

JS：

var plotData =/* data array*/

$('button').click(function(){
    var idx=$(this).data('index');
    plot.unhighlight()
    plot.highlight(dataSeriesIndex, idx);
    var dataPoint=plotData[idx];
    var position=plot.pointOffset({ x: dataPoint[0], y:  dataPoint[1] })
    var tipHTML='Data:<br> X='+dataPoint[0] +'<br> Y=' +dataPoint[1];
    $('#tooltip').css({left: position.left+10, top: position.top-10}).show().html(tipHTML)     
})

演示：http: //jsfiddle.net/et87Y/73/

于 2012-12-15T20:18:42.547 回答
2

Flot 在绘图对象上提供了 highlight 和 unhighlight 方法，如文档的Plot Methods部分所述。

传入系列的索引和系列内点的索引，它会突出显示该点。

在与 Flot 捆绑的示例文件夹中找到的“交互”示例具有此功能的实时演示。

于 2012-12-15T19:29:32.137 回答