在Cytoscape.js中顯示邊緣頂部的內容

Question

在我的圖中，每個節點都將代表一個狀態，並允許這些狀態之間的邊緣轉換。我也允許在那裏有一個行爲，當一個狀態從一個狀態轉換到另一個狀態時，所以這些行爲被附加到這兩個狀態之間的邊界。我試圖找出一種方法來形象化這些行動的邊緣。看起來我唯一能做的就是使用造型的content。我曾希望我可以將content設置爲允許我返回一些html內容的功能，但這似乎不起作用。有另外一種方法可以做到這一點嗎？我也曾想過可能在狀態節點之間創建節點，但只有一個集合，這些新節點將與實際節點混合並使事情複雜化。我也在使用上下文菜單，所以我可以從邊上彈出「查看操作」，但我仍然需要一種方法來直觀地顯示邊上存在的操作。如果任何人有想法如何形象化，請讓我知道！

謝謝！

Answer 1

HTML內容無法在畫布內呈現。標籤僅使用context.fillText()繪製。

如果要顯示HTML內容，則需要將該內容放入頁面的HTML中。您可以創建一個Cytoscape.js擴展，以使代碼更簡單或更簡潔，但組織完全是您的選擇。

我會創建一個擴展，它使用Cytoscape.js畫布上的div來呈現HTML標籤。您可以將這些職位與viewport事件同步。如果採取這種方法，你可能要統籌與約翰WEHR，誰已經開始擴展能夠做到這一點：https://github.com/wehriam/cytoscape-css-renderer

這種討論也可能是你的興趣：https://github.com/cytoscape/cytoscape.js/issues/305