谷歌条形图不会是透明背景

Question

我使用这些代码，但我无法制作透明背景。另外，我无法为数据循环。我尝试使用 data.addColumn(ar[i]，ar2[i]( 进行循环，但不会成功。

function drawPaLoChart() {
var data = google.visualization.arrayToDataTable([
['Hours', 'Seconds'],
['0',  pageload[0]],
['1',  pageload[1]],
['21',  pageload[21]],
['22',  pageload[22]],
['23',  pageload[23]]
]);
var options = {
chart: {
legend: { position: 'none' },
title: 'Company Performance',
subtitle: 'Sales, Expenses, and Profit: 2014-2017',
axes: {
x: {
0: { side: 'top', label: 'White to move'} // Top x-axis.
}
},
bar: { groupWidth: "90%" },
backgroundColor: {fill: 'transparent'},
chartArea: {
backgroundColor: 'transparent'
}
}
};
var chart = new google.charts.Bar(document.getElementById('palochart'));
chart.draw(data, google.charts.Bar.convertOptions(options));
}

Answer 1

首先，图表键中只有title和subtitle选项应该在图表键内，
如下所示...

var options = {
chart: {
title: 'Company Performance',
subtitle: 'Sales, Expenses, and Profit: 2014-2017',
},
legend: { position: 'none' },
axes: {
x: {
0: { side: 'top', label: 'White to move'} // Top x-axis.
}
},
bar: { groupWidth: "90%" },
backgroundColor: {fill: 'transparent'},
chartArea: {
backgroundColor: 'transparent'
}
};

至于循环，使用数组在循环中构建数据......

var chartData = [
['Hours', 'Seconds']
];
for (var i = 0; i < pageload.length; i++) {
chartData.push([i.toString(), pageload[i]]);
}
var data = google.visualization.arrayToDataTable(chartData);