我正在绘制GeoChart直接从Google表格中获取数据。电子表格具有以下结构:
ISO 3166-2 NumValue1 NumValue2 Country name
XX XX XX XX
XX XX XX XX
我想将Col0
用作区域标识符,使用Col1作为值,我想将Col3
显示为工具提示标题,并Col1
&工具提示中的Col2
(col标题为标签)。
以下代码有效(区域使用Col0
显示,值取自Col1
),但我需要更改它,以便工具提示显示其他列的数据(而不是来自其他列) Col0
)。
google.setOnLoadCallback(drawRegionsMap);
function drawRegionsMap() {
var query = new google['visualization'].Query('https://docs.google.com/spreadsheets/d/____&headers=1&range=A1:C')
query.send(handleQueryResponseTR);
}
function handleQueryResponseTR(response) {
if (response.isError()) {
alert('Error in query: ' + response.getMessage() + ' ' + response.getDetailedMessage());
return;
}
var options = {
displayMode: 'regions',
sizeAxis: {
minValue: 0,
maxValue: 5
},
colorAxis: {
colors: ['#fff', '#000']
},
legend: 'none'
};
var data = response.getDataTable();
var chart = new google.visualization.GeoChart(document.getElementById('geochart-colors'));
var table = new google.visualization.Table(document.getElementById('table_div'));
chart.draw(data, options);
table.draw(data, {
width: '100%',
height: '100%'
});
};
我已阅读文档,似乎最好的方法是将chart.draw(data, options);
更改为chart.draw(view, options);
,然后再添加:
// defines the data for the tooltip
var formatter = new google.visualization.PatternFormat('{0}');
formatter.format( data, [0,1], 1 );
var formatter = new google.visualization.PatternFormat('{2}');
formatter.format( data, [0,1,2], 0 );
// defines the data for the chart values
var view = new google.visualization.DataView(data);
view.setColumns([0, 1]);
但我真的不明白如何使用格式化工具将工具提示显示为:
Col3 (Title)
Col1 (label): Col1 value
Col2 (label): Col2 value
此外,每当我更改查询网址以包含第四列(&range=A1:D
)时,我都会收到Incompatible data table: Error: Table contains more columns than expected (Expecting 3 columns)
错误。