简体   繁体   English

Cytoscape.js不显示?

[英]Cytoscape.js not displaying?

I previously asked how to remotely load cytoscape as a dependency. 我之前曾问过如何远程加载cytoscape作为依赖项。 @GBE provided the following answer @GBE提供了以下答案

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

So I made an HTML file and copied verbatim introductory example from cytoscape (enclosing it in <script>code</script> . However the result renders nothing. Why? Code below for convenience. 因此,我制作了一个HTML文件,并从cytoscape复制了逐字介绍性示例 (将其括在<script>code</script> 。但是结果什么也没呈现。为什么?

Mini-question: why is source enclosed as: 小问题:为何将源包含为:

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

and everything else is 还有其他一切

<script> code </script> ? <script> code </script>

Intro-example 简介 - 例如

<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>

When you write 当你写

<script>
   //Javascript code
</script>

the Javascript code that you write between the opening and closing tag will be rendered. 您在开始标记和结束标记之间编写的Javascript代码将被呈现。 But, If inside the <script> tag there has been specified an src atribute like 但是,如果在<script>标记内指定了src属性,例如

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

then the Javascript code found on the https://cdnjs.cloudflare.com/ajax/libs/cytoscape/2.7.10/cytoscape.js will be rendered. 然后将呈现在https://cdnjs.cloudflare.com/ajax/libs/cytoscape/2.7.10/cytoscape.js上找到的Javascript代码。
You can see what code will be rendered by typing on the browser URL box the 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来查看将呈现什么代码。

This actually is a CDN - Content Delivery Network/Content Distribution Network . 这实际上是CDN - Content Delivery Network/Content Distribution Network Instead of CDN you could use an .js file, too. 除了CDN,您也可以使用.js文件。 When you use a .js file then you need to specify the path from the project where it is found. 使用.js文件时,您需要指定项目所在的路径。

Edit: Working Sample: https://jsfiddle.net/0py37s5x/2/ 编辑:工作示例: https//jsfiddle.net/0py37s5x/2/

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM