Python pyvis绘制有向图增大边尺寸后箭头显示异常如何解决

问题表现 #

使用Python pyvis库绘制有向图，调大边尺寸后箭头显示异常：边的线条延伸到箭头尖端外侧，无法和终点节点对齐。
异常效果参考：粗边箭头错位截图
预期效果：箭头尖端与边的终点精准对齐，无边线溢出箭头的情况。
复现代码：

from pyvis.network import Network

nt = Network(directed=True)
nt.add_node('A',
           size=20,
           color='#ACDBC9',
           borderWidth=0,
           font='30px arial black')
nt.add_node('B',
           size=20,
           color='#ACDBC9',
           borderWidth=0,
           font='30px arial black')
nt.add_edge("A", to="B",
            value=20, color='rgb(247, 167, 166)',
            arrowStrikethrough=True)
nt.set_edge_smooth('curvedCW')
nt.toggle_physics(False)
nt.show('img.html')

根因 #

pyvis底层基于vis.js做渲染，默认箭头尺寸不会随边的宽度（由value参数控制）自动适配。当边宽超过默认箭头的适配阈值时，就会出现边线穿出箭头的错位问题。代码中设置的arrowStrikethrough参数仅控制箭头是否穿透终点节点，不负责调整箭头和边线的相对尺寸、位置。

修复方法 #

添加边时手动传入arrows配置，指定箭头的缩放系数，让箭头尺寸和边宽匹配即可，修改后的边配置示例：

nt.add_edge("A", to="B",
            value=20, color='rgb(247, 167, 166)',
            arrowStrikethrough=False,
            arrows={
                "to": {
                    "enabled": True,
                    "scaleFactor": 1.2
                }
            })

参数调整说明 #

• arrowStrikethrough设为False，避免箭头嵌入终点节点内部
• scaleFactor为箭头缩放比例，当前value=20的边宽设置1.2即可实现对齐；如果后续使用更粗的边，对应调大该数值即可
• 若需要给全量边统一配置，初始化网络后遍历nt.edges批量设置属性即可，无需逐个加边时重复编写配置。

内容的提问来源于stack exchange，提问作者Chiara