Hi
I am trying to embed a table and a map in my website. I have found out how
to make the table with filters. But I have problems making the map work as
well.
When I'm trying to do this, it shows an error saying:
The columns type does not match the supported data format. See
documentation for supported formats.×
I don't know if the kind of map is not working anymore, or it is because of
my lack of skills (wouldn't suprise).
I really hope someone can help me.
And here is my script:
<script type="text/javascript"
src="https://www.google.com/jsapi";></script>
<script type="text/javascript">
google.load('visualization', '1.0', {'packages':['controls', 'table',
'map']});
google.setOnLoadCallback(drawDashboard);
function drawDashboard() {
var query = new
google.visualization.Query('https://docs.google.com/spreadsheet/tq?key=0Am7E06r_2i5edE80a0MxSUtTUURSaHdicDBNYUdYVXc&transpose=0&headers=1&range=A1%3AL165&gid=0&pub=1');
query.setQuery('SELECT A,B,C,D,E,F,G,H,I,J,K,L');
query.send(handleQueryResponse);
}
function handleQueryResponse(response) {
if (response.isError()) {
alert('Error in query: ' + response.getMessage() + ' ' +
response.getDetailedMessage());
return;
}
var data = response.getDataTable();
var dashboard = new google.visualization.Dashboard(
document.getElementById('dashboard_div'));
var filter = new google.visualization.ControlWrapper({
'controlType': 'CategoryFilter',
'containerId': 'control1',
'options': {
'filterColumnLabel': 'År',
'ui': {
'allowTyping': false,
'allowMultiple': true,
'selectedValuesLayout': 'belowWrapping',
'labelStacking': 'vertical',
'caption': 'Vælg et år'
}
}
});
var filter2 = new google.visualization.ControlWrapper({
'controlType': 'CategoryFilter',
'containerId': 'control2',
'options': {
'filterColumnLabel': 'Køn',
'ui': {
'allowTyping': false,
'allowMultiple': true,
'selectedValuesLayout': 'belowWrapping',
'labelStacking': 'vertical',
'caption': 'Vælg køn'
}
}
});
var filter3 = new google.visualization.ControlWrapper({
'controlType': 'CategoryFilter',
'containerId': 'control3',
'options': {
'filterColumnLabel': 'Element',
'ui': {
'allowTyping': false,
'allowMultiple': true,
'selectedValuesLayout': 'belowWrapping',
'labelStacking': 'vertical',
'caption': 'Vælg element'
}
}
});
var filter4 = new google.visualization.ControlWrapper({
'controlType': 'CategoryFilter',
'containerId': 'control4',
'options': {
'filterColumnLabel': 'Modpart',
'ui': {
'allowTyping': false,
'allowMultiple': true,
'selectedValuesLayout': 'belowWrapping',
'labelStacking': 'vertical',
'caption': 'Vælg modpart'
}
}
});
var table = new google.visualization.ChartWrapper({
'chartType': 'Table',
'containerId': 'chart2',
'options': {
'width': '900px',
'height': '1200px'
}
});
var map1 = new google.visualization.ChartWrapper({
'chartType': 'Map',
'containerId': 'map1',
'view': { 'columns': [8, 9]}
});
dashboard.bind([filter, filter2, filter3, filter4], [table, map1]);
dashboard.draw(data);
}
</script>
<p> </p>
<!--Div that will hold the dashboard-->
<div id="dashboard_div">
<!--Divs that will hold each control and chart-->
<div id="control1"></div>
<div id="control2"></div>
<div id="control3"></div>
<div id="control4"></div>
<div id="chart2"></div>
<div id="map1"></div>
</div>
And if you need the link to my spreadsheet:
https://docs.google.com/spreadsheet/ccc?key=0Am7E06r_2i5edE80a0MxSUtTUURSaHdicDBNYUdYVXc&usp=sharing
Cheers
Nikolaj
--
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?hl=en.
For more options, visit https://groups.google.com/groups/opt_out.
