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

时间:2016-10-16 11:51:44

标签: javascript node.js html5 canvas cytoscape.js

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

我想我应该听一下选择

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

  // draw icon on the canvas
})

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

2 个答案:

答案 0 :(得分:0)

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

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

答案 1 :(得分:0)

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

Preview

如果您有兴趣,请查看readme