javascript - 如何访问 raphael 创建的纸质对象？

Question

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

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

Answer 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 元素之间的连接；大多数鼠标悬停功能停止工作。