Google Charts：hAxisの埋め込みを設定する

Question

hAxisのラベルがチャート自体と凡例との間にほとんど埋め込まれていないことを除いて、私のチャートは正常に動作します。それを増やす方法はありますか？

オプション：

var options = { 
      colors:['rgb(32, 170, 188)', 'rgb(32, 188, 77)'], 
      lineWidth:4, 
      areaOpacity: 0.15, 
      width:$(window).width() * 0.5, 
      height:$(window).width() * 0.25, 
      animation: { 
       "startup": true, 
       duration: 1200, 
       easing: 'out', 
      }, 
      fontName: 'Open Sans', 
      legend: { 
      position:'bottom', 
      }, 
      chartArea:{ 
      width:'90%', 
      height:'80%', 
      } 
     }; 

Answer 1

私は考えることができる唯一のオプションは、チャートが'ready'したら、ラベルを変更するだろう、
またはこの例では'animationfinish'

に、 y位置が4

は他のオプションがあるかもしれないアニメーションでびくびく、
の種類を探しますあなたはSVG

google.charts.load('current', { 
 
    'callback': function() { 
 
    var data = google.visualization.arrayToDataTable([ 
 
     ['Year', 'Sales', 'Expenses'], 
 
     ['2013', 1000,  400], 
 
     ['2014', 1170,  460], 
 
     ['2015', 660,  1120], 
 
     ['2016', 1030,  540] 
 
    ]); 
 

 
    var options = { 
 
     colors:['rgb(32, 170, 188)', 'rgb(32, 188, 77)'], 
 
     lineWidth:4, 
 
     animation: { 
 
     startup: true, 
 
     duration: 1200, 
 
     easing: 'out', 
 
     }, 
 
     areaOpacity: 0.15, 
 
     fontName: 'Open Sans', 
 
     legend: { 
 
     position:'bottom', 
 
     }, 
 
     chartArea:{ 
 
     } 
 
    }; 
 

 
    var container = document.getElementById('chart_div'); 
 
    var chart = new google.visualization.AreaChart(container); 
 
    google.visualization.events.addListener(chart, 'animationfinish', moveLabels); 
 
    google.visualization.events.addListener(chart, 'ready', moveLabels); 
 

 
    function moveLabels() { 
 
     Array.prototype.forEach.call(container.getElementsByTagName('text'), function (label) { 
 
     if (label.getAttribute('text-anchor') === 'middle') { 
 
      label.setAttribute('y', parseFloat(label.getAttribute('y')) + 4); 
 
     } 
 
     }); 
 
    } 
 

 
    chart.draw(data, options); 
 
    }, 
 
    'packages':['corechart'] 
 
});

<script src="https://www.gstatic.com/charts/loader.js"></script> 
 
<div id="chart_div"></div>