首页 文章

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

提问于
浏览
1

我正在使用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"]
] %>

1 回答

  • 0

    这需要更改源,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;
      }
    

相关问题