如何访问由 raphael 创建的纸质对象？答案

【问题标题】：How can I access the paper object created by raphael?如何访问由 raphael 创建的纸质对象？
【发布时间】：2016-04-12 13:28:50
【问题描述】：

我正在为一些系统发育分析制作 HTML 显示。我创建了一个 div，有一个名为jsPhyloSVG 的可爱 javascript 包，它在该 div 中为我画了一棵漂亮的树。该包使用 raphael 进行绘图，但它没有返回 raphael paper 对象。我想使用 raphael 为这张图片添加一些内容，但我不知道怎么做，因为我没有对 paper 对象的引用。我可以访问 raphael 生成的 svg，但有什么方法可以向后查找paper？

如果这不起作用，我总是可以使用 jquery 直接将圆形或路径对象添加到 svg 中，对吗？

【问题讨论】：

我不确定您是否可以使用 Raph 重用另一个元素使用的 svg/paper，因为它不支持所有 svg 元素。如果需要，您当然可以使用 Raphs 的妹妹 Snap.svg 来实现，它具有许多相同的功能。在那里你会使用 Snap('#myElementId')

标签： javascript svg raphael

【解决方案1】：

好吧，经过一天的大部分时间，我的头撞到了墙上，我已经解决了我的问题。事实证明，如果您可以找到对对象本身的引用，您可以重用由其他库创建的 paper 对象。对于其他使用 jsPhyloSVG 的人，可以通过以下方式找到：

var dataObject = {phyloxml: tree_data};
var phylocanvas = new Smits.PhyloCanvas(
  dataObject,
  'svgCanvas',
  1000, 1000,
  'circular'
);
var paper = phylocanvas.getSvg().svg;

然后您可以照常进行：paper.circle(100, 100, 15);。

我认为 Ian 的意思是，您不能重用由 raphael 创建的 svg。我总是可以访问那个元素，但是使用 jQuery 来附加圆形元素不起作用。

它们会显示在检查面板的 svg 对象中，但不会显示在屏幕上。在另一个问题here 中讨论了一些解决方法，它们大多对我有用。然而，他们打破了 raphael 对象和屏幕上的 svg 元素之间的联系；大多数鼠标悬停功能停止工作。

【讨论】：