Cytoscape.js没有显示?

时间:2016-10-28 07:00:57

标签: javascript html cytoscape.js

我之前曾问过remotely load cytoscape如何作为依赖。 @GBE提供了以下answer

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

所以我制作了一个HTML文件并从cytoscape中复制了introductory example(将其括在<script>code</script>中。但是结果什么都没有。为什么?下面的代码是为了方便。

迷你问题:为什么源封闭为:

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

其他一切都是

<script> code </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>

1 个答案:

答案 0 :(得分:4)

写作时

<script>
   //Javascript code
</script>

您将在初始标记和结束标记之间编写的Javascript代码将被呈现。 但是,如果在<script>标记内部指定了src属性

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

然后会在Javascript上找到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 - Content Delivery Network/Content Distribution Network。您也可以使用.js文件代替CDN。 当您使用.js文件时,您需要指定项目所在的路径。

修改:工作示例:https://jsfiddle.net/0py37s5x/2/