在图片上画线 - Javascript？

Question

我的页面上有一些图表。当用户将光标拖到图片上时，我想在图表上显示一条水平线。

上面的那个是起点，后者显示当用户将光标指向图表时应该发生什么。当光线在图像上时，该线应与光标保持在同一水平。

例如，这可以用Javascript吗？

Answer 1

是的，你需要例如一个div框，位于光标Y值，1px绿色边框。位置必须设置为绝对值。但你无法直接在图像中绘画。

Answer 2

您可以使用D3，并基于svg绘制图形和悬停线，您可以添加其他图形组件进行交互，例如滑块选择子区间放大，更改标签等。

以此为例进行开发： http://mpf.vis.ywng.cloudbees.net/

（你可以拖动黄色栏，点击图例;对于源代码，点击github上的fork me）