Hi Sanne, The issue here isn't the .getDataTable() call. The issue is the types of columns that you're trying to pass to the Map visualization. Primarily, it has an issue with the third column, which is numbers. If you open the developer tools in Chrome, you can see the error "Uncaught Error: Column 2 must be of type string; was number". Simply fetching the first two columns, instead of all three makes the Map work: http://jsfiddle.net/jLvve8b8/
On Fri, Aug 14, 2015 at 9:26 AM Sanne de Boer <sanne.w.deb...@gmail.com> wrote: > Hi, > > Been trying to get to know the Google Visualizations and already got a lot > of answers from reading and researching here, but I got stuck on 1 item I > can't get fixed. > > I'm trying to load data from a Google Spreadsheet by performing a database > query. Until now this works for all charts I have tried expect the chart > "Maps". > > For example this works for the geochart and bar chart: > > <script type='text/javascript' src='https://www.google.com/jsapi'></script> > <script type='text/javascript'> > google.load('visualization', '1', {'packages': ['geochart']}); > google.setOnLoadCallback(drawGID); > > function drawGID() { > var queryString = encodeURIComponent('SELECT E, F, G LIMIT 5'); > var query = new google.visualization.Query( > > 'https://docs.google.com/spreadsheets/d/1jzPF0FF2gP6-z_l0LsfooJP7gY6WOZfH-FoynPNiuu8/gviz/tq?gid=0&headers=1&tq=' > + queryString); > query.send(handleQueryResponse); > } > > function handleQueryResponse(response) { > if (response.isError()) { > alert('Error in query: ' + response.getMessage() + ' ' + > response.getDetailedMessage()); > return; > } > > var data = response.getDataTable(); > var options = { > region: 'NL', > displayMode: 'markers', > colorAxis: {colors: ['green', 'blue']} > }; > > var chart = new > google.visualization.GeoChart(document.getElementById('chart_div')); > chart.draw(data, options); > }; > </script> > > > But when I try this for Maps it won't work: > > <script type="text/javascript" src="https://www.google.com/jsapi"></script> > <script>google.load('visualization', '1', { 'packages': ['map'] }); > google.setOnLoadCallback(drawGID); > > function drawGID() { > var queryString = encodeURIComponent('SELECT E, F, G LIMIT 4'); > var query = new google.visualization.Query( > > 'https://docs.google.com/spreadsheets/d/1jzPF0FF2gP6-z_l0LsfooJP7gY6WOZfH-FoynPNiuu8/gviz/tq?gid=0&headers=1&tq=' > + queryString); > query.send(handleQueryResponse); > } > > function handleQueryResponse(response) { > if (response.isError()) { > alert('Error in query: ' + response.getMessage() + ' ' + > response.getDetailedMessage()); > return; > } > > var data = response.getDataTable(); > var options = { showTip: true }; > > var map = new > google.visualization.Map(document.getElementById('chart_div')); > map.draw(data, options); > }; > </script> > > > I'm guessing something goes wrong with > var data = response.getDataTable(); > > although I have no idea why. > > The test sheet can be viewed here > <https://docs.google.com/spreadsheets/d/1jzPF0FF2gP6-z_l0LsfooJP7gY6WOZfH-FoynPNiuu8/> > and there is a button called "Dashboard" to load the charts. > > Any help would be great! > > 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 google-visualization-api+unsubscr...@googlegroups.com. > To post to this group, send email to > google-visualization-api@googlegroups.com. > Visit this group at > http://groups.google.com/group/google-visualization-api. > For more options, visit https://groups.google.com/d/optout. > -- 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 google-visualization-api+unsubscr...@googlegroups.com. To post to this group, send email to google-visualization-api@googlegroups.com. Visit this group at http://groups.google.com/group/google-visualization-api. For more options, visit https://groups.google.com/d/optout.