title: Live data will not load in HighCharts gauge
body: <p>I am trying to make a Gauge chart.
  The chart is displaying 80 but live data is not working.
  I use the following code:</p>
  
  <pre><code>$(function () {
  
  var chart = new Highcharts.Chart({
  
          chart: {
              renderTo: 'container',
              type: 'gauge',
              plotBackgroundColor: null,
              plotBackgroundImage: null,
              plotBorderWidth: 0,
              plotShadow: false
          },
  
          title: {
              text: 'Speedometer'
          },
  
          pane: {
              startAngle: -150,
              endAngle: 150,
              background: [{
                  backgroundColor: {
                      linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
                      stops: [
                          [0, '#FFF'],
                          [1, '#333']
                      ]
                  },
                  borderWidth: 0,
                  outerRadius: '109%'
              }, {
                  backgroundColor: {
                      linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
                      stops: [
                          [0, '#333'],
                          [1, '#FFF']
                      ]
                  },
                  borderWidth: 1,
                  outerRadius: '107%'
              }, {
                  // default background
              }, {
                  backgroundColor: '#DDD',
                  borderWidth: 0,
                  outerRadius: '105%',
                  innerRadius: '103%'
              }]
          },
  
          // the value axis
          yAxis: {
              min: 0,
              max: 200,
  
              minorTickInterval: 'auto',
              minorTickWidth: 1,
              minorTickLength: 10,
              minorTickPosition: 'inside',
              minorTickColor: '#666',
  
              tickPixelInterval: 30,
              tickWidth: 2,
              tickPosition: 'inside',
              tickLength: 10,
              tickColor: '#666',
              labels: {
                  step: 2,
                  rotation: 'auto'
              },
              title: {
                  text: 'km/h'
              },
              plotBands: [{
                  from: 0,
                  to: 120,
                  color: '#55BF3B' // green
              }, {
                  from: 120,
                  to: 160,
                  color: '#DDDF0D' // yellow
              }, {
                  from: 160,
                  to: 200,
                  color: '#DF5353' // red
              }]        
          },
  
          series: [{
              name: 'Speed',
              data: [80],
              tooltip: {
                  valueSuffix: ' km/h'
              }
          }]
  
      },
      // Add some life
  function (chart) {
      setInterval(function() {
      $(function() {
      $.getJSON("livedata.php", function(data) {
          $.each(data, function(key, val) {
          if (key == 'Gas')
          {
          newVal = val;
          var point = chart.series[0].points[0];
          point.update(newVal);
          }
          });
      });
      }, "json");
  }, 3000);
  })
  });
  </code></pre>
  
  <p>my simple test livedata.php is as follow:</p>
  
  <pre><code>// Set the JSON header
  header("Content-type: text/json");
  
  // The y value is a random number
  $x = "Gas";
  $y = rand(10, 100);
  
  // Create a PHP array and echo it as JSON
  $ret = array($x, $y);
  echo json_encode($ret, JSON_NUMERIC_CHECK);
  </code></pre>
  
  <p>Can anybody tell me what is going wrong?<br>
  How can I test that the function is called?<br>
  How can I test that the livedata has passed?</p>