I saw this posted on StackOverflow (http://stackoverflow.com/questions/21478450/google-visualization-data-table-is-not-visualized) - did that resolve your problem?
On Friday, January 31, 2014 7:58:01 AM UTC-5, Stelios Voskos wrote: > > I have implemented part of the functionality f my dashboard in different > files and now I'm trying to merge them all together. My dashboard is > getting an address from a geocoding field and retrieves url json data from > a website. Then the data are visualized on the map,on a data table and on a > scatter chart. Now I'm trying to merge the google map with the data table, > but it's been a couple of hours that I'm getting the following error: > Uncaught > TypeError: Object #<Object> has no method 'load' I'm trying to change the > order that the libraries are loaded, but I didn't see any result. Also, the > data table and scatter graph are not displayed The problem arises when I > include both APIs(Map and visualization). Here is part of my code. If you > need more code, please find attatched the 2 documents that I'm enclosing to > you. Thank you. > > Javascript: > > <script > src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false";></script><script > type="text/javascript" > src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script><script > src="http://code.jquery.com/jquery-1.10.1.min.js";></script> <!-- jQuery CDN > --><script type="text/javascript"> > google.load('visualization', '1', {'packages':['table']}); > google.setOnLoadCallBack(drawTable); > var geocoder; > var map; > var latlng; > var markers = []; > var myPositionMarker = null;; > //Initializing the map > function initialize() { > var lat = 52.629729; > var lng = -1.131592; > geocoder = new google.maps.Geocoder(); > latlng = new google.maps.LatLng(lat, lng); > var mapOptions = { > zoom: 8, > center: latlng > } > map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions); > getCrimeByLocation(lat, lng); > } > function geocodeCrimeLocation(date){ > var address = document.getElementById('address').value; > geocoder.geocode( { 'address': address}, function(results, status) { > if (status == google.maps.GeocoderStatus.OK) { > map.setCenter(results[0].geometry.location); > var latitude = results[0].geometry.location.lat(); > var longitude = results[0].geometry.location.lng(); > if(date == null){ > var d = new Date(); > date = d.getFullYear() + '-' + (d.getMonth()+1); > //hardcoding as of now as jan 2014 data is not there, remove when req > date = "2013-01"; > } > $.getJSON( > "http://data.police.uk/api/crimes-street/all-crime?lat="+latitude+"&lng="+longitude+"&date="+date, > function(data) { > while(markers.length > 0){ > markers.pop().setMap(null); > } > > //marking the requested position > addMyPositionMarker(latitude, longitude); > > $.each( data, function( key, val ) { > //var myLatlng = new google.maps.LatLng(val.location.latitude, > val.location.longitude); > var marker = new google.maps.Marker({ > position: new google.maps.LatLng(val.location.latitude, > val.location.longitude), > map: map, > animation: google.maps.Animation.DROP, > draggable: false, > title: val.location.street.name > }); > markers.push(marker); // saving markers for reference, so that we can > remove them later > }); > > if(markers.length > 0){ > fitBoundsMap(); > } > }); > > } else { > alert('Geocode was not successful for the following reason: ' + status); > } > }); > } > function drawTable(){ > var jsonData = $.ajax({ > url: "getJSONData.php", > dataType:"json", > async: false > }).responseText; > var dataTable = new google.visualization.DataTable(); > dataTable.addColumn('string','category'); > dataTable.addColumn('string','context'); > dataTable.addColumn('number','id'); > dataTable.addColumn('string','location_subtype'); > dataTable.addColumn('string','location_type'); > dataTable.addColumn('string','month'); > dataTable.addColumn('string','persistent_id'); > dataTable.addColumn('string','street name'); > var json=JSON.parse(jsonData); > for (var i=0; i<json.length; i++) { > delete json[i].outcome_status; > var row = []; > row.push(json[i].category); > row.push(json[i].context); > row.push(json[i].id); > row.push(json[i].location_subtype); > row.push(json[i].location_type); > row.push(json[i].month); > row.push(json[i].persistent_id); > row.push(json[i].location.street.name); > dataTable.addRow(row); > } > var chart = new > google.visualization.Table(document.getElementById('table_div')); > chart.draw(dataTable, {width: 1000, height: 300}); > } > > HTML: > > <body onload="initialize()"><!-- <div id="map-canvas" style="width: 320px; > height: 480px;"></div> --><div id="map-canvas" style="width: 100%; height: > 480px;"></div><div> > <input id="address" type="textbox" placeholder = "Enter address, or > postcode"> > <input type="button" value="Encode" > onclick="geocodeCrimeLocation()"></div><br><div id = > "pieChart_div"></div><br><div id = "table_div"></div></body> > > PHP: > > <?php > $json = > file_get_contents('http://data.police.uk/api/crimes-street/all-crime?lat=$_GET['latitude']&lng=$_GET['longitude']&date=2013-01'); > > $json = str_replace("\xe2\x80\xa8", '\\u2028', $json); > $json = str_replace("\xe2\x80\xa9", '\\u2029', $json); > echo $json;?> > > -- 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.
