Hi,
I just started with the google visualization API (actually with the whole
html/php etc. thing :-) ).
So what I've got right now is the following PHP:
<!-- Datei zum bereitstellen von Daten für GEO-CHART -->
<?php
$MYSQL_HOST="localhost";
$MYSQL_BENUTZER="root";
$MYSQL_KENNWORT="" ;
$MYSQL_DATENBANK="db_index";
$db = mysql_connect($MYSQL_HOST, $MYSQL_BENUTZER, $MYSQL_KENNWORT)or die
(mysql_error ());
mysql_select_db($MYSQL_DATENBANK) or die(mysql_error());
$year = '2014';
$SQLString = "SELECT
tb_countries.label,datenpool.id,datenpool.jahr,datenpool.dblindex
FROM ( SELECT ID,Jahr,dblIndex FROM
tb_ind_fra
UNION
SELECT ID,Jahr,dblIndex FROM tb_ind_ger
) datenpool
INNER JOIN tb_countries
ON tb_countries.ID = datenpool.ID
WHERE datenpool.jahr = '$year'";
$result = mysql_query($SQLString);
# build Google API JSON for GEO CHART
# Columns
echo "{ \"cols\": [
{\"id\":\"\",\"label\":\"Country\",\"type\":\"string\"},
{\"id\":\"\",\"label\":\"Index\",\"type\":\"number\"} ], \"rows\": [ ";
# Rows
$total_rows = mysql_num_rows($result);
$row_num = 0;
while($row = mysql_fetch_array($result)){
$row_num++;
if ($row_num == $total_rows){
echo "{\"c\":[{\"v\":\"" . $row['label'] . "\",\"f\":null},{\"v\":" .
$row['dblindex'] . ",\"f\":null}]}";
} else {
echo "{\"c\":[{\"v\":\"" . $row['label'] . "\",\"f\":null},{\"v\":" .
$row['dblindex'] . ",\"f\":null}]}, ";
}
}
echo " ] }";
mysql_close($db);
?>
When I call this file I get:
{ "cols": [ {"id":"","label":"Country","type":"string"}, {"id":"","label":
"Index","type":"number"} ], "rows": [ {"c":[{"v":"Germany","f":null},{"v":
300,"f":null}]}, {"c":[{"v":"France","f":null},{"v":150,"f":null}]} ] }
And then I try to create the geochart with this:
<html>
<head>
<!--Load the AJAX API-->
<script type="text/javascript" src="http://www.google.com/jsapi";></script>
<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script type="text/javascript">
google.load("visualization", "1", {packages:["geochart"]});
google.setOnLoadCallback(drawRegionsMap);
function drawRegionsMap() {
var jsonData = $.ajax({
url: "geo.php",
dataType:"json",
async: false
}).responseText;
// Create our data table out of JSON data loaded from server.
var data = new google.visualization.DataTable(jsonData);
var options = {};
var chart = new
google.visualization.GeoChart(document.getElementById('regions_div'));
chart.draw(data, options);
}
</script>
</head>
<body>
<div id="regions_div" style="width: 900px; height: 500px;"></div>
</body>
</html>
But ist just doesn't work. I tried several other codes but it just displays
nothing.
What I get is an error message: Uncaught TypeError: undefined is not a
function
here:
var jsonData = $.ajax({
What is wrong with my code?
I'm looking forward to every feedback I get.
Thank you in advance
Best,
Manuel
--
You received this message because you are subscribed to the Google Groups
"Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/google-visualization-api.
For more options, visit https://groups.google.com/d/optout.
