Google图表 - 在时间轴工具提示中格式化日期

时间:2016-09-30 21:32:49

标签: javascript charts google-visualization

我可以以某种方式更改Google Chart Timeline Tooltip上的日期格式吗? Javascript不是我的完美诚实的强项。但是我尝试过这样的事情,并且悲惨地失败了:

我想格式化工具提示,如果可能的话,可以像'd.M, yy'那样进行格式化 写一个持续时间(克罗地亚语:Trajanje)而不是1年,2个月,28天写1个神仙,2个mjeseca,28个dana(本地化为克罗地亚语)我相信通过添加语言" hr"包将改变这一点,但它没有。 (下图) enter image description here 我已经使用此链接中的资源来尝试定制,但我没有取得多大成就。

Customizing tooltip on Google Timeline Chart 代码如下:

    google.charts.load('current', {
        'packages': ['timeline'],
        'language': 'hr'
    });

    google.charts.setOnLoadCallback(graf_4);

    function graf_4() {

        var container = document.getElementById('timeline');
        var chart = new google.visualization.Timeline(container);
        var data = new google.visualization.DataTable(<?php echo $jsonTable; ?>);

        dataTable.insertColumn(2, {
            type: 'string',
            role: 'tooltip',
            p: {
                html: true
            }
        });

        var dateFormat = new google.visualization.DateFormat({
            pattern: 'd.M.yy. '
        });
        for (var i = 0; i < dataTable.getNumberOfRows(); i++) {
            var tooltip = '<div class="ggl-tooltip"><span>' +
                dataTable.getValue(i, 1) + '</span></div><div class="ggl-tooltip"><span>' +
                dataTable.getValue(i, 0) + '</span>: ' +
                dateFormat.formatValue(dataTable.getValue(i, 3)) + ' - ' +
                dateFormat.formatValue(dataTable.getValue(i, 4)) + '</div>';
            dataTable.setValue(i, 2, tooltip);
        }

        var options = {
            tooltip: {
                isHtml: true
            },
            legend: 'none',
            timeline: {
                trigger: 'focus',
                showRowLabels: false
            }

        };
        chart.draw(data, options);
    }
    $(window).resize(function() {
        graf_4();
    });

这是我的原始代码:

google.charts.load('current', {
    'packages': ['timeline'],
    'language': 'hr'
});

google.charts.setOnLoadCallback(graf_4);

function graf_4() {

var container = document.getElementById('timeline');
var chart = new google.visualization.Timeline(container);
var data = new google.visualization.DataTable(<?php echo $jsonTable; ?>);
var options = {
    tooltip: {
        isHtml: true
    },
    legend: 'none',
    timeline: {
        trigger: 'focus',
        showRowLabels: false
    }

};
chart.draw(data, options);
}

0 个答案:

没有答案