当鼠标悬停在上面时，jqplot荧光笔显示一行 [英] jqplot highlighter a line when mouse is over it

问题描述

我正在使用jqplot生成多个折线图，并希望向其添加突出显示功能.详细地，一旦您的鼠标悬停在这条线上，它将突出显示自身(更改颜色).我已经在条形图中看到了此功能(示例).有没有办法将其介绍给线图?

I am using jqplot to generate several line plots, and would like to add the highlight feature to it. In detail, once your mouse is over this line, it will highlight itself (change color). I have see this feature in bar plot (example). Is there a way to introduce this to line plot?

这是我的代码的演示.

推荐答案

jqPlot并非开箱即用，至少就我所知.因此，最简单的"是自己添加.我前一段时间做了这样的事情.我的方法是使用jqplotMouseMove事件并在其中添加适当的功能.

This feature, at least to my knowledge, is not provided out of the box by the jqPlot. For this reason the 'easiest' is to add it yourself. I did something of this sort a while back. My approach was to use the jqplotMouseMove event and add the appropriate functionality there.

我的方法的想法很简单:

1. 获取鼠标点与线段的距离.
2. 然后，如果它小于线条的宽度-您就找到了线条.
3. 在荧光笔的画布(.jqplot-highlight-canvas)上以不同的颜色绘制线条，从而创建突出显示效果-对于此画布，我们需要荧光笔插件.

1. Get the distance of the mouse point from a line segment.
2. Then if it is smaller than the line's width - you found your line.
3. Draw the line in different colour on the highlighter's canvas (.jqplot-highlight-canvas), thus creating the highlight effect - for this canvas we need the highlighter plugin.

上面提到的想法的工作示例在这里.

PS::感谢Jonas Raoni Soares Silva为点到线距离功能节省了我很多时间，而且效果很好.

PS: Thanks to Jonas Raoni Soares Silva, for the point to line distance function which saved lots of my time, and works great.

这篇关于当鼠标悬停在上面时，jqplot荧光笔显示一行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！