Sigma js图形不渲染任何东西

Sigma js graph doesn't render anything

本文关键字：任何东 js 图形 Sigma      更新时间：2023-09-26

以下代码不呈现任何内容，也不返回任何错误:

var sigma = require('sigma');
var i,
    s,
    N = 100,
    E = 500,
    g = {
        nodes: [],
        edges: []
    };
// Generate a random graph:
for (i = 0; i < N; i++)
    g.nodes.push({
        id: 'n' + i,
        label: 'Node ' + i,
        x: Math.random(),
        y: Math.random(),
        size: Math.random(),
        color: '#666'
    });
for (i = 0; i < E; i++)
    g.edges.push({
        id: 'e' + i,
        source: 'n' + (Math.random() * N | 0),
        target: 'n' + (Math.random() * N | 0),
        size: Math.random(),
        color: '#ccc'
    });
sigma.renderers.def = sigma.renderers.canvas;
// Instantiate sigma:
s = new sigma({
    graph: g,
    container: document.getElementById('sigma-container')
});

一些注意事项:1.我已经设置了max-width和height: 

#sigma-container {
  max-width: 400px;
  height: 400px;
  margin: auto;
}

2。我在Node上运行它，所以我有一个单独的js文件，它被编译并正确传递给浏览器。(至少我可以在chrome的开发者工具中看到代码)

3。我使用以下html: 

<!DOCTYPE html>
<html>
  <head>
      <link rel='stylesheet' href='/stylesheets/style.css' />
  </head>
  <body>
    <div id="sigma-container"></div>
      <script src="/javascripts/bundle.js"></script>
  </body>
</html>

4。如果我输入的不是getElementById('sigma-container')，而是div的名称，则返回错误:Uncaught Container not found.

知道为什么它不渲染吗?

container not found错误已在此pull request https://github.com/jacomyal/sigma.js/pull/653中修复，但不包含在sigma (v1.1.0)的最新版本中。我手动构建了一个包含修复的github项目的主分支的副本，并解决了这个问题。

相关文章：