title: C3: reading JSON generated from PHP
body: <p>I am a newbie to C3 (and .js) but very impressed and excited with what it can do. </p>
  
  <p>I am using PHP to pull a dataset from MySQL per the tutorial on:
  <a href="http://www.d3noob.org/2013/02/using-mysql-database-as-source-of-data.html" rel="nofollow">http://www.d3noob.org/2013/02/using-mysql-database-as-source-of-data.html</a> </p>
  
  <p>I can successfully generate the JSON file in PHP using the following code:</p>
  
  <pre><code>$myquery = "SELECT  `date`, `close` FROM  `data2`";
  $query = mysql_query($myquery);
  
  if ( ! $query ) {
     echo mysql_error();
      die;
  }
  
  $data = array();
  
  for ($x = 0; $x &lt; mysql_num_rows($query); $x++) {
     $data[] = mysql_fetch_assoc($query);
  }
  
  $output=json_encode($data); 
  echo $output;
  ?&gt;
  </code></pre>
  
  <p>This generates the following JSON:</p>
  
  <pre><code>[{"date":"1-May-12","close":"58.13"},{"date":"30-Apr-12","close":"53.98"},{"date":"27-Apr-12","close":"67.00"},{"date":"26-Apr-12","close":"89.70"},{"date":"25-Apr-12","close":"99.00"},{"date":"24-Apr-12","close":"130.28"},{"date":"23-Apr-12","close":"166.70"},{"date":"20-Apr-12","close":"234.98"},{"date":"19-Apr-12","close":"345.44"},{"date":"18-Apr-12","close":"443.34"},{"date":"17-Apr-12","close":"543.70"},{"date":"16-Apr-12","close":"580.13"},{"date":"13-Apr-12","close":"605.23"},{"date":"12-Apr-12","close":"622.77"},{"date":"11-Apr-12","close":"626.20"},{"date":"10-Apr-12","close":"628.44"},{"date":"9-Apr-12","close":"636.23"},{"date":"5-Apr-12","close":"633.68"},{"date":"4-Apr-12","close":"624.31"},{"date":"3-Apr-12","close":"629.32"},{"date":"2-Apr-12","close":"618.63"},{"date":"30-Mar-12","close":"599.55"},{"date":"29-Mar-12","close":"609.86"},{"date":"28-Mar-12","close":"617.62"},{"date":"27-Mar-12","close":"614.48"},{"date":"26-Mar-12","close":"606.98"}]
  </code></pre>
  
  <p>My issue is that the c3.js code I have does not render the chart. Not sure whether this is because the JSON is formatted correctly. </p>
  
  <p>This is code I'm using</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
  &lt;meta charset="utf-8"&gt;
  &lt;title&gt;title&lt;/title&gt;
  
  &lt;!-- Here are all the javascripts and css that you need, you can  download them or linked them like here --&gt;
  &lt;script type="text/javascript" src="d3.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="c3.js"&gt;&lt;/script&gt;
  &lt;link href="c3.css" rel="stylesheet" type="text/css"&gt;
  
  &lt;/head&gt;
  &lt;body&gt;
  &lt;div id="chart"&gt;&lt;/div&gt;
  &lt;script&gt;
  
  var obj2 = ['&lt;?php echo $output; ?&gt;'];
  
  
  var chart = c3.generate({
         bindto: '#chart',
         data: {
            json: [
            obj2
            ], // or URL
         keys: {
         //                x: 'name', // it's possible to specify 'x' when category axis
         value: ['close '],
         }   
         },
   axis: {
          x: {
         //     type: 'category'
          }
      }
      });
  &lt;/script&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>This is the result I get in the chart: 
  c3 blank chart - <a href="http://imgur.com/SHPmVOb" rel="nofollow">http://imgur.com/SHPmVOb</a></p>
  
  <p>Any help would be gratefully appreciated as I feel as this could be a big blocker to learning C3.</p>
  
  <p>Thanks</p>