Sigma.js的Javascript帮助
Sigma.js的Javascript帮助
提问于 2014-01-02 06:17:15
我在试着用Sigma.js。我真的不是一个使用Javascript的人，但是我甚至连最基本的东西都做不到。
在开发者控制台中，我得到了以下信息-
Use of getPreventDefault() is deprecated. Use defaultPrevented instead.是这导致了我的问题，还是我的HTML/ Javascript出了什么问题？
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>The HTML5 Herald</title>
<meta name="description" content="Sigmas Graph Example">
<meta name="author" content="Dave">
<script type="text/javascript" src="sigma.min.js"></script>
</head>
<body>
<script>
function myFunction()
{
var sigRoot = document.getElementById('sig');
var sigInst = sigma.init(sigRoot);
sigInst.addNode('hello',{
label: 'Hello',
color: '#ff0000'
}).addNode('world',{
label: 'World !',
color: '#00ff00'
}).addEdge('hello_world','hello','world').draw();
}
if (document.addEventListener) {
document.addEventListener('DOMContentLoaded', myFunction, false);
} else {
window.onload = myFunction;
}
</script>
<div id="sig"></div>
<button onclick="myFunction()">Try it</button>
</body>
</html>谢谢
回答 1
Stack Overflow用户
发布于 2014-09-29 11:09:25
是的，有一些技巧可以初始化sigma呈现画布。
需要注意的几件事：
对于sigma实例，您需要将边和节点添加到sigma实例的“node.
- Similarly”属性中，而不是实例本身。对于每个节点，您需要为每个节点指定x和y。对于每个节点，都是一个javascript对象，它应该具有和'id‘、'x’、'y‘以及可选的’
- ‘和可选的与边的node.
- Similarly关联的其他数据。对于边，每个边应该具有'id’、‘
- ’和‘
’
- 。添加边和/或节点后，需要调用sigInst.refresh()。not instance.
- You ()
- 在创建instance.
- You时，您可以使用" options“对象设置无数的选项。not draw需要设置目标div的大小，否则您将什么都看不到(至少在Chrome上是这样)。
因此，这里有一个基于上面脚本的工作版本。您还会在文档中注意到还有其他方法可用于批量导入节点和边，例如graph.read()。
<div id="sig" style="width: 800px; height: 600px;"></div>
<button onclick="myFunction()">Try it</button>
<script>
function myFunction()
{
var settings = {
defaultNodeColor: '#ec5148',
defaulLabelColor: '#99f',
defaultEdgeColor: '#aaa',
edgeColor: "default",
labelSizeRatio: "1",
labelThreshold: 1,
};
var sigInst = new sigma({
container: 'sig',
settings: settings
});
sigInst.graph.addNode({
id: 'hello',
label: 'Hello',
color: '#ff0000',
size: 5,
x:0,
y:0
});
sigInst.graph.addNode({
id: 'world',
label: 'World !',
color: '#00ff00',
size: 10,
x:1,
y:1
});
sigInst.graph.addEdge({
id: "helloworld",
source: "hello",
target: "world",
});
sigInst.refresh();
}
if (document.addEventListener) {
document.addEventListener('DOMContentLoaded', myFunction, false);
} else {
window.onload = myFunction;
}
</script>希望这能有所帮助。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/20873874
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号