有浮动工具提示的Flot的任何示例？

我目前正在开发一个Flot图，这个API看起来总体上非常强大，尽管高级使用的例子没有被广泛记录。

API建议有一些方法可以在图表上设置hoverable，而不是我确定究竟是什么意味着我可以用它来做。

我想知道是否有人可以提供他们遇到过的一些示例，或代码，这些示例表明以下任何一个示例：

通过将鼠标hover在Flot图表元素上的事件触发的动态工具提示
勾选工具提示（hover在xaxis上显示详细信息）
任何类型的hover在/动态事件绑定已使用w Flot

我正在寻找的效果类似于此 Open Flash Chart示例

看看这个flot示例，它演示了图表上绘图点的工具提示。（确保选中“ 启用工具提示”复选框。）

还有一个简单的工具提示插件，你可以在这里找到它

我还为插件添加了一些function，你可以在github上找到它。 https://github.com/skeleton9/flot.tooltip

http://data.worldbank.org使用Flot构建并使用工具提示。

Simon的答案中的链接非常适用于提供与浮动工具提示一起使用的钩子。但是，我发现我必须挖掘并削减代码才能完成hover效果。结果如下（基本上是从http://people.iola.dk/olau/flot/examples/interacting.html逐字逐句）。

在flot初始化中需要更改的唯一设置是在options对象中。它需要包含这个选项之一：

 var options = { //... : {}, grid: { hoverable: true } };

此函数在调用时构造并显示工具提示元素。参数x和y是flot内部的偏移量，因此工具提示位置正确。内容是工具提示中显示的内容

 function showTooltip(x, y, contents) { $('' + contents + '
').css({ position: 'absolute', display: 'none', top: y + 5, left: x + 5, border: '1px solid #fdd', padding: '2px', 'background-color': '#fee' }).appendTo("body").fadeIn(200); }

这是绑定，只有在用作flot的占位符的元素可用时才应调用它。它连接事件处理程序。 previousPoint用作显示工具提示的标志

  var previousPoint = null; $("#flotPlaceHolder").bind("plothover", function (event, pos, item) { if (item) { if (previousPoint != item.dataIndex) { previousPoint = item.dataIndex; $("#tooltip").remove(); var x = item.datapoint[0].toFixed(0), y = item.datapoint[1].toFixed(0); showTooltip(item.pageX, item.pageY, "(" + x + "," + y + ")"); } } else { $("#tooltip").remove(); previousPoint = null; } });

查看此库以获取工具提示和flot集成

https://github.com/krzysu/flot.tooltip

http://craigsworks.com/projects/qtip2/demos/#flot是我最喜欢的JS工具提示库。它相当糟糕，并有flot集成。

您可以将自定义数据添加到数据arrays，并使用它来显示工具提示。

请参阅我的答案和完整示例：将鼠标hover在flot中的某个点上时显示自定义工具提示

有浮动工具提示的Flot的任何示例？

在jQuery flot图表上添加或突出显示单个点？