javascript - 显示 cytoscape.js 中节点之间的关系类型

Question

我正在寻找一种软件，它允许我通过自动绘图和用户交互来绘制实体之间的关系。我看过 cytoscape.js，它似乎是一个非常好的选择，但我想知道使用这个软件是否可以可视化关系的名称。

该示例的目的是绘制两个人并显示他们的关系，例如，他们是兄弟。

Person1 ====== brother =====> Person2

我需要修改代码来执行此操作吗？

Answer 1

You don't need to modify the code. This functionality is already built in. You will need to know how to use the mappers and cytoscape stylesheet definitions.

If you take a look at the source of the demo that they used here, you'll see that when you're defining the cytoscape css style, you need to set the content attribute which you could then use the mappers and specify which attribute in the node/edge data you'd like to display. This is already done with the id attribute for nodes as follows:

style: cytoscape.stylesheet()
  .selector("node")
        .css({
            "content": "data(id)",
            "shape": "data(shape)",
            "border-width": 3,
            "background-color": "#DDD",
            "border-color": "#555",
        })

You can do the exact same for edges Hope this helps.