javascript - Raphael 动画上的工具提示 - 为什么它不起作用？

Question

所以我有一个用 Raphael 绘制的饼图，我试图创建一个工具提示，当我将鼠标悬停在饼图的一部分上时，它会显示 Raphael 文本。事件处理程序悬停工作正常，但我无法更改工具提示文本的坐标以匹配光标坐标。请在此处查看代码:

http://jsfiddle.net/p7U2K/1/

我试过了

posx = e.pageX - $(document).scrollLeft() - $('#holder').offset().left;

对于我的 x 坐标，但它返回时未定义。我做错了什么？

感谢您的帮助!

Answer 1

我可以指出您做错的几件事:

• e 未定义，因为您没有将它传递给 .hover 回调

• $ 也是未定义的，因为您没有在脚本中加载 jquery。但你不需要它。您可以使用 e.offsetX 为您提供相对于父元素的位置。你不需要那些滚动偏移量:

  posx = e.offsetX;

• 由于动画功能，您在绘制标签后立即将其隐藏

• 您正在为每个悬停事件创建一个新标签。这会立即用元素阻塞您的 Canvas (即使您通过 opacity 隐藏了它们)。看看这个，看看我的意思: http://jsfiddle.net/mihaifm/wdzPG/5/