cytoscapejs-在节点体中嵌入html

cytoscapejs - embed html inside node body

本文关键字：html 节点 cytoscapejs-      更新时间：2023-09-26

这可能是一个愚蠢的问题，但有可能将html放在cytoscape js节点中吗？我看过文档，它建议可以在节点中放置一个图像，但没有提到html。理想情况下，这样我就可以有一组图像以及浮动在图像上方的工具提示。提前谢谢。Joe

不能将HTML内容与画布混合，画布是Cytoscape.js使用的底层渲染技术。您可以使用SVG图像，并且SVG与HTMLDOM非常相似，可以使用JS库进行操作——尽管SVG中的布局大多是手动的。

选项：

（1） 使用SVG。您可以获取SVG内容，URL对其进行编码（使用encodeURI()），并将其用作背景图像，例如：

data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="10px" height="7px"><g><g><polygon points="8.433,-0.06 4.985,3.325 1.539,-0.06 -0.066,1.546 4.985,6.566 10.037,1.546" fill="%2361B23B"/></g></g></svg>

您将需要data:image/svg+xml;utf8,前缀，如示例中所示。

（2） 构建一个扩展，在每个节点的顶部放置一个div。您必须在扩展中进行一些组织，以将div位置与节点等同步。

相关文章：