下面是谷歌图表的 Javascript。我在我的 html 中添加了以下内容,然后使用我合并了每个 id 的表编写了 html 代码。但是每个图表之间的空间从上到下和从左到右变得太多。即使我没有为表格提供任何 css 属性,我该如何控制它。
google.load("visualization", "1", {packages:["corechart"]});
google.setOnLoadCallback(drawChart);
function drawChart() {
var data1 = google.visualization.arrayToDataTable([
['Task', 'Question1'],
['I don’t know', 11],
['No', 49],
['Yes', 40]
]);
var options1 = {
title: 'Question1',
pieHole: 0.4,
chartArea:{left:8},
'width': 400,
'height': 400,
colors: [ '#9bbb59', '#c0504d', '#4f81bd']
};
var data2 = google.visualization.arrayToDataTable([
['Task', 'Question2],
['Significant', 32],
['Moderate', 60],
['Minor', 8]
]);
var options2 = {
title: 'Question2'
pieHole: 0.4,
chartArea:{left:8},
'width': 400,
'height': 400,
colors: ['#c0504d', '#9bbb59', '#4f81bd']
};
var data3 = google.visualization.arrayToDataTable([
['Task', 'Question3'],
['I don’t know', 24],
['From another platform', 11],
['Within the current team', 65]
]);
var options3 = {
title: 'Question3',
pieHole: 0.4,
chartArea:{left:8},
'width': 400,
'height': 400,
colors: [ '#9bbb59', '#c0504d', '#4f81bd']
};
var data4 = google.visualization.arrayToDataTable([
['Task', 'Question4'],
['I don’t know', 16],
['No', 19],
['Yes', 65]
]);
var options4 = {
title: '4. Question4',
pieHole: 0.4,
chartArea:{left:8},
'width': 400,
'height': 400,
colors: [ '#9bbb59', '#c0504d', '#4f81bd']
};
var data5 = google.visualization.arrayToDataTable([
['Task', 'Question5'],
['A clear, formalized and well distributed carried interest program', 38],
['The availability of equity in the GP', 24],
['Annual cash compensation that keeps up with the market', 22],
['Other (please specify)', 16]
]);
var options5 = {
title: 'Question5',
position: 'left',
legend : { position:"right"},
pieHole: 0.4,
chartArea:{left:0, width:"100%",height:"45%"},
colors: ['#4f81bd', '#c0504d', '#9bbb59', '#8064a2']
};
var chart1 = new google.visualization.PieChart(document.getElementById('donutchart1'));
chart1.draw(data1, options1);
var chart2 = new google.visualization.PieChart(document.getElementById('donutchart2'));
chart2.draw(data2, options2);
var chart3 = new google.visualization.PieChart(document.getElementById('donutchart3'));
chart3.draw(data3, options3);
var chart4 = new google.visualization.PieChart(document.getElementById('donutchart4'));
chart4.draw(data4, options4);
var chart5 = new google.visualization.PieChart(document.getElementById('donutchart5'));
chart5.draw(data5, options5);
}