标签: vis.js-network

如何使用angularjs在visjs中添加缩放按钮?

需要帮助在使用angularjs的visjs网络图中放大和缩小按钮,我找不到任何相关的选项.请帮助,我也提供一个plunker链接作为例子

<vis-network data="data" options="options" height="100%"></vis-network>

$scope.options = {
  autoResize: true,
  height: '800',
  width: '100%'
};
Run Code Online (Sandbox Code Playgroud)

javascript angularjs angularjs-directive vis.js vis.js-network

3
推荐指数
1
解决办法
4000
查看次数

有什么方法可以强制所有带有标签的 Visjs 节点大小相同?

我一直在试验 Visjs.org 库,以使用网络布局构建图形的可视化表示。我想创建一个在节点内有标签的图(我使用圆圈作为节点),所有节点的大小都相同。

我可以让图形出现并且标签确实在节点内。但是,节点始终缩放到标签文本的大小。所以更长的标签=更大的节点。

对于用户来说,这不是我想要的,这似乎暗示了对更大节点的一些意想不到的重要性。我曾尝试使用缩放选项,但无济于事。我可以通过将标签放在节点之外来解决问题,但这不是我想要的。

我想要做的是强制所有节点的大小相同,并且标签仍然在节点内。我附上了我的示例程序。

<html>
<head>
    <script type="text/javascript" src="http://visjs.org/dist/vis.js"></script>
    <link href="http://visjs.org/dist/vis.css" rel="stylesheet" type="text/css" />

    <style type="text/css">
        #mynetwork {
            width: 600px;
            height: 400px;
            border: 1px solid lightgray;
        }
    </style>
</head>
<body>
<div id="mynetwork"></div>

<script type="text/javascript">
    // create an array with nodes
    var nodes = new vis.DataSet([
        {id: 1, label: 'Fred'},
        {id: 2, label: 'Bill'},
        {id: 3, label: 'Texas'},
        {id: 4, label: 'North\nCarolina'},
        {id: 5, label: 'Planes'},
        {id: 6, label: 'Books'}
    ]);

    // create an array with edges
    var edges …
Run Code Online (Sandbox Code Playgroud)

html javascript graph vis.js vis.js-network

3
推荐指数
2
解决办法
5041
查看次数

如何在vis.js中隐藏图形的分支?

我可以通过单击1205具有以下内容的节点在 vis.js 中显示部分图形,但无法弄清楚如何在第二次单击同一节点时使展开的部分消失?

var nodes = new vis.DataSet([
  {id: 2696, label: "l"}, 
  {id: 1205, label: "l"}, 
  {id: 2697, label: "l"}
]);

var edges = new vis.DataSet([
  {from: 2696, to: 2697}, 
  {from: 2696, to: 1205}
]);

var container = document.getElementById('mynetwork');
var data = {
  nodes: nodes,
  edges: edges
};

