2

如何在 Highstock 中显示日期的周数（不是 Highcharts！）？

我的 SQL 看起来像这样

select unix_timestamp(date)*1000 week
(....)
group by yearweek(date,3)

我的JS

$(function() {
    $.getJSON('json_chart.php', function(data) {

        // Create the chart
        $('#container').highcharts('StockChart', {


            rangeSelector : {
                selected : 2
            },

            title : {
                text : 'Wyniki'
            },
            xAxis: {
                type: 'datetime',
                dateTimeLabelFormats: {
                    day: '%e'
                }
            },
            yAxis: [{
                offset: 40,
                title: {
                    text: 'Ilośc'
                },
                lineWidth: 2
            }, {
                title: {
                    text: 'Efek'
                },
                opposite: true,
            }],

            series : [{
                name : 'Ode',
                data : data.ode,
                type : 'column',
                yAxis: 0
            },{
                name : 'Sku',
                data : data.sku,
                marker : {
                    enabled : true,
                    radius : 3
                },
                yAxis: 1,
                shadow : true
            },{
                name : 'TK',
                data : data.tpk,
                marker : {
                    enabled : true,
                    radius : 3
                },
                yAxis: 0,
                shadow : true
            }]
        });
    });
});

目前它看起来像这样：

在此处输入图像描述

但我想看起来像这样：

在此处输入图像描述

4

3 回答 3

10

您可以使用添加它dateFormats，例如：http: //jsfiddle.net/EkAnm/

Highcharts.dateFormats = {
    W: function (timestamp) {
        var date = new Date(timestamp),
            day = date.getUTCDay() == 0 ? 7 : date.getUTCDay(),
            dayNumber;
        date.setDate(date.getUTCDate() + 4 - day);
        dayNumber = Math.floor((date.getTime() - new Date(date.getUTCFullYear(), 0, 1, -6)) / 86400000);
        return 1 + Math.floor(dayNumber / 7);

    }
}

然后在 or formator中使用它dateFormat()：

xAxis: {
        tickInterval: 7 * 24 * 36e5, // one week
        labels: {
            format: '{value:Week %W/%Y}'
        }
    },
于 2013-07-25T09:19:22.913 回答
1

对于@Paweł Fus 的回答，我发现当日期是 2012/1/1 女巫是星期天时，结果是错误的，所以我将答案更改为：

W: function (timestamp) {
    var date = new Date(timestamp);
    var firstDay = new Date(date.getFullYear(), 0, 1); 
    var day = firstDay.getDay() == 0 ? 7 : firstDay.getDay();
    var days = Math.floor((date.getTime() - firstDay)/86400000) + day; // day numbers from the first Monday of the year to current date
    return Math.ceil(days/7);
},
于 2015-01-05T05:45:58.117 回答
1

为了使周数和年数保持一致，我在处理周数时倾向于使用 ISO-8601 标准。

使用 Pawel 答案和此博客中的 js 代码，我设置了以下解决方案。

Highcharts.dateFormats = {
        V: function (timestamp) {    
            var target  = new Date(timestamp);  
            var dayNr   = (target.getDay() + 6) % 7;  
            target.setDate(target.getDate() - dayNr + 3);  
            var firstThursday = target.valueOf();  
            target.setMonth(0, 1);  
            if (target.getDay() != 4) {  
                target.setMonth(0, 1 + ((4 - target.getDay()) + 7) % 7);  
            }  
            return 1 + Math.ceil((firstThursday - target) / 604800000); // 604800000 = 7 * 24 * 3600 * 1000  
        }  ,
        G: function(timestamp) {
            var target  = new Date(timestamp);  
            target.setDate(target.getDate() - ((target.getDay() + 6) % 7) + 3);  
            return target.getFullYear();  
        }
};

%V 和 %G 遵循highstock 中使用的strftime 格式。

于 2016-03-22T11:09:37.937 回答