无法使用Sigma.js显示任何图形
我想在web界面上可视化一个大的网络图。经过几天的搜索，我决定使用Sigma.js，因为它看起来很简单，而且与HTML5兼容。
问题是我无法显示Sigma.js网页上的任何图形示例，即使我使用作者在Sigma.js主页上拥有的最少代码。我甚至复制粘贴了整个网页，用鼠标右键点击查看代码，但都是徒劳的(like this)。我已经将所有必要的文件粘贴到了这个简单的.html文件所在的文件夹中(css文件、js文件，甚至是示例所需的.gexf文件)，但是我只得到了一个带有黑色矩形的页面，除此之外什么也没有。不会显示该图形。我做错了什么？
我是否需要像作者在GitHub库的代码存储库中提到的那样，首先构建sigma.js文件？我需要这个工具来可视化图形(我将为图形动态提供数据)，但我甚至不能用一些简单的代码进行实验！我甚至跟随that "guide"做了每一步，但是我不能做任何事情。
Webstudio: Microsoft Expression Web4和OS: Windows8Pro(我尝试在IE10、FF17和Chrome23中打开网页)。
回答 4
Stack Overflow用户
发布于 2013-03-05 23:40:25
你想要你的图表的div必须是absolute定位的。我认为这是一个画布问题。
所以html
<!DOCTYPE html>
<html>
<head>
<script src="http://sigmajs.org/js/sigma.min.js"></script>
<script src="/js/sigmatest.js"></script>
<link rel="stylesheet" href="/css/sigma.css">
</head>
<body>
<div id="sigma-parent">
<div id="sigma-example">
</div>
</div>
</body>
</html>css
#sigma-parent {
width: 500px;
height: 500px;
position: relative;
}
#sigma-example {
position: absolute;
width: 100%;
height: 100%;
}sigmatest.js中的js
function init() {
var sigRoot = document.getElementById('sigma-example');
var sigInst = sigma.init(sigRoot);
sigInst.addNode('hello',{
label: 'Hello',
x: 10,
y: 10,
size: 5,
color: '#ff0000'
}).addNode('world',{
label: 'World !',
x: 20,
y: 20,
size: 3,
color: '#00ff00'
}).addEdge('hello_world','hello','world').draw();
}
if (document.addEventListener) {
document.addEventListener('DOMContentLoaded', init, false);
} else {
window.onload = init;
}Stack Overflow用户
发布于 2019-03-20 18:51:30
这可能不会帮助那么多人，但在我的例子中，原因很简单，我没有为每个节点指定x或y属性。我试图使用forceAtlas2算法自动“放置”我的节点，而没有意识到它们必须先绘制在某个位置，然后才能应用布局。
Stack Overflow用户
发布于 2012-12-10 14:54:51
确保您已经下载了此文件http://sigmajs.org/data/arctic.gexf，并在代码中正确引用了路径
https://stackoverflow.com/questions/13611443
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号