谷歌图表增加了y轴宽度的增加

时间:2016-06-01 08:04:37

标签: javascript php charts

如何增加Google图表y轴宽度。请找到图像。左侧全文未正确。请指导我。 how to increase Google chart y axis width

1 个答案:

答案 0 :(得分:1)

需要在options

中调整图表和chartArea的大小

为左侧的y轴标签留出空间,使用chartArea.left

为标题留出空间,使用chartArea.top

参见以下示例,添加颜色以突出显示每个区域......



google.charts.load('current', {
  callback: function () {
    var data = google.visualization.arrayToDataTable([
      ['Category', 'Score'],
      ['APPLYING LEADERSHIP TECHNIQUES', 40],
      ['ASSERTIVENESS', 30],
      ['COACHING, COUNSELING, TEACHING', 10],
      ['CONFLICT MANAGEMENT', 20]
    ]);

    var options = {
      // adjust chart size
      height: 600,
      width: 800,
      chartArea: {
        // adjust chart area size
        left: 300,
        top: 40,
        height: 500,
        width: 480,
        backgroundColor: 'magenta'
      },
      backgroundColor: 'cyan',
      colors: ['lime'],
      legend: {
        position: 'bottom'
      },
      title: 'Title'
    };

    var chart2 = new google.visualization.BarChart(document.getElementById('barchart_core'));
    chart2.draw(data, options);
  },
  packages: ['bar', 'corechart']
});

<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="barchart_core"></div>
&#13;
&#13;
&#13;