在cytoscape.js的画布上绘制图标

Question

我正在使用cytoscape.js。我想在选定节点旁边绘制一个小删除图标，但我不知道如何使用API在画布上绘图。

我想我应该听一下选择

cy.on('select', '*', function (event) {
  const element = event.cyTarget;

  // draw icon on the canvas
})

图书馆有很多extensions，所以我知道可以在画布上画画。

Answer 1

您可以在Cytoscape div中添加一个新画布 - 将其放在图表的顶部。这与扩展使用的方法相同。

（你不应该修改属于Cytoscape的画布，因为它几乎肯定会产生问题。）

Answer 2

按照@ maxkfranz（Cytoscape dev）推荐，我开发了一个名为cytoscape-canvas的轻量级Cytoscape.js扩展，它在图形上方和/或下方创建了一个画布。有了它，创建删除图标变得非常容易。我做了类似的通知徽章：

如果您有兴趣，请查看readme！