如何在谷歌可视化时间轴的工具箱中更改日期格式

How to change date format in the toolbox of a Google Visualization timeline

本文关键字:工具箱 格式 日期 谷歌 可视化 时间      更新时间:2023-09-26

我正在创建一个带有Google虚拟化的时间线。 这很好用。我唯一的问题是工具箱中显示的日期,一旦您将鼠标悬停在栏上,该日期就会显示。

日期格式停留在月-年。当我查看Google可视化API时,我发现了dateformat函数。这正是我所需要的。我试图在我的代码中实现它,但似乎忽略了它。

这是我到目前为止的javascript:(或实时版本在这里)

var container = document.getElementById('example1');
var chart = new google.visualization.Timeline(container);
var dataTable = new google.visualization.DataTable();
dataTable.addColumn({
    type: 'string',
    id: 'Title'
});
dataTable.addColumn({
    type: 'string',
    id: 'Status'
});
dataTable.addColumn({
    type: 'date',
    id: 'Start'
});
dataTable.addColumn({
    type: 'date',
    id: 'End'
});
dataTable.addRows([
    ["1", "Planning", new Date(2013, 5, 20), new Date(2013, 6, 21)],
    ["2", "Design", new Date(2013, 6, 25), new Date(2013, 7, 25)],
    ["3", "Development", new Date(2013, 7, 25), new Date(2013, 10, 11)],
    ["4", "Implementation", new Date(2013, 10, 15), new Date(2013, 11, 14)],
    ["5", "Testing", new Date(2013, 11, 18), new Date(2013, 12, 10)],
    ["6", "Delivering", new Date(2013, 12, 1), new Date(2013, 12, 21)]
]);
var formatter = new google.visualization.DateFormat({
    formatType: 'medium'
});
formatter.format(dataTable, 2);
formatter.format(dataTable, 3);
var options = {
    timeline: {
        showRowLabels: false,
        barLabelStyle: {
            fontSize: 10
        },
        groupByRowLabel: false,
        colorByRowLabel: false
    },
    avoidOverlappingGridLines: false,
    colors: ['#556270', '#4ECDC4', '#C7F464', '#FF6B6B', '#C44D58', '#A7A7A7']
};
chart.draw(dataTable, options);

如您所见,我尝试将开始和结束日期格式化为"中等"格式。但是当绘制图表时,我仍然只看到月-年格式。

我怎样才能做到这一点?

看起来时间轴图表不使用日期的格式化值,并且它们不公开任何格式选项。 我建议提出功能请求以添加支持。