Make node spacing change dynamically in vis.js

Question

I am trying to visualize some graphs. Unfortunately I often get situation when one node overlaps another, as shown below:

Setting nodeSpacing option doesn't fit me because some node labels are extremely long and some are short. Is there any option setting dynamical positioning? Here are my options:

    var options = {
         layout:{
             hierarchical: {
                 enabled:true,
                 parentCentralization: true,
                 direction: 'DU',
                 sortMethod: 'directed'
                }
         },
         edges:{
             arrows: 'from'
         }
 }

Answer 1

在Physics选项中hierarchicalRepulsion，您可以使用一个选项-我猜这全取决于您的图形。我以他们的分层布局的基本示例为例，并添加了很长的标签名称并使用了以下配置：

physics: {
    enabled: true,
    hierarchicalRepulsion: {
        centralGravity: 0.0,
        springLength: 500,
        springConstant: 0.01,
        nodeDistance: 400,
        damping: 0.09
    },
    solver: 'hierarchicalRepulsion'
}

我打得四处大型值springLength和nodeDistance，这是那种你可以拿回的事情：

放大更多，因此您可以看到标题：

虽然在层次结构的下方仍然存在一些重叠-但这为您提供了一个起点。

另外，请考虑长字幕的可用性-在某些时候，您可能想开始使用工具提示和其他解决方法。再次-所有取决于您的网络。

祝您好运-这是一个很棒的图书馆！