cytoscape.js-为什么我在Chrome浏览器中看不到示例图?

时间:2018-07-13 00:52:35

标签: javascript

我是前端开发和cytoscape.js的新手,我想创建一个简单的示例来了解如何使用cytoscape.js库。我想创建一个简单的图形示例,并使用http://blog.js.cytoscape.org/2016/05/24/getting-started/上的教程。

有人可以告诉我为什么我在Chrome浏览器中还看不到图形吗?我为图形和图形实例创建了一个区域。下面是无法正常工作的代码。非常感谢您的帮助。

<!doctype html>
<html>
<head>
    <title>Tutorial 1: Getting Started</title>
    <script> src='cytoscape.js'></script>
</head>

<style>
    #cy {
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0px;
        left: 0px;
    }
</style>

<body>
    <div id="cy"></div>
    <script>  // <!–– Below is where graph is created ––>
        var cy = cytoscape({
        container: document.getElementById('cy'),  //container to render in
        elements: [
          { data: { id: 'a' } },
          { data: { id: 'b' } },
          { data: { id: 'ab', source: 'a', target: 'b' } 
        }],
        style: [
        {
          selector: 'node',
          style: {
            shape: 'hexagon',
            'background-color': 'red'
            label: 'data(id)'
           }
        }]
    });  
    </script>
</body>
</html>

1 个答案:

答案 0 :(得分:0)

以下行:

<script> src='cytoscape.js'></script>

应更改为:

<script src='cytoscape.js'></script>