javascript - 如何更改 cytoscape.js 中叠加层的形状和 z 索引？

Question

我想要一个不在标签上方的覆盖层，并且其形状与其所在的节点相同。我如何扩展 cytoscape.js 或重用现有功能来实现此目的？

我尝试使用边框来实现此结果，但我不喜欢的是边框进入形状内部，正如您在附图中看到的那样。

Answer 1

边框是 Canvas 中的笔划。这就是 API 在浏览器中的工作方式，并且该 API 用于创建 Cy.js 可视化。

通过裁剪在节点主体之前绘制边框可以使边框不那么像笔划，但这会带来高昂的费用 - 当许多用户需要高性能图形时，这是 Not Acceptable 。半透明边框在美观和性能方面是一个很好的折衷方案。

关于覆盖:不，不可能以通用方式做到这一点。对于某些形状，将节点主体形状绘制为覆盖层但尺寸较大就足够了 - 但这不适用于诸如三 Angular 形之类的形状。

如果我是你，我会选择半透明边框——至少现在是这样。或者，您可以使用较小的覆盖层，以便更紧密地配合。

如果您确实需要，我可以为您指出要修改的代码的方向。

编辑:或者(新的)border-z-order 样式属性或类似属性可能适合您？如果您的节点是不透明的，则后面的边框不需要剪切...