var network = new vis.Network(container, data, {});
network.on("click", function(e) {
  tw_id = 1205;
  if (e.nodes[0] == tw_id) {
    sel_id = e.nodes[0];
    var node = nodes.get(e.nodes[0]);
    nodes.add([
      {id: 2021, label: "l"}, …
Run Code Online (Sandbox Code Playgroud)

javascript expand collapse vis.js vis.js-network

3
推荐指数
1
解决办法
6132
查看次数

调整vis js中具有标签的节点的大小,例如Circle,Box

如何在可带有标签的vis js中设置形状的大小?例如

代码1:

    shape: 'circle',
    color: {
        border: 'black',
        background: 'white'
    },
    borderWidth: 1,
    borderWidthSelected: 2,
Run Code Online (Sandbox Code Playgroud)

在上面的Code1中,如果标签中没有任何可放入形状圆的内容,那么我如何增加/减小相同大小的纸张。
如果形状是要在外面放标签的任何东西,我们可以增加和减少图标的大小。例如

代码2:

    shape: 'icon',
    icon: {
        face: 'FontAwesome',
        code: '\uf1db',
        size: 100,
        color: '#000000'
    }
Run Code Online (Sandbox Code Playgroud)

如以上代码2所示,图标“大小”选项可用。
有没有办法在Code1中使用'size'选项?

javascript font-awesome vis.js vis.js-network

3
推荐指数
1
解决办法
1036
查看次数

Vis.js - 获取节点的子节点

我在 Vis.js 中创建了一个分层有向图。现在,我想从给定节点中提取父节点。我该怎么做呢?我在文档中找不到允许我执行此操作的方法。

children graph vis.js vis.js-network

3
推荐指数
1
解决办法
2152
查看次数

如何限制vis.js网络的缩放?

我已经使用vis.js实现了一个简单的网络。这是我的代码:

//create an array of nodes
var nodes = [
    {
        id: "1",
        label: "item1"
    },
    {
        id: "2",
        label: "item2"
    },
    {
        id: "3",
        label: "item3"
    },
];

// create an array with edges
var edges = [
    {
        from: "1",
        to: "2",
        label: "relation-1",
        arrows: "from"
    },
    {
        from: "1",
        to: "3",
        label: "relation-2",
        arrows: "to"
    },
];

// create a network
var container = document.getElementById('mynetwork');

// provide the data in the vis format
var data = { …
Run Code Online (Sandbox Code Playgroud)

javascript vis.js vis.js-network

3
推荐指数
3
解决办法
1237
查看次数

在 vis js 网络中设置默认比例

我正在使用 vis.js 库来创建网络拓扑。在我使用以下方法创建网络后:

network = new vis.Network(container, data, options);
Run Code Online (Sandbox Code Playgroud)

其中容器是canvas我正在绘制的。

数据 :

{
    nodes: Nodes,
    edges: Edges
};
Run Code Online (Sandbox Code Playgroud)

选项 :

{ 
    autoResize: true,
    nodes: {
        shape: 'image',
        size:  25,
        font: {
            size: 16,
            color: 'darkbrown'
        },
        borderWidth: 0,
        shadow: true
    },
    edges: {
        smooth: {
            forceDirection: "none"
        }
    },
    physics: {
        forceAtlas2Based: {
            springLength: 80,
            springConstant: 0.27
        },
        minVelocity: 0.75,
        solver: "forceAtlas2Based",
        timestep: 0.34
    },
    layout: {
        randomSeed: undefined
    },
    interaction: {
        hover: true
    }
}
Run Code Online (Sandbox Code Playgroud)

绘制后,默认比例(1)相对于我的画布非常大。我想调整比例。我试过这种方式:

network …
Run Code Online (Sandbox Code Playgroud)

javascript canvas vis.js vis.js-network

1
推荐指数
1
解决办法
4309
查看次数

添加边缘而不使用工具栏 visJs

Vis.js提供了一个工具栏,可以通过单击工具栏上的按钮来添加节点和边。
我想要一种方法,以便我可以在拖放节点上添加彼此的边缘。
我已经搜索过,但没有找到任何关于如何在单击一个节点时创建边缘并拖动到其他节点上以在它们之间创建边缘而不使用他们在此处提供的工具栏的实际示例。

谢谢

javascript jquery vis.js vis.js-network

1
推荐指数
1
解决办法
1226
查看次数

如何在vis.js中用我自己的替换操作GUI

我的问题是关于 vis.js 中的默认操作用户界面:

默认图形用户界面的图像

我想用我自己的控件替换 vis.js 中现有的操作用户界面,这样我就可以右键单击网络来添加或删除节点和边。

我可以从这个 issue中看到,在 2014 年这是不可能的,但有可能将某些东西一起破解(尽管那里的链接不再有效)。我希望在过去的 5 年里,这已经成为可能,而无需分叉该项目。

问题
是否可以禁用现有的用户界面并连接我自己的控件?

user-interface vis.js vis.js-network

1
推荐指数
1
解决办法
565
查看次数