选择 Raphael.js 将路径映射到 Qtip 工具提示答案

【问题标题】：selecting Raphael.js map path to Qtip tooltip选择 Raphael.js 将路径映射到 Qtip 工具提示
【发布时间】：2012-08-01 20:17:16
【问题描述】：

我只是想选择国家路径来触发工具提示。我怀疑我指的不是 svg 文件中的准确元素。

<script>
$(document).ready(function()
{
$('worldmap.shapes.US').qtip({ content: { text: 'Name: United States<br>Capital: Jefferson City'    },
        style: {
            background: '#000000',
            color: '#ffffff',
            border: { width: 6, radius: 3, color: '#ff0000' }
        },
        position: {
            corner: {
                target: 'topRight',
                tooltip: 'bottomLeft'
            }
        }
    });

});

svg 文件的格式如下：

  worldmap = {
  shapes: {
 AE:     "M604.196,161.643l0.514-0.129l0,0.772l2.188-0.386l2.189,0l1.672,0.129l1.803-1.802l2.058-1.802l1.674-1.673l0.518,0.900l0.385,2.189l-1.417,0l-0.258,1.802l0.517,0.386l-1.159,0.515l-0.129,1.029l-0.773,1.159l0,1.030l-0.514,0.644l-8.110-1.416l-1.031-2.704l0.127,0.643z",

这是一个 .js 文件

谢谢！

【问题讨论】：

标签： jquery-selectors svg raphael qtip tooltip

【解决方案1】：

我不太明白您是如何绘制 raphael.js 路径的。如果你正在做这样的事情：

my_path = paper.path("M 100,200 L ... z");

您不必在 raphael 路径对象 (my_path) 上使用 .node() 方法。这为您提供了对 DOM 对象的引用，您可以使用它。

$(my_path.node).qtip({ ... })

参见例如http://www.itbrigadeinc.com/post/2012/05/03/Tooltips-in-Raphael.aspx

【讨论】：