title: node - how to read correctly json from a local file?
body: <p>I am using node.js to serve a page (index.html) where I visualize a network graph,  using <a href="http://visjs.org/" rel="nofollow">vis.js</a>. In order to draw a network graph with this library, one needs to provide a <strong>nodes</strong> and <strong>edges</strong> json arrays (<a href="http://visjs.org/examples/network/basicUsage.html" rel="nofollow">see example</a>).</p>
  
  <pre><code>// create an array with nodes
    var _nodes_ = [
      {id: 1, label: 'Node 1'},
      {id: 2, label: 'Node 2'},
      {id: 3, label: 'Node 3'},
      {id: 4, label: 'Node 4'},
      {id: 5, label: 'Node 5'}
    ];
  
  
    // create an array with edges
    var _edges_ = [
      {from: 1, to: 2},
      {from: 1, to: 3},
      {from: 2, to: 4},
      {from: 2, to: 5}
    ];
  </code></pre>
  
  <p>The first version of my <strong>index.html</strong> file looks like:</p>
  
  <pre><code>&lt;!doctype html&gt;
  &lt;html&gt;
  &lt;head&gt;
    &lt;title&gt;Network | Basic usage&lt;/title&gt;
    &lt;script type="text/javascript" src="js/jquery.min.js"&gt;&lt;/script&gt;
    &lt;script type="text/javascript" src="js/vis.js"&gt;&lt;/script&gt;
  &lt;/head&gt;
  
  &lt;body&gt;
  
  &lt;div id="mynetwork"&gt;&lt;/div&gt;
  
  &lt;script type="text/javascript" &gt;
  
  
    // create an array with nodes    
    var _nodes_ = [
      {id: 1, label: 'Node 1'},
      {id: 2, label: 'Node 2'},
      {id: 3, label: 'Node 3'},
      {id: 4, label: 'Node 4'},
      {id: 5, label: 'Node 5'}
    ];
  
  
    // create an array with edges
    var _edges_ = [
      {from: 1, to: 2},
      {from: 1, to: 3},
      {from: 2, to: 4},
      {from: 2, to: 5}
    ];
  
  console.log(_nodes_);
  console.log(_edges_);
  
  
    // create a network
    var container = document.getElementById('mynetwork');
    var data= {
      nodes: _nodes_,
      edges: _edges_,
    };
    var options = {
      autoResize: true,
      clickToUse: false,
      width: '800px',
      height: '800px'
    };
    var network = new vis.Network(container, data, options);
  &lt;/script&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>And it is working just fine. However, when I try to read from a local file the <strong>nodes</strong> and <strong>edges</strong> arrays, the network graph doesn't show up:</p>
  
  <pre><code>&lt;!doctype html&gt;
  &lt;html&gt;
  &lt;head&gt;
    &lt;title&gt;Network | Basic usage&lt;/title&gt;
    &lt;script type="text/javascript" src="js/jquery.min.js"&gt;&lt;/script&gt;
    &lt;script type="text/javascript" src="js/vis.js"&gt;&lt;/script&gt;
  &lt;/head&gt;
  
  &lt;body&gt;
  
  &lt;div id="mynetwork"&gt;&lt;/div&gt;
  
  &lt;script type="text/javascript" &gt;
    // create an array with nodes
  
  var _nodes_;
  var _edges_;
  
   $.getJSON('json/nodes.json', function(nodes) {
       _nodes_= nodes;
    });
  
    $.getJSON('json/edges.json', function(edges) {
        _edges_ = edges;
  
    });
  
  
  
  console.log(_nodes_);
  console.log(_edges_);
  
  
    // create a network
    var container = document.getElementById('mynetwork');
    var data= {
      nodes: _nodes_,
      edges: _edges_,
    };
    var options = {
      autoResize: true,
      clickToUse: false,
      width: '800px',
      height: '800px'
    };
    var network = new vis.Network(container, data, options);
  &lt;/script&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>I am using:</p>
  
  <ul>
  <li><p><strong>nodes.json</strong>:</p>
  
  <p>[
    {
      "id": 1,
      "label": "Node 1"
    },
    {
      "id": 2,
      "label": "Node 2"
    },
    {
      "id": 3,
      "label": "Node 3"
    },
    {
      "id": 4,
      "label": "Node 4"
    }
  ]</p></li>
  <li><p><strong>edges.json</strong>:</p>
  
  <p>[
    {
      "from": 1,
      "to": 2
    },
    {
      "from": 1,
      "to": 3
    },
    {
      "from": 1,
      "to": 4
    }
  ]</p></li>
  </ul>
  
  <p>Is there a difference between creating a json inside your javascript and reading from  a file? Can someone help me spot the error here please?</p>
  
  <p>Thanks!</p>