Note that there are some explanatory texts on larger screens.

plurals
  1. POTrying to get highchart example working on local machine
    primarykey
    data
    text
    <p>I'm new to high charts / jquery and trying to just copy the html and js into two files on my local drive to see if I can get it to render in my broswer. </p> <p>My basic question is how can I take one of the example code provided by high charts in jfiddle and get it to work on my local machine?</p> <p>The sample code from highcharts.com works in jfiddle here: <a href="http://jsfiddle.net/m3MVk/" rel="nofollow">http://jsfiddle.net/m3MVk/</a></p> <pre><code>$(function () { var chart; $(document).ready(function() { chart = new Highcharts.Chart({ chart: { renderTo: 'container', type: 'line', marginRight: 130, marginBottom: 25 }, title: { text: 'Monthly Average Temperature', x: -20 //center }, subtitle: { text: 'Source: WorldClimate.com', x: -20 }, xAxis: { categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'] }, yAxis: { title: { text: 'Temperature (°C)' }, plotLines: [{ value: 0, width: 1, color: '#808080' }] }, tooltip: { formatter: function() { return '&lt;b&gt;'+ this.series.name +'&lt;/b&gt;&lt;br/&gt;'+ this.x +': '+ this.y +'°C'; } }, legend: { layout: 'vertical', align: 'right', verticalAlign: 'top', x: -10, y: 100, borderWidth: 0 }, series: [{ name: 'Tokyo', data: [7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6] }, { name: 'New York', data: [-0.2, 0.8, 5.7, 11.3, 17.0, 22.0, 24.8, 24.1, 20.1, 14.1, 8.6, 2.5] }, { name: 'Berlin', data: [-0.9, 0.6, 3.5, 8.4, 13.5, 17.0, 18.6, 17.9, 14.3, 9.0, 3.9, 1.0] }, { name: 'London', data: [3.9, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8] }] }); }); }); </code></pre> <p>HTML:</p> <pre><code>&lt;script src="http://code.highcharts.com/highcharts.js"&gt;&lt;/script&gt; &lt;script src="http://code.highcharts.com/modules/exporting.js"&gt;&lt;/script&gt; &lt;div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"&gt;&lt;/div&gt; </code></pre> <p>Then in one folder i made two files: chart1.js and chart1.html with the above code in them.</p> <p>I also saved the most recent jquery into the folder as jquery-1.9.1.js I then added to the top of the html file.</p> <p>When I load the HTML file in Chrome, nothing happens. </p> <p>Can somebody please advise?</p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload