如何使用JSNetworkX在实际Node之外获取标签?

时间:2019-01-01 19:08:06

标签: javascript jsnetworkx

我刚刚从可视化纯D3.js中的“力反馈图”转移到了惊人的图分析库JSNetworkX(NetworkX的JavaScript端口)。现在我知道JSNetworkX在后台使用D3.js进行可视化,但是我无法解决如何在实际Node的外部显示标签。我的意思是,我可以得到Edge标签,但这是另一回事。在D3.js中,您必须使用实际的SVG Text元素,但这似乎都被抽象了。

http://jsnetworkx.org/

我尝试使用所有不同的标签属性,但最后还是没有标签或在节点中间出现爆炸的标签。

我找到了一个线程,该线程似乎引用了较旧的版本,但即使更改语法也不起作用。

https://github.com/fkling/JSNetworkX/issues/16

我真的很希望能够可视化节点外部的标签,因为节点内部看起来就像是一团糟。

请帮助!哦,请参考最新版本(0.34),因为先前的答案是指旧的折旧版本。

1 个答案:

答案 0 :(得分:0)

好的,所以回答我自己的问题...

基本上,它看起来只有两个标签:节点标签;和边缘标签。边缘标签似乎是沿着链接呈现的,并且是可配置的,

只有一个节点标签,尽管它是一个单独的SVG文本元素,但您似乎对其没有足够的控制权。使用标签样式,最好的方法是使用CSS文本对齐属性(“ text-anchor”:“ middle”,“ dominant-baseline”:“ text-after-edge”)将其放置在节点的顶部然后将节点半径缩小到5。这基本上和我可以在传统D3图形上获得的位置非常接近,在传统D3图形中,您可以完全控制标签的位置。

对是否有更好的方法仍然很感兴趣,但希望这对人们有所帮助。