Cytoscape.js not displaying?
<p>I previously asked how to <a href="https://stackoverflow.com/q/40298582/5623899">remotely load cytoscape</a> as a dependency. @GBE provided the following <a href="https://stackoverflow.com/a/40298879/5623899">answer</a></p>
<pre><code>&lt;script src=&quot;https://cdnjs.cloudflare.com/ajax/libs/cytoscape/2.7.10/cytoscape.js&quot;&gt;&lt;/script&gt;
</code></pre>
<p>So I made an <code>HTML</code> file and copied verbatim <a href="http://js.cytoscape.org/#getting-started/specifying-basic-options" rel="nofollow noreferrer">introductory example</a> from cytoscape (enclosing it in <code>&lt;script&gt;code&lt;/script&gt;</code>. However the result renders nothing. Why? Code below for convenience.</p>
<p>Mini-question: why is source enclosed as:</p>
<pre><code>&lt;script src=&quot;stuff&quot;&gt;&lt;/script&gt;
</code></pre>
<p>and everything else is</p>
<p><code>&lt;script&gt; code &lt;/script&gt;</code>?</p>
<h1>Intro-example</h1>
<pre><code>&lt;script&gt;
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
  }

});
&lt;/script&gt;
</code></pre>