Google 图表：折线图 hAxis 标签居中

Question

我正在使用 Google 图表的折线图并将以下示例放在一起：http://codepen.io/anon/pen/epJqaX

如您所见，所有数据点都有日期、值 1 和值 2。

目前我只将此代码用于 hAxis:

hAxis: {
  format: 'MMMM',
  ticks: dateTicks,
}

现在 hAxis 上的标签总是在垂直线下方居中，但我希望它们在相应的月份居中，如下图所示：

我该怎么做？

Answer 1

第一个答案（semirturgay）方向正确，但是有一些严重的问题：

不行，至少应该包装成一个ready事件
它不负责本地化。例如，当我运行 OP 提供的代码时，月份被翻译为 "januar"、"februar" 等，因为我位于丹麦。将硬编码字符串与 google 可视化本地化格式化值进行比较是不明智的，它将失败。
正在使用jQuery

这是一个使用 google 可视化自己的格式方法的工作香草解决方案，如果需要更改 date 的格式（只需更改 DateFormat({pattern: 'MMMM'}) 到 hAxis 的任意值：format) :

google.visualization.events.addListener(chart, 'ready', function() {
   var indent = 120,
       texts = document.querySelectorAll('text'),
       formatter = new google.visualization.DateFormat({pattern: 'MMMM'});

   function indentText(month) {
       for (var t=0;t<texts.length;t++) {
          if (texts[t].textContent == month) {
             texts[t].setAttribute('x', parseInt(texts[t].getAttribute('x'))+indent);
             return;
          }    
       }    
   }    
   for (var i=0;i<dateTicks.length;i++) {
       indentText(formatter.formatValue(dateTicks[i]));
   }          
})

已将 codepen 代码移至 fiddle -> http://jsfiddle.net/no4ztpuc/

Google 图表：折线图 hAxis 标签居中

Google Charts: Line Chart hAxis Labels centered

javascript

date

linechart

google-visualization