title: Google Charts and MYSQL
body: <p>i am new with PHP and Google charts. What i am trying to do it to make google charts with arduino data storred in a MYSL database. So far i insert data from arduino to mysql DB successfully but i face difficulties with the google charts.</p>
  
  <p><strong>Here is my PHP code:</strong></p>
  
  <pre><code>&lt;?php
  
  
    $mysqli =mysqli_connect('localhost', 'root', '', 'Arduino');
  if (mysqli_connect_errno()) {
      echo "Failed to connect to MySQL: ".mysqli_connect_error();
  }
  
  
    $sql = mysqli_query($mysqli, 'SELECT * FROM analoog0');
  
    if (!$sql) {
    die("Error running $sql: " . mysql_error());
    }
  
  
  
    $results = array();
    while($row = mysqli_fetch_assoc($sql))
  {
     $results[] = array(
        'Date' =&gt; $row['Date'],
        'Time' =&gt; $row['Time'],
        'Temperature' =&gt; $row['Temperature']
     );
  }
  $json = json_encode($results, JSON_PRETTY_PRINT);
  echo $json;
  
  ?&gt;
  </code></pre>
  
  <p><strong>Here is the JSON output:</strong></p>
  
  <pre><code>[ { "Date": "2013-10-24", "Time": "18:15:49", "Temperature": "24" }, 
  { "Date": "2013-10-24", "Time": "18:16:19", "Temperature": "24" }, 
  { "Date": "2013-10-24", "Time": "18:16:49", "Temperature": "24" }, 
  { "Date": "2013-10-24", "Time": "18:17:19", "Temperature": "23" } ]
  </code></pre>
  
  <p><strong>And finally the HTM code:</strong></p>
  
  <pre><code>&lt;html&gt;
    &lt;head&gt;
      &lt;!--Load the AJAX API--&gt;
      &lt;script type="text/javascript" src="https://www.google.com/jsapi"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript"&gt;
  
      // Load the Visualization API and the piechart package.
      google.load('visualization', '1', {'packages':['corechart']});
  
      // Set a callback to run when the Google Visualization API is loaded.
      google.setOnLoadCallback(drawChart);
  
      function drawChart() {
        var jsonData = $.ajax({
            url: "localhost/Charts/chart_ver2.php",
            dataType:"json",
            async: false
            }).responseText;
  
        // Create our data table out of JSON data loaded from server.
        var data = new google.visualization.DataTable(jsonData);
  
        // Instantiate and draw our chart, passing in some options.
        var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
        chart.draw(data, {width: 400, height: 240});
      }
  
      &lt;/script&gt;
    &lt;/head&gt;
  
    &lt;body&gt;
      &lt;div id="chart_div"&gt;&lt;/div&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>When i run the HTM code nothing happens - the screen remains blank. </p>
  
  <p>Any help, guidance or redirection will be highly appreciated!
  Thanks in advance!!</p>