微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

javascript – 如何“插入”sigma.js的插件?

Sigma.js在他们的 GitHub上列出了几个 examples,但是从他们那里不清楚加载一个插件是需要的.

我已经尝试简单地包括< script>指向插件的JavaScript文件但没有起作用的标签.如何导入/使用/ copypaste插件到我的网站?

解决方法

首先,包括您需要的sigma文件
<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);
  });
  // Draw the graph :
  sigInst.draw(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>

原文地址:https://www.jb51.cc/js/152000.html

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