Javascript 从Google图表中的列图表创建摘要表
我正在谷歌图表中创建一个柱状图,我还想创建一个表格图表,显示基于列值的摘要数据,即。平均值,最小值,最大值,总计 我在drawchart函数外将这些变量声明为全局变量(初始化为0),并在drawchart函数内赋值(不带var):Javascript 从Google图表中的列图表创建摘要表,javascript,charts,google-visualization,Javascript,Charts,Google Visualization,我正在谷歌图表中创建一个柱状图,我还想创建一个表格图表,显示基于列值的摘要数据,即。平均值,最小值,最大值,总计 我在drawchart函数外将这些变量声明为全局变量(初始化为0),并在drawchart函数内赋值(不带var): 但这些值仍保持其初始值(零)。是否有方法将计算值从图表函数传递到表格函数?不确定从现在起在何处调用drawTable, 但是,可以将值从图表函数传递到表格函数 在图表功能中创建statsData, 然后将其传递给table函数。 并删除当前正在调用表函数的任何位置
但这些值仍保持其初始值(零)。是否有方法将计算值从图表函数传递到表格函数?不确定从现在起在何处调用
drawTable
,但是,可以将值从图表函数传递到表格函数 在图表功能中创建
statsData
,然后将其传递给table函数。
并删除当前正在调用表函数的任何位置
totCost = getSum(data, 3);
aveCost = totCost / n_rows;
minCost = range.min;
maxCost = range.max;
statsData = [
['Stat', 'Cost'],
['Average', aveCost],
['Minimum', minCost],
['Maximum', maxCost],
['Total', totCost]
];
drawTable(statsData);
...
function drawTable(statsData) {
...
请参阅以下代码段…函数drawPower(){ $.get(“costs_daily.csv”,函数(csvString){ //将CSV字符串转换为二维数组 var arrayData=$.csv.toarray(csvString,{onParseValue:$.csv.hooks.castToScalar})
//此新DataTable对象包含所有数据
var data=新的google.visualization.arrayToDataTable(arrayData);
///获取最小、最大成本
var范围=data.getColumnRange(3);
var n_rows=data.getNumberOfRows();
函数getSum(数据,行){
var合计=0;
对于(i=0;i
不确定从现在起在何处调用drawTable
,但是,可以将值从图表函数传递到表格函数 在图表功能中创建
statsData
,然后将其传递给table函数。
并删除当前正在调用表函数的任何位置
totCost = getSum(data, 3);
aveCost = totCost / n_rows;
minCost = range.min;
maxCost = range.max;
statsData = [
['Stat', 'Cost'],
['Average', aveCost],
['Minimum', minCost],
['Maximum', maxCost],
['Total', totCost]
];
drawTable(statsData);
...
function drawTable(statsData) {
...
请参阅以下代码段…函数drawPower(){ $.get(“costs_daily.csv”,函数(csvString){ //将CSV字符串转换为二维数组 var arrayData=$.csv.toarray(csvString,{onParseValue:$.csv.hooks.castToScalar})
//此新DataTable对象包含所有数据
var data=新的google.visualization.arrayToDataTable(arrayData);
///获取最小、最大成本
var范围=data.getColumnRange(3);
var n_rows=data.getNumberOfRows();
函数getSum(数据,行){
var合计=0;
对于(i=0;i totCost = getSum(data, 3);
aveCost = totCost / n_rows;
minCost = range.min;
maxCost = range.max;
statsData = [
['Stat', 'Cost'],
['Average', aveCost],
['Minimum', minCost],
['Maximum', maxCost],
['Total', totCost]
];
drawTable(statsData);
...
function drawTable(statsData) {
...
// this new DataTable object holds all the data
var data = new google.visualization.arrayToDataTable(arrayData);
/// get min, max cost
var range = data.getColumnRange(3);
var n_rows = data.getNumberOfRows();
function getSum(data, row) {
var total = 0;
for (i = 0; i < n_rows; i++)
total = total + data.getValue(i, row);
return total;
}
totCost = getSum(data, 3);
aveCost = totCost / n_rows;
minCost = range.min;
maxCost = range.max;
statsData = [
['Stat', 'Cost'],
['Average', aveCost],
['Minimum', minCost],
['Maximum', maxCost],
['Total', totCost]
];
drawTable(statsData);
var options = {
title: 'Costs for last 30 days',
titleTextStyle: {color: 'grey', fontSize: 16},
hAxis: {title: 'Date', titleTextStyle: {bold: false, italic: false, color: 'grey'}, slantedTextAngle: 90, textStyle: {fontSize: 12}},
legend: {position: 'top'},
vAxes: {
0: {title: 'Cost (p)', titleTextStyle: {bold: false, italic: false, color: 'grey'}},
},
focusTarget: 'category',
intervals: {color:'#000000',
textStyle: { color: 'none'}},
series: {
0: {color: '#44AA99', type: 'bars'},
1: {color: '#DDCC77', type: 'bars'},
2: {
color: 'transparent',
type: 'line',
lineWidth: 0,
pointSize: 0,
enableInteractivity: false,
visibleInLegend: false
}
},
interpolateNulls: true,
bar: { groupWidth: '75%' },
isStacked: true,
};
var formatter = new google.visualization.NumberFormat(
{prefix: '£', fractionDigits: 2}
);
formatter.format(data,1);
formatter.format(data,2);
formatter.format(data,3);
var chart = new google.visualization.ComboChart(document.getElementById('power_div'));
chart.draw(data, options);
},'text');
}
function drawTable(statsData) {
var stats = new google.visualization.arrayToDataTable(statsData);
var options = {
showRowNumber: false,
width: '100%',
height: '100%'
};
var formatter = new google.visualization.NumberFormat(
{prefix: '£', fractionDigits: 2}
);
formatter.format(stats,1);
var table = new google.visualization.Table(document.getElementById('table_div'));
table.draw(stats, options);
}