在HTML页面顶部形成奇数空格

时间:2015-10-25 10:29:26

标签: javascript html google-visualization material

我正在使用Google Charts API创建一个柱形图 - > http://plnkr.co/edit/GTg6MfMephB8lR3Kp66S?p=preview

但由于某种原因,在页面顶部形成一个奇怪的空间。

在我更改了材料图表库后,这种情况开始发生了:

google.load("visualization", "1.1", {packages:["bar"]});
var chart = new google.charts.Bar(document.getElementById('columnchart_material'));

var data = new google.visualization.DataTable();

并使用了经典图表(我需要它,因为材料库不完整而且它不允许自定义工具提示):

google.load('visualization', '1', {packages: ['corechart', 'bar']});
var chart = new google.visualization.BarChart(document.getElementById('columnchart_material'));

var data = google.visualization.arrayToDataTable([]);

这是原始材料图表 - > http://plnkr.co/edit/dMVKt3ISlMtyiYmVeN1K?p=preview

出了什么问题?

2 个答案:

答案 0 :(得分:1)

有点黑客但下面会"排序" ...

#columnchart_material{margin-top:-500px}

不过可以解决为什么它首先发生的事情吗?

答案 1 :(得分:1)

添加图表区域的设置,例如:

chartArea: { width: '100%', height: '99%' },

或:

chartArea: { left: 0, top: 30, width: 1200, height: 5450 },