9
Sigma.js在他們的GitHub上列出了幾個examples,但從它們不清楚加載插件需要什麼。如何「插入」sigma.js的插件?
我試圖簡單地包括一個<script>
標籤指向插件的JavaScript文件,但沒有奏效。如何將插件導入/使用/複製到我的網站?
Sigma.js在他們的GitHub上列出了幾個examples,但從它們不清楚加載插件需要什麼。如何「插入」sigma.js的插件?
我試圖簡單地包括一個<script>
標籤指向插件的JavaScript文件,但沒有奏效。如何將插件導入/使用/複製到我的網站?
首先,包括你所需要的Σ-文件:
<script src="sigma/sigma.concat.js"></script>
<script src="sigma/plugins/sigma.parseGexf.js"></script>
<script src="sigma/plugins/sigma.forceatlas2.js"></script>
然後開始你的腳本;
<script type="text/javascript">
function init() {
// Instanciate sigma.js and customize rendering :
sigInst = sigma.init(document.getElementById('graph')).drawingProperties({
defaultLabelColor: '#fff',
defaultLabelSize: 14,
defaultLabelBGColor: '#fff',
defaultLabelHoverColor: '#000',
labelThreshold: 6,
defaultEdgeType: 'curve'
}).graphProperties({
minNodeSize: 2,
maxNodeSize: 5,
minEdgeSize: 1,
maxEdgeSize: 1
}).mouseProperties({
maxRatio: 32
});
// Parse a GEXF encoded file to fill the graph
// (requires "sigma.parseGexf.js" to be included)
sigInst.parseGexf('getgefx.php');
sigInst.bind('downnodes',function(event){
var nodes = event.content;
var neighbors = {};
sigInst.iterEdges(function(e){
if(nodes.indexOf(e.source)>=0 || nodes.indexOf(e.target)>=0){
neighbors[e.source] = 1;
neighbors[e.target] = 1;
}
}).iterNodes(function(n){
if(!neighbors[n.id]){
n.attr['temphidden'] = 1;
n.attr['oldcolor'] = n.color;
// var c = sigma.tools.getRGB(n.color);
n.color = "#eee"; // #ccc";
// n.color = "rgba("+c['r']+","+c['g']+","+c['b']+",0.2)";
}
}).draw(2,2,2);
}).bind('upnodes',function(){
sigInst.iterNodes(function(n){
if(n.attr['temphidden'] == 1) {
n.color = n.attr['oldcolor'];
n.attr['temphidden'] = 0;
}
}).draw(2,2,2);
});
// Draw the graph :
sigInst.draw(2,2,2);
sigInst.startForceAtlas2();
var isRunning = true;
document.getElementById('stop-layout').addEventListener('click',function(){
if(isRunning){
isRunning = false;
sigInst.stopForceAtlas2();
document.getElementById('stop-layout').childNodes[0].nodeValue = 'Start Layout';
}else{
isRunning = true;
sigInst.startForceAtlas2();
document.getElementById('stop-layout').childNodes[0].nodeValue = 'Stop Layout';
}
},true);
}
if (document.addEventListener) {
document.addEventListener("DOMContentLoaded", init, false);
} else {
window.onload = init;
}
</script>
也許我應該提到,雖然我對Python感到滿意,但JavaScript並不是你稱之爲我的特長的東西。 – Tuomas 2013-04-20 22:19:33
它我正確理解,插件只是JavaScript文件。我會認爲你要在你的html文件中下載一個插件和「參考」。如「script type =」text/javascript「src = ....」 – user1043144 2013-04-21 05:21:49
不,對不起,我嘗試過,但沒有像那樣工作。在sigma.js網站上列出的例子似乎還包含其他內容以及實際的插件功能。 – Tuomas 2013-04-21 13:21:04