3

我正在使用 Rickshaw javascript 库来显示一些图形值，遵循此处的模型。要绘制的数据是通过 Ajax 调用提供的，例如：

[{"color":"#65A1CC","data":[{"x":1383906402000,"y":22.31},{"x":1383906428000,"y":22.38},{"x":1383906452000 ,"y":22.31},{"x":1383906477000,"y":22.38},{"x":1383906502000,"y":22.38},{"x":1383906527000,"y":22.38}, {"x":1383906552000,"y":22.31},{"x":1383906577000,"y":22.31}],"name":"传感器 1"},{"color":"#CC9065","数据":[{"x":1383906402000,"y":22.38},{"x":1383906427000,"y":22 .38},{"x":1383906452000,"y":22.38},{" x":1383906477000,"y":22.38},{"x":1383906502000,"y":22.38},{"x":1383906527000,"y":22。38},{"x":1383906552000,"y":22.38},{"x": 1383906577000,"y":22.38}],"name":"传感器 2"}]

此处给出的长值是 FET 2013 年 11 月 8 日星期五 13:26:42 和 FET 2013 年 11 月 8 日星期五 13:29:37 之间的数据时间。

但是，将鼠标悬停在结果图表上时，显示的各种值的日期显示为“Sat Apr. 03”，如下图所示。我不明白为什么：如果在 javascript 中迭代数据，javascript Date 对象显示 11 月时间，而不是 4 月。

在此处输入图像描述

代码是：

<div id="chart_container">
<div id="chart" style="background-color: white;"></div>
<div id="legend_container">
    <div id="smoother" title="Smoothing"></div>
    <div id="legend"></div>
</div>
<div id="slider"></div>


$.ajax({                        
         type : "POST",
         dataType: "json",
         url : "/myApp/someURL",
         data: { pack:selectedpack} 
      }
     ).done(function(data) {
        showDashboard(data);
    }); 

function showDashboard(data) {
    $("#charts").show();
    $("#chart").empty();
    $("#legend").empty();

    var graph = new Rickshaw.Graph({
        element: document.getElementById("chart"),
        width: 1000 - 130,
        height: 400,
        renderer: 'line',
        series: data
    });

    graph.render();

    var slider = new Rickshaw.Graph.RangeSlider({
        graph: graph,
        element: $('#slider')
    });

    var hoverDetail = new Rickshaw.Graph.HoverDetail({
        graph: graph
    });

    var legend = new Rickshaw.Graph.Legend({
        graph: graph,
        element: document.getElementById('legend')

    });

    var shelving = new Rickshaw.Graph.Behavior.Series.Toggle({
        graph: graph,
        legend: legend
    });

    var axes = new Rickshaw.Graph.Axis.Time({
        graph: graph
    });
    axes.render();
}

包含以下 js 文件：jquery-ui.min.js, d3.v2.js, rickshaw.js, Rickshaw.Class.js, Rickshaw.Compat.ClassList.js, Rickshaw.Graph.js, Rickshaw.Graph.Renderer.js, Rickshaw.Graph.Renderer.Area.js, Rickshaw.Graph.Renderer.Line.js, Rickshaw.Graph.Renderer.Bar.js, Rickshaw.Graph.Renderer.ScatterPlot.js, Rickshaw.Graph.RangeSlider.js, Rickshaw.Graph.HoverDetail.js, Rickshaw.Graph.Annotate.js, Rickshaw.Graph.Legend.js, Rickshaw.Graph.Axis.Time.js, Rickshaw.Graph.Behavior.Series.Toggle.js, Rickshaw.Graph.Behavior.Series.Order.js, Rickshaw.Graph.Behavior.Series.Highlight.js, Rickshaw.Graph.Smoother.js, Rickshaw.Graph.Unstacker.js, Rickshaw.Fixtures.Time.js, Rickshaw.Fixtures.Time.Local.js, Rickshaw.Fixtures.Number.js, Rickshaw.Fixtures.RandomData.js, Rickshaw.Fixtures.Color.js, Rickshaw.Color.Palette.js, Rickshaw.Graph.Axis.Y.js

我应该怎么做才能获得 11 月 ... 时间而不是 4 月？

谢谢。

4

1 回答 1

4

您需要以秒为单位传递，而不是毫秒，因此您应该将时间数据除以1000. 例如，1383906452000您需要拥有1383906452.

如果无法从服务器端返回以秒为单位的时间值，则在客户端，您可以在调用之前使用以下命令showDashboard(data)：

$(data).each(function (e, i) {
    $(i.data).each(function (f, j) {
        j.x = j.x / 1000;
    });
});
于 2013-11-11T09:11:28.113 回答