时间戳

首页 > 解决方案 > 浮动图时间未格式化

javascript - 浮动图时间未格式化

问题描述

我正在尝试绘制一个浮动图，但日期不会显示。我确实有 float.time 加载，并且当我验证它们时时间戳是正确的。任何人都可以看到代码有什么问题。该图绘制完美，但显示的是时间戳而不是日期。

if ($("#site-stats").length) {
        var companies = [[1534892400000,4], [1534978800000,1], [1535065200000,1], [1535151600000,0], [1535238000000,0], [1535324400000,1], [1535410800000,5], [1535497200000,3], [1535583600000,2], [1535670000000,3], [1535756400000,1], [1535842800000,3], [1535929200000,2], [1536015600000,1], [1536102000000,1], [1536188400000,1], [1536274800000,1], [1536361200000,0], [1536447600000,0], [1536534000000,4], [1536620400000,0], [1536706800000,0], [1536793200000,0], [1536879600000,0], [1536966000000,0], [1537052400000,0], [1537138800000,0], [1537225200000,0], [1537311600000,0], [1537398000000,0], ];
        var users = [[1534892400000,6], [1534978800000,8], [1535065200000,1], [1535151600000,0], [1535238000000,0], [1535324400000,1], [1535410800000,5], [1535497200000,3], [1535583600000,2], [1535670000000,4], [1535756400000,1], [1535842800000,3], [1535929200000,2], [1536015600000,1], [1536102000000,1], [1536188400000,1], [1536274800000,2], [1536361200000,0], [1536447600000,0], [1536534000000,5], [1536620400000,0], [1536706800000,0], [1536793200000,0], [1536879600000,0], [1536966000000,0], [1537052400000,0], [1537138800000,0], [1537225200000,0], [1537311600000,0], [1537398000000,0], ];

    var plot = $.plot($("#site-stats"), [{
            data : companies,
            label : "Company Registrations"
        }, {
            data : users,
            label : "User Registrations"
        }], {
            series : {
                lines : {
                    show : true,
                    lineWidth : 1,
                    fill : true,
                    fillColor : {colors : [{ opacity : 0.1}, {opacity : 0.15}]}
                },
                points : {show : true},
                shadowSize : 0
            },
            xaxis : {
                mode : "time",
                dateFormat : "%y-%0m-%0d"

            },

            yaxes : [{
                min : 0,
                tickLength : 2
            }],
            grid : {
                hoverable : true,
                clickable : true,
                tickColor : $chrt_border_color,
                borderWidth : 0,
                borderColor : $chrt_border_color,
            },
            tooltip : true,
            tooltipOpts : {
                content : "Your sales for <b>%x</b> was <b>%y</b>",
                dateFormat : "%y-%0m-%0d",
                defaultTheme : false
            },
            colors : [$chrt_main, $chrt_second],
            xaxis : {
                ticks : 10,
                tickDecimals : 0
            },
            yaxis : {
                ticks : 20,
                tickDecimals : 0
            },
        });

    }
});

标签： javascriptjquerychartsflot

解决方案

您的选项对象中有两个xaxis属性：

    xaxis : {
        mode : "time",
        dateFormat : "%y-%0m-%0d"
    },

和

    xaxis : {
        ticks : 10,
        tickDecimals : 0
    },

第二个用时间格式覆盖第一个。把它们放在一起，它工作正常（见这个小提琴）：

    xaxis: {
        mode: "time",
        dateFormat: "%y-%0m-%0d",
        ticks: 10,
        tickDecimals: 0
    },

推荐阅读