Your javascript is missing the closing braces and parenthesis for the AJAX
call and the drawMarkersMap function:
function drawMarkersMap() {
$.ajax({
url: "getData.json",
dataType:"json",
success: function (json) {
// Create our data table out of JSON data loaded from server.
var data = new google.visualization.DataTable(jsonData);
var options = {
region: 'US',
displayMode: 'markers',
colorAxis: {colors: ['green', 'blue']}
};
var chart = new
google.visualization.GeoChart(document.getElementById('visualization'));
chart.draw(data, options);
} // <-- the ";" that was here does not belong
}); // <-- missing this
} // <-- and this
Try that and see if it works.
On Wednesday, March 5, 2014 11:00:03 PM UTC-5, Timothy Sheils wrote:
>
> I'm trying to have a map displayed on a website I am working on. I have
> found plenty of resources on how to use an ajax request to get json data,
> and convert to a google datatable, but I can't seem to get it to work
> correctly. Here is the important code:
>
> client1.php contains the main page of the website. I want the chart to
> load here. I can do it by hardcoding values in, so the problem lies with
> the ajax/json side of it i think.
>
> <!--Load the AJAX API-->
> <script type="text/javascript" src="https://www.google.com/jsapi
> "></script>
> <script type="text/javascript" src="//
> ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
> <script type="text/javascript">
>
> google.load('visualization', '1', {'packages': ['geochart']});
> google.setOnLoadCallback(drawMarkersMap);
>
> function drawMarkersMap() {
> $.ajax({
> url: "getData.json",
> dataType:"json",
> success: function (json) {
> // Create our data table out of JSON data loaded from server.
> var data = new google.visualization.DataTable(jsonData);
> var options = {
> region: 'US',
> displayMode: 'markers',
> colorAxis: {colors: ['green', 'blue']}
> };
> var chart = new google.visualization.GeoChart(
> document.getElementById('visualization'));
> chart.draw(data, options);
> };
> </script>
>
> of course, there is a :
> <div id="visualization" style="width: 900px; height: 500px;"></div>
>
> Next up is the getData2.php , taken right from google documentation:
>
> <?php
> $string = file_get_contents("centers2.json");
> echo $string;
> ?>
>
> Here is a shortened version of the json file:
>
> {
>
>
> "cols": [
> {"id":"","label":"Center","pattern":"","type":"string"},
> {"id":"","label":"No. of Registerees","pattern":"","type":"number"}
> ],
> "rows": [
> {"c":[{"v":"1 E 161st St Bronx, NY 10451"},{"v":98765}]},
> {"c":[{"v":"123-01 Roosevelt Ave New York, NY 11368"},{"v":96543}]},
>
> {"c":[{"v":"4 Yawkey Way Boston, MA 02215"},{"v":43566}]}
> ]
> }
>
>
> Any suggestions? I can get this to work by hard coding data in. Is there
> any easy way to track where these calls are hanging? Any input is greatly
> appreciated. Thanks!
>
>
--
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/groups/opt_out.