Question

我使用chartkick gem来渲染Google时间线图。虽然开箱即用非常好，但我在Google文档中看到，我还能够添加一个条形标签：

https://developers.google.com/chart/interactive/docs/gallery/timeline#labeling-the-bars

是否可以选择在Chartkick的帮助下将该额外列添加到数据表中？

我基本上需要在呈现时间轴之前调用它：

dataTable.addColumn({ type: 'string', id: 'Name' });

由于

代码示例：

<%= timeline [
  ["Washington", "1789-04-29", "1797-03-03"],
  ["Adams", "1797-03-03", "1801-03-03"],
  ["Jefferson", "1801-03-03", "1809-03-03"]
] %>

Answer 1

这需要更改源代码，chartkick.js：

首先，您需要将一条描述新数据列的行添加到“this.renderTimeline”的开头（我称之为Label）：

...
var data = new google.visualization.DataTable();
            data.addColumn({type: "string", id: "Label"});
            data.addColumn({type: "string", id: "Name"});
            data.addColumn({type: "date", id: "Start"});
            data.addColumn({type: "date", id: "End"});
            data.addRows(chart.data);

其次，您需要通过向数组值添加1来更新“processTime”函数（因为我们已将数组大小增加1）：

function processTime(chart)
  {
    var i, data = chart.rawData;
    for (i = 0; i < data.length; i++) {
      data[i][2] = toDate(data[i][2]);  // from data[i][1]
      data[i][3] = toDate(data[i][3]);  // from data[i][2]
    }
    return data;
  }

如何使用Chartkick gem在Google时间轴图表中获取条形标签

1 个答案: