title: High chart data downloads but does not display in browser using node
body: <p>I'm having an issue with High Charts I don't understand. I'm able to download the chart from the browser but it does not display.</p>
  
  <p>Here is my javascript file.</p>
  
  <p><code>chart.js</code></p>
  
  <pre><code>var cpvmPartners = [];
  var cpvmPlannedCPM = [];
  graphData = []
  
  
  $(function(){
      $.getJSON('/cpvmdata', function(data) {
          for(k in data){
               graphData.push([data[k]['partner'],data[k]['plannedcpm']])
          }
  });
  
  
      $(function () {
          $('#cpvmSummary').highcharts({
              chart: {
                  type: 'column'
              },
              title: {
                  text: 'World\'s largest cities per 2014'
              },
              subtitle: {
                  text: 'Source: &lt;a href="http://en.wikipedia.org/wiki/List_of_cities_proper_by_population"&gt;Wikipedia&lt;/a&gt;'
              },
              xAxis: {
                  type: 'category',
                  labels: {
                      rotation: -45,
                      style: {
                          fontSize: '13px',
                          fontFamily: 'Verdana, sans-serif'
                      }
                  }
              },
              yAxis: {
                  min: 0,
                  title: {
                      text: 'Population (millions)'
                  }
              },
              legend: {
                  enabled: false
              },
              tooltip: {
                  pointFormat: 'Population in 2008: &lt;b&gt;{point.y:.1f} millions&lt;/b&gt;'
              },
              series: [{
                  name: 'Population',
                  data: graphData ,
                  dataLabels: {
                      enabled: true,
                      rotation: -90,
                      color: '#FFFFFF',
                      align: 'right',
                      format: '{point.y:.1f}', // one decimal
                      y: 10, // 10 pixels down from the top
                      style: {
                          fontSize: '13px',
                          fontFamily: 'Verdana, sans-serif'
                      }
                  }
              }]
          });
      });
  }); 
  </code></pre>
  
  <p>This is the html</p>
  
  <pre><code> &lt;div class="container"&gt;
  
          &lt;!-- Portfolio Item Heading --&gt;
          &lt;div class="row"&gt;
              &lt;div class="col-lg-12"&gt;
                  &lt;h1 class="page-header"&gt;CPVM Summary
             &lt;!--          &lt;small&gt;CPVM Summary&lt;/small&gt; --&gt;
                  &lt;/h1&gt;
              &lt;/div&gt;
          &lt;/div&gt;
     &lt;!-- jQuery --&gt;
      &lt;script src="js/jquery.js"&gt;&lt;/script&gt;
  
      &lt;script src="js/cpvmGraphs.js"&gt;&lt;/script&gt;
  
  
      &lt;!-- Bootstrap Core JavaScript --&gt;
      &lt;script src="js/bootstrap.min.js"&gt;&lt;/script&gt;
  
  
      &lt;!-- High Charts --&gt;
      &lt;script src="https://code.highcharts.com/highcharts.js"&gt;&lt;/script&gt;
      &lt;script src="https://code.highcharts.com/modules/exporting.js"&gt;&lt;/script&gt;
  </code></pre>
  
  <p>Not sure what else to do at this point pr why it is loading in one place but not the other, any info would be greatly appreciated. </p>