web-dev-qa-db-ja.com

接続されたノードが他のエッジまたはノードとオーバーラップしている

Vis.jsを使用してノードを表示していますが、すべてのノードが相互に接続されているわけではありませんが、図に示すように重複しています。これを回避するオプションはありますか？構成オプションを実行しましたが、できませんでした見つける。

enter image description here

vis.jsvis.js-network
11
Noor

物理とレイアウトには手動構成を使用することをお勧めします。

configure: {
  enabled: true,
  filter: 'physics, layout',
  showButton: true
}

で遊んでみてください nodeDistance そして nodeSpacing。

1
Andrej Hucko

BarnesHutのようないくつかの物理学には属性avoidOverlap = [0,1]があります http://visjs.org/docs/network/physics.html?#

下部の物理学の下で試してみることができます http://visjs.org/examples/network/other/configuration.html

この属性を物理オプションに追加するようなものです

var options = {
 ... "physics": {
    "barnesHut": {
      "avoidOverlap": 1
    },
  }
}
9
Reiner

configureオプションを使用して、なんとか機能させることができました。

configure: {
        enabled: true,
        showButton: true
}

これは、グラフがきれいに見えるまですべてのオプションを構成するためのモーダルを示しています。

階層ビューの場合、物理演算を無効にして、次のようにレイアウトを設定する必要がありました。

layout: {
  hierarchical: {
    enabled: true,
    nodeSpacing: 425,
    blockShifting: false,
    edgeMinimization: false,
    sortMethod: "directed"
  }
}
4
Christian Vielma

私はこれについて多くのオプションを試しましたが、実際には物理構成に依存することがわかりました。物理構成がこのような場合

物理：falseの場合、次のレイアウトのみを使用できます：{階層：{levelSeparation：150、treeSpacing：200、blockShifting：true、edgeMinimization：true、parentCentralization：true、direction： 'UD'、nodeSpacing：300、sortMethod： "directed "// directed、hubsize}}、

NodeSpacingがキーであり、sordメソッドが構造を定義する場合これは次のようなネットワークを構成します： enter image description here

それ以外の場合は、手動構成を使用します。

configure：{enabled：true、filter： 'physics、layout'、showButton：true}

0
Gru