如何增加 Google Charts 中 y 轴的长度？答案

【问题标题】：How can I increase length of y-axis in Google Charts?如何增加 Google Charts 中 y 轴的长度？
【发布时间】：2016-05-21 11:59:35
【问题描述】：

我正在使用 Google 图表。我正在使用的 JavaScript：

function drawChart3() {
    var data3 = google.visualization.arrayToDataTable([
        ['Day', 'Sales','exp'],
        ['4-APRIL-16', 1000,200],
        ['5-APRIL-16', 1170,300],
        ['6-APRIL-16', 660,400],
        ['7-APRIL-16', 1030,500],
        ['8-APRIL-16', 60,4100],
        ['9-APRIL-16', 130,5020],
        ['10-APRIL-16', 60,4100],
        ['11-APRIL-16', 130,5020],
    ]);

    var options3 = {
        title: 'Company Performance',
        curveType: 'function',
        legend: {
            position: 'bottom'
        }
    };

    var chart3 = new  google.visualization.LineChart(document.getElementById('curve_chart'));

    chart3.draw(data3, options3);

如果您看到页面的图像，则日期的 y 轴标签未对齐。如何正确对齐它们？

【问题讨论】：

请注意，您的代码示例不完整，缺少括号。确保您的代码中没有小错误。

标签： javascript graph charts google-visualization

【解决方案1】：

您有两种选择。图表的尺寸将通过以下方式设置：

包含元素的尺寸，或：
通过在图表选项中设置高度和宽度属性。

下面将向您展示这两种方法都改编自您的代码。

http://jsbin.com/televe/edit?html,css,js,console,output

要么：

#curve_chart {
  width: 200px;
}

或

var options4 = {
  title: 'Company Performance',
  curveType: 'function',
  height: 400,
  width: 300,
  legend: {
  position: 'bottom'
  }
};

宽度由你决定。

参考： https://developers.google.com/chart/interactive/docs/basic_customizing_chart#specify-options

【讨论】：