【发布时间】：2017-03-12 01:56:10
【问题描述】：
我尝试了几天没有成功聚合列。我也到处找，一无所获。我想将第 1 列（具有多个相同值的字符串）分组并对第 6、7、8 列（数字）求和，然后我想选择一个选项来显示第 6、7 或 8 列。
我希望我说得很清楚，并且一个解决方案可以帮助很多人。
下面我想分享一段代码。
这个例子类似：http://jsfiddle.net/guilhermelight1/fcqeA/80/
我也试过 calc: function()...
function drawVisualization() {
var query = new google.visualization.Query('https://spreadsheets.google.com/tq?key=xxxxxx&sheet=data');
query.setQuery("select B,I,J,O,P,Q,R,S,T where O is not null Order by Q desc ");
query.send(handleQueryResponse);
}
function handleQueryResponse(response) {
if (response.isError()) {
alert('Error in query: ' + response.getMessage() + ' ' + response.getDetailedMessage());
return;
}
var data = response.getDataTable();
var tableChartB = new google.visualization.ChartWrapper({
'chartType': 'Table',
'containerId': 'table_divB',
'options': {
'width': '100%'
},
'view': {'columns': [0,1,2,3,4,5,6,7,8]}
});
var columnChart2 = new google.visualization.ChartWrapper({
'chartType': 'ColumnChart',
'containerId': 'Column_div',
'view': {'columns': [1,6,7,8]},
'options': {
'bar': {'groupWidth': '95%'},
'backgroundColor': 'transparent',
'animation': {'duration': 1000, 'easing': 'out'},
'legend': { 'position': 'top', 'alignment': 'start' },
'width': '100%',
'height': '90%',
'chartArea': {'top': '10%', 'width': '85%','height': '80%' },
'displayAnnotations': 'true',
'hAxis': {'gridlines': { 'count': 40, 'color': 'transparent' } ,'textStyle':{'fontSize': 8.5}, 'slantedText': false, 'showTextEvery': 1,'minTextSpacing': 0,},
'tooltip.isHtml': 'true',
'pointSize': 2,
'allowHtml': true,
'vAxis': {'textStyle': {'fontSize': 9,'color': '#585858'},'minTextSpacing': 0},
// 'dataTable' : google.visualization.data.group(data, [1],[{'column': 8, 'aggregation': google.visualization.data.sum, 'type': 'number'}])
}});
google.visualization.events.addListener(tableChartB, 'ready',
function(event) {
// group the data of the filtered table and set the result in the pie chart.
columnChart2.setDataTable( google.visualization.data.group(
// get the filtered results
tableChartB.getDataTable(),
[1],
[{'column': 6, 'aggregation': google.visualization.data.sum, 'type': 'number'},
{'column': 7, 'aggregation': google.visualization.data.sum, 'type': 'number'},
{'column': 8, 'aggregation': google.visualization.data.sum, 'type': 'number'}]
));
// redraw the pie chart to reflect changes
columnChart2.draw();
});
google.visualization.events.addListener(tableChartB, 'statechange',
function(event) {
// group the data of the filtered table and set the result in the pie chart.
columnChart2.setDataTable( google.visualization.data.group(
// get the filtered results
tableChartB.getDataTable(),
[1],
[{'column': 6, 'aggregation': google.visualization.data.sum, 'type': 'number'},
{'column': 7, 'aggregation': google.visualization.data.sum, 'type': 'number'},
{'column': 8, 'aggregation': google.visualization.data.sum, 'type': 'number'}]
));
// redraw the pie chart to reflect changes
columnChart2.draw();
});
$('#subc').change(function () {
var options = $("#subc option");
var optionSelected = options.index(options.filter(":selected"));
if (optionSelected === 0) {
tableChartB.setView({
'columns': [0,1,2,3,4,5,6,7,8]
});
columnChart2.setView({
'columns': [1,6,7,8 ]
});
columnChart2.setOption('colors', ["#FFC000","#00b0f0","#ff0000"]);
} else if (optionSelected === 1) {
tableChartB.setView({
'columns': [0,1,2,3,4,5,6,7,8]
});
columnChart2.setView({
'columns': [1,{
'type': 'number',
'label': 'Average',
'calc': function (dt, row) {
return group.getValue(0, 1);
}, 6 ]
});
columnChart2.setOption('colors', ["#FFC000"]);
} else if (optionSelected === 2) {
tableChartB.setView({
'columns': [0,1,2,3,4,5,6,7,8]
});
columnChart2.setView({
'columns': [1,7]
});
columnChart2.setOption('colors', ["#00b0f0"]);
} else if (optionSelected === 3) {
tableChartB.setView({
'columns': [0,1,2,3,4,5,6,7,8]
});
columnChart2.setView({
'columns': [1,8 ]
});
columnChart2.setOption('colors', ["#ff0000"]);
} else {
tableChartB.setView({
'columns': [0,1,2,3,4,5,6,7,8]
});
columnChart2.setView({
'columns': [1,6,7,8 ]
});
columnChart2.setOption('colors', ["#FFC000","#00b0f0","#ff0000"]);
}
drawChart();
});
}
<label class="google-visualization-controls-label"></label>
<select id="subc" class="filter">
<option selected="selected" value="a1">Dia-h</option>
<option value="a2">Dia</option>
<option value="a3">Calendário</option>
<option value="a4">Hora</option>
</select>
【问题讨论】：
标签： google-apps-script google-visualization