刚刚开始使用Google图表,我正在尝试创建一个填充可用空间的折线图.似乎图表被锁定在某个宽高比中,但无论我为图表和图表div元素更改高度和宽度属性,结果都与我的尺寸不匹配.
谷歌图表是固定的,还是我缺少的覆盖或宽高比选项?
你可以在这里找到一个例子:
http://www.walkingcarpet.net/graphs/unemployment-rate/
谢谢!
除了设置width
选项,
设置chartArea.width
以确保图表利用可用空间
此外,当调整窗口大小时,需要重新绘制图表
请参阅以下工作代码段...
google.charts.load('current', {
callback: function () {
drawChart();
$(window).resize(drawChart);
},
packages:['corechart']
});
function drawChart() {
var data = google.visualization.arrayToDataTable([
['x', 'y'],
[0, 0],
[1, 1],
[2, 3],
[3, 7],
[4, 15],
[5, 31]
]);
var options = {
chartArea: {
// leave room for y-axis labels
width: '94%'
},
legend: {
position: 'top'
},
width: '100%'
};
var container = document.getElementById('chart_div');
var chart = new google.visualization.LineChart(container);
chart.draw(data, options);
}