我在使用Sigma.js渲染有向图的箭头时遇到问题。
我的GEXF图表:
<?xml version="1.0" encoding="UTF-8"?>
<gexf xmlns="http://www.gexf.net/1.2draft" version="1.2" xmlns:viz="http://www.gexf.net/1.2draft/viz" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://www.gexf.net/1.2draft http://www.gexf.net/1.2draft/gexf.xsd">
<meta lastmodifieddate="2015-05-11">
<creator>Gephi 0.8.1</creator>
<description></description>
</meta>
<graph defaultedgetype="directed" mode="static">
<nodes>
<node id="startNode" label="Initial resources">
<attvalues></attvalues>
<viz:size value="1.0"></viz:size>
<viz:position x="1.0" y="1.0" z="0.0"></viz:position>
<viz:color r="153" g="153" b="153"></viz:color>
</node>
<node id="node1" label="node1">
<attvalues></attvalues>
<viz:size value="1.0"></viz:size>
<viz:position x="100.0" y="0.0" z="0.0"></viz:position>
<viz:color r="153" g="153" b="153"></viz:color>
</node>
<node id="node2" label="node2">
<attvalues></attvalues>
<viz:size value="1.0"></viz:size>
<viz:position x="200.0" y="0.0" z="0.0"></viz:position>
<viz:color r="153" g="153" b="153"></viz:color>
</node>
</nodes>
<edges>
<edge source="startNode" target="node1" label="res1">
<attvalues></attvalues>
</edge>
<edge source="node1" target="node2">
<attvalues></attvalues>
</edge>
</edges>
</graph>
</gexf>
我的Sigma.js脚本:
s = new sigma({
container : 'content',
renderer : {
container : document.getElementById('content'),
type : 'canvas'
},
settings : {
minNodeSize : 12,
maxNodeSize : 12
},
drawingProperties : {
defaultEdgeArrow : 'source'
}
});
sigma.parsers.gexf('../resources/text.gexf', s, function() {
s.refresh();
});
我还尝试将defaultEdgeArrow属性添加到设置和渲染器块 - 它也不起作用。
请帮忙。 谢谢你的回答。
答案 0 :(得分:2)
s = new sigma({
renderer: {
container: document.getElementById('content'),
type: 'canvas'
},
settings : {
maxEdgeSize: 5
}
});
sigma.parsers.gexf('graph.gexf', s, function() {
s.graph.edges().forEach(function(edge){
edge.type = "arrow";
});
s.refresh();
});
查看http://plnkr.co/edit/Hrb0HmzT6TXdPxv3BFFq?p=preview
它是您的代码的傻瓜,与sigma 1.0.3一起使用