为cytoscape.js中的不同节点设置不同的形状

Question

我有以下字段作为我的节点数据：

nodes {
    data: {id: "something",     type: "human"}
    data: {id: "somethingElse", type: "mouse"}
}

有没有办法根据type中的data来设置节点的形状？

Answer 1

您可以构建cytoscape样式元素和选择器，如下面的代码片段所示：

style: [
  {
    selector: 'node[type="human"]',
    style: {
      'shape': 'triangle',
      'background-color': 'red'
    }
  },
  {
    selector: 'node[type="mouse"]',
    style: {
      'shape': 'square',
      'background-color': 'blue'
    }
  }
]

Answer 2

使用stylesheet selectors，例如：

node[type = 'foo'] {
  background-color: red;
  shape: star;
  /* ... */
}