标签: vis.js-network

我正在尝试绘制一个vis.js网络图,并且可以加载和定位节点.然后,我希望禁用物理,以便用户可以移动节点.我试过这个,但它没有用.

var options = {

    nodes: {
      borderWidth:4,
      size:60,
      color: {
        border: '#222222',
        background: 'grey'
      },
      font:{color:'black'}
    },
    edges: {
      arrows: {
        to:     {enabled: false, scaleFactor:1},
        middle: {enabled: false, scaleFactor:1},
        from:   {enabled: false, scaleFactor:1}
      },
      color: 'black'
    },

    { physics: enabled: false; };

有没有人这样做过？如果是这样,你能提供一个例子或建议,以达到最佳方法.我也阅读了这里的解释,但对java不太熟悉,我无法想出步骤.

谢谢

我有节点和边缘的网络图,并希望在点击后获取节点数据.我现在有

var network = new vis.Network(container, data, options);
network.on( 'click', function(properties) {
    console.log('clicked node ' + properties.nodes);
});

但这只是给了我一些内部身份[105].有没有办法获取与节点关联的实际数据.

如何在vis.js中设置节点的位置？

我想最初手动定位至少一个节点.

我知道节点有x和y选项.我设置了两个,并尝试了各种布局选项(randomSeed,ImprovedLayout,hierarchical),节点从未放置在我设置的位置.

这是我定义的简单网络:

  nodes = new vis.DataSet([
    {id: 1,  shape: 'circularImage', image: DIR + '1_circle', label:"1", x: 200, y: 100},
    {id: 2,  shape: 'circularImage', image: DIR + '2_circle', label:"2"},
    {id: 3,  shape: 'circularImage', image: DIR + '3_circle', label:"3"},
  ]);

  edges = [
    {id: "01-03", from: 1, to: 3, length: 300, label: '1 - 3'},
    {id: "02-03", from: 2, to: 3},
  ];

  var container = document.getElementById('graphcontainer');
  var data …

我正在使用vis.js来显示节点,并非所有节点都相互连接,但它们是重叠的,如图所示,有没有办法选择避免这种情况,我经历了配置选项但是不能找.

I have a vis.js network graph that contains multiple edges between nodes and I am trying to have it setup with a hierarchical layout as well. If I do a normal graph without the hierarchical layout options then multiple lines are shown between nodes, however, once I turn on/place in the hierarchical layout option only one line is drawn.

Below are two plunkers showing what I mean:

https://plnkr.co/edit/c8SuBc0XjDZnn6im2vdg (Plunker with hierarchical layout off)

var options = { 
    height: '400px', 
    edges: …

我正在使用 Visjs 并用文本显示矩形节点。一些节点可以有几行文本，所以我添加了一个启发式算法来粗略地计算出换行符应该去的位置，以避免在非常宽但非常短的节点中出现非常宽的单行文本块。

问题是，即使打开了物理，我仍然会得到重叠的节点。

是否可以告诉布局引擎，在任何情况下（或物理模型），任何两个节点都不应重叠？

我正在使用 vis.js 构建一个故事可视化工具，一个关键功能是允许作者通过拖动手动定位节点。通常还存在具有相同起始节点和目标节点的多条边。如果没有物理原理，这些边缘就会重叠。

目前，为了避免边缘重叠，每当创建新边缘时，我都会在一小段时间内启用物理功能，以消除彼此之间的任何重叠边缘。理想情况下，我会让物理始终禁用并且边缘不会重叠，但我认为这是不可能的。

对于如何应用 vis 物理，以便在节点拖动时禁用它、快速稳定并防止边缘重叠，是否有任何建议？

I have a fairly simple hierarchical structure of nodes, but when vis.js draws them, the order of nodes on each level doesn't make much sense - there are a lot of crossed edges (screenshot: Default Layout )

I am hoping to get a layout similar to that given here: Expected Layout

My vis.js options are as follows;

{
    "layout": {
        "hierarchical": {
            "direction": "LR",
            "sortMethod": "directed",
            "nodeSpacing": 200,
            "treeSpacing": 400
        }
    },
    "edges": {
        "smooth": {
            "type": "continuous"
        }
    }, …

我的目的是使用 vis.js 创建简单的图形编辑器，我想到的第一个功能是手动定位节点并保存它。然而，与设置选项不同，似乎不存在获取所有选项的直接方法。dragEnd是否有任何合理的方法来获取它们（除了尝试使用听起来太脆弱的事件来跟踪所有更改之外）？

事实上，我正在寻找一种方法来提取数据（节点/边及其设置）和选项，以便一旦使用这些选项渲染网络，它看起来与保存的内容相同（或至少相似）。

我有一个由 vis.js 创建的大型网络图，它在浏览器中是 100% 宽并且非常高，因此需要向下滚动页面才能看到全部内容 - 我希望我的页面像世界上大多数其他网页一样运行 - 但是当我滚动时，vis.js 会缩放，而不是滚动页面。如何关闭滚动缩放，但仍允许捏合（或按住按键 + 滚动）？

当然，我可以使用此选项关闭缩放 - 并添加一些内置缩放按钮：

var options = {
  interaction: {
    zoomView: false,
    navigationButtons: true,
  }
};

但这并不理想。它要求用户滚动到页面底部才能访问缩放控件。另外，我想要一个更易于访问的缩放功能（是的，我知道，我刚刚关闭了更易于访问的缩放功能）。可见时间线图似乎比网络图有更多的缩放方法。

总结一下：我希望对图表禁用鼠标滚轮/触控板滚动，从而提供自然的整个页面滚动行为，再加上捏合（或按住按键+滚动）进行缩放。