title: JSON data not showing in highstock Candlestick chart using PHP & MYSQL
body: <p>I'm trying to create a <a href="http://api.highcharts.com/highcharts" rel="nofollow">highstock</a>'s <a href="http://highcharts.com/stock/demo/candlestick" rel="nofollow">candlestick chart</a> using php and mySQL.</p>
  
  <p>this is my code so far, really appreciate if anyone can help me with this:</p>
  
  <p>This my code for retrieving data from mySQL database and convert it to JSON format (datachart.php):</p>
  
  <pre><code>$conn = mysql_connect("localhost", "root", "") or die (mysql_error ());
  $db = mysql_select_db ("b27sim") or die (mysql_error ());
  
  $result=mysql_query ("SELECT date, open, high, low, close FROM mb27_daily") or die (mysql_error ());
  
  $data = array();
  $count = 0;
  while ($row=mysql_fetch_array($result))
  {
  
    $newdate = strtotime($row['date']) * 1000; 
    $data[] = array( $newdate, (float)$row['open'], (float)$row['high'], (float)$row['low'], (float)$row['close']);
    $count++;
  }   
  echo json_encode($data);
  </code></pre>
  
  <p>This is the result from datachart.php:</p>
  
  <blockquote>
    <p>[[1350252000000,369.72,371.02,368.09,370.22],[1349820000000,366.58,369.13,364.92,368.92],[1349733600000,367.38,369.93,366.82,368.64],[1349388000000,367.28,371.85,367.2,369.9],[1349301600000,362.75,366.24,362.22,365.61],[1349215200000,363.34,363.54,361.27,362.27],[1349128800000,360.79,362.73,360.33,361.77],[1349042400000,360.75,360.75,357.94,359.46],[1348783200000,360.62,362.69,359.84,362.5],[1348696800000,356.39,361.01,355.32,359.34],[1348524000000,358,360.39,356.34,359.7],[1348437600000,357.96,360.99,355.92,356.89],[1348178400000,359.27,360.53,356.93,360.53],[1348092000000,358.74,359.31,356.51,358.01],[1348005600000,357.97,361.82,357.24,359.86],[1347919200000,359.8,360.34,356.78,358.5],[1233010800000,119.28,122.42,119.28,121.91]]</p>
  </blockquote>
  
  <p>And this is my javascript code inside index.htm:</p>
  
  <pre><code>$(function() {
      $.getJSON('datachart.php', function(data) {
  
      // create the chart
      chart = new Highcharts.StockChart({
          chart : {
              renderTo : 'container',
          },
  
          rangeSelector : {
              selected : 1
          },
  
          title : {
              text : 'IB27 Price'
          },
  
          series : [{
              type : 'candlestick',
              name : '',
              data : data,
              tooltip: {
                  valueDecimals: 2
              },
              dataGrouping : {
                  units : [
                      ['week', // unit name
                      [1] // allowed multiples
                  ], [
                      'month', 
                      [1, 2, 3, 4, 6]]
                  ]
              }
          }]
      });
      });
  });
  </code></pre>
  
  <p>and this is my div calling the container:</p>
  
  <pre><code>&lt;div id="container" style="height: 500px; min-width: 500px"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>and this is the result:
  I got has not graph inside, but showing the timeline at the bottom, the date range on right top, etc.</p>
  
  <p>Appreciate you guys help on this as I've been banging my head for the last 4 hours because of this... :)</p>
  
  <p>Thanks,
  Raz</p>