如何在Raphael生成的SVG上进行工具提示
我正在做一些教学练习，用XSLT，Javascript和Raphael将XML转换为SVG。 我确信这是艰难的方式……但它具有教育意义。
我遇到的问题是创建工具提示。 到目前为止，我已经找到了三种方法：
- 第一种方法是在对象上使用
.attr({title: "blah"{)。 这是有效的，但拉斐尔并没有正式支持，我想在工具提示中加入的内容可能有点长，这是人们操作系统在人们读完之前超出工具提示的问题。 - 我找到的第二种方法就是这里的function。 当有鼠标hover时，它可以正常弹出拉斐尔对象，但是，据我所知，弹出一个看起来很正常的工具提示是不可能的。
- 使用jquery Tooltip插件 。 这似乎不起作用。 我无法让Raphael将title属性添加到对象中并选择该标题。 不知道为什么。
所以，我想知道的是，向Raphael对象添加工具提示是一种简单可靠的方法，以便当人们将鼠标hover在对象上时弹出它们，并在鼠标输出时（但不是之前）消失？
一种方法是在Raphael纸上使用div标签。 然后使用Jquery mousevents以及fadeIn（）和fadeOut（）。 我在jsFiddle上创建了一个例子。 看一看
如果您使用[title]属性，它将使用链接包装元素，以便轻松使用qtip等工具提示插件。
var R = Raphael('canvas', 100, 100); R.path(path).attr({ title: 'Fancy tooltip' }); $('#canvas a').qtip();
万一有人会寻求一个工具提示超过g Rapahel图表的例子（我想它也可以很容易地与普通的Rapahel一起使用）我做了一个使用动态创建的div（ 因此不需要第三部分工具提示插件 ）作为tooltop over饼形图
带工具提示的交互式饼图
它使用ramel的mousemove和mouseout …
顺便说一句，我使用图例作为工具提示的来源 – 当然它不是必须的，可以被任何其他文本替换（只需用其他文本替换this.label[1].attrs.text ）
我使用qtip添加工具提示：