VIS JS:无法使网络适合引导面板

时间:2018-11-15 02:11:00

标签: javascript html5 bootstrap-4 jinja2 vis.js

我正在与vis.JS合作,从一些数据创建网络图。然后,我在引导面板中填充此网络。问题是网络很小。我没有任何意义。另外,如果放大,则会丢失所有数据透视图。

enter image description here

这是代码段

网络出现的div

<div class="row">
<div class="panel panel-primary" >
    <div class="panel-heading">Heading</div>
    <div class="panel-body">
        <div id="network" width=100% height=100%></div>
    </div>
</div>
</div>

这是JavaScript。请注意,我的数据是通过Jinja来自服务器的

<script type="text/javascript">
// create an array with nodes
var mynodes = new vis.DataSet({{ mynodes | safe }});

// create an array with edges
var myedges = new vis.DataSet({{ myedges |safe }});

// create a network
var container = document.getElementById('network');
var data = {
    nodes: mynodes,
    edges: myedges
};
var options = {
    autoResize: true,
    width: '100%',
    height: '100%'
};
var network = new vis.Network(container, data, options);
</script>

如何设置显示的网络的大小?理想情况下,我想调整网络的大小,以便节点和边缘清晰可见。

我想念什么?是否由于引导程序而无法正确调整网络大小?

1 个答案:

答案 0 :(得分:0)

找到解决方案

var options = {
              width: '1000px',
              height: '600px'
              };