Javascript 如何在jqueryflot中创建可点击行？

我正在使用flot制作折线图。我尝试实现的一个功能是将线条（包括线条上的点及其对应的图例）调高，如果用户单击线条，则如果用户单击图表上的任何其他位置，则取消高亮显示

已尝试“plotclick”事件，但需要单击点。我需要的能力，以获得该系列时，点击该行以及

---

希望有一种方法可以做到这一点。

您必须手动搜索直线上最近的点，然后使用以下方法计算距离：

$('#placeholder').on('plotclick', function(event, pos, item) {
    $('#output').empty();
    if (item) { // clicked on point
        $('#output').text('series: ' + item.series.label + ' - datapoint: ' + item.dataIndex);
        return;
    }
    else { // search for line
        for (var i = 1; i < data.length; i++) {
            if (data[i-1][0] <= pos.x && pos.x < data[i][0]) {
                var lineX = (pos.x - data[i-1][0]) / (data[i][0] - data[i-1][0]);
                var lineY = data[i-1][1] + lineX * (data[i][1] - data[i-1][1]);
                if (Math.abs(pos.y - lineY) < maxDistance) {
                    $('#output').html('between datapoints ' + (i-1) + ' and ' + i + '<br />'
                        + 'distance from line: ' + Math.abs(pos.y - lineY).toFixed(3));
                }
                return;
            }
        }
    }
});

$（“#占位符”）。在（'plotclick'，函数（事件、位置、项目）{
$（“#输出”）.empty（）；
如果（项目）{//点击点
$（'#output'）.text（'series:'+item.series.label+'-datapoint:'+item.dataIndex）；
返回；
}
else{//搜索行
对于（变量i=1；iif（data[i-1][0]非常感谢！还有一个问题。我也在使用样条线插件绘制平滑线。我可以看到你的算法适用于直线。你如何对平滑线执行相同的操作？绘制平滑线后，你可以使用
plot.getData（）
（如果将Flot plot对象保存到名为plot的变量中）。然后使用平滑数据，而不是原始数据。也会执行类似操作（使用平滑数据上的animator插件）。