Javascript Cytoscape.js不显示？

我之前问过如何将其作为依赖项@GBE提供了以下信息：

其他的都是

code

介绍示例

var cy=细胞景观({
容器：document.getElementById（'cy'），//要在其中呈现的容器
元素：[//要开始的图形元素列表
{//节点a
数据：{id:'a'}
},
{//节点b
数据：{id:'b'}
},
{//边ab
数据：{id:'ab'，源：'a'，目标：'b'}
}
],
样式：[//图形的样式表
{
选择器：'节点'，
风格：{
“背景色”：“666”，
'标签'：'数据（id）'
}
},
{
选择器：'边'，
风格：{
“宽度”：3，
“线条颜色”：“ccc”，
“目标箭头颜色”：“ccc”，
“目标箭头形状”：“三角形”
}
}
],
布局：{
名称：“网格”，
行数：1
}
});

当你写

<script>
   //Javascript code
</script>

然后在

https://cdnjs.cloudflare.com/ajax/libs/cytoscape/2.7.10/cytoscape.js

将被呈现。
通过在浏览器

URL

框中键入

https://cdnjs.cloudflare.com/ajax/libs/cytoscape/2.7.10/cytoscape.js

这实际上是一个

CDN-内容交付网络/内容分发网络

。您也可以使用

.js

文件来代替CDN。 使用.js文件时，需要指定找到该文件的项目的路径

---

编辑：工作示例：

@SumNeuron删除CSS时，它不起作用。因为您使用这个div来显示所有内容。这个div有一个id=“cy”，它是使用类似CSS的宽度定义的：100%；身高：100%；。当你没有为div定义任何属性（使用css）时，它会显示为nothing/empty，因此你看不到任何东西。这是一个愚蠢的问题。。如何从其他文件加载JSON？

<script src="stuff"></script>

<script>
var cy = cytoscape({

  container: document.getElementById('cy'), // container to render in

  elements: [ // list of graph elements to start with
    { // node a
      data: { id: 'a' }
    },
    { // node b
      data: { id: 'b' }
    },
    { // edge ab
      data: { id: 'ab', source: 'a', target: 'b' }
    }
  ],

  style: [ // the stylesheet for the graph
    {
      selector: 'node',
      style: {
        'background-color': '#666',
        'label': 'data(id)'
      }
    },

    {
      selector: 'edge',
      style: {
        'width': 3,
        'line-color': '#ccc',
        'target-arrow-color': '#ccc',
        'target-arrow-shape': 'triangle'
      }
    }
  ],

  layout: {
    name: 'grid',
    rows: 1
  }

});
</script>

<script>
   //Javascript code
</script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/cytoscape/2.7.10/cytoscape.js"></script>