在jQuery flot图表上添加或突出显示单个点？ [英] Add or highlight a single points on a jQuery flot graph?

问题描述

我已经使用一些数据绘制了一个flot图：

I've already drawn a flot graph using some data:

    var plot = $.plot($("#placeholder"),
    [{
        data: data,
    }], {
        series: {
            points: {
                show: true
            }
        },
        grid: {
            hoverable: true,
        }
    });

现在我想在图表上突出显示单个点，当用户将鼠标悬停在页面上其他位置的项目上时。

Now I'd like to highlight a single point on the graph, when a user hovers over an item elsewhere on the page.

我发现这个问题，它解释了如何从头开始重新绘制系列，但有没有办法突出显示单个点？

I found this question, which explains how to totally redraw the series from scratch, but is there a way to highlight a single point?

或者添加一个不同颜色的新点，这会产生高光效果？

Or add a new point in a different colour, which would have the effect of a highlight?

NB ：当用户将鼠标悬停在页面上其他位置的相关项目上时，我将获得相关点的x和y坐标，但不会显示图表上的像素坐标。

NB: when the user hovers over the relevant item elsewhere on the page, I will have the x and y coordinates of the related point, but not the pixel coordinates on the graph.

推荐答案

API 提供以下方法：

从绘图函数返回的Plot对象有一些方法你
可以致电：

The Plot object returned from the plot function has some methods you can call:

• 高亮（系列，数据点）

• highlight(series, datapoint)

突出显示数据系列中的特定数据点。您可以
指定实际对象，例如如果你从
plotclick事件中获得它们，或者你可以指定索引，例如
突出显示（1,3）以突出显示第二个系列中的第四个点
（记住，基于零的索引）。

Highlight a specific datapoint in the data series. You can either specify the actual objects, e.g. if you got them from a "plotclick" event, or you can specify the indices, e.g. highlight(1, 3) to highlight the fourth point in the second series (remember, zero-based indexing).

unhighlight（系列，数据点）或unhighlight（）

unhighlight(series, datapoint) or unhighlight()

删除点的突出显示，与
高亮相同的参数。

Remove the highlighting of the point, same parameters as highlight.

如果您在没有参数的情况下调用unhighlight，例如如
plot.unhighlight（），所有当前的高光都被移除。

If you call unhighlight with no parameters, e.g. as plot.unhighlight(), all current highlights are removed.

这篇关于在jQuery flot图表上添加或突出显示单个点？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！