Question

我正在使用Backbone / RequireJS开发项目，仪表板需要显示D3js的一些图表和数据可视化。在这个例子中，我读了一个.csv文件，我正确地接收了所有数据。 csv格式是下一个：

data,value
"2013-11-18 13:00:00",60.6243
"2013-11-18 14:00:00",60.3904
"2013-11-18 15:00:00",61.0474
"2013-11-18 16:00:00",61.0827
"2013-11-18 17:00:00",61.2976
"2013-11-18 18:00:00",61.5349
"2013-11-19 13:00:00",62.5751
"2013-11-19 14:00:00",62.7183
"2013-11-19 15:00:00",62.9095
"2013-11-19 16:00:00",63.0192
"2013-11-19 17:00:00",63.0192
"2013-11-19 18:00:00",63.0192

因此，您可以看到第一列用于日期，第二列用于值。我需要使用linear chart来表示数据，我需要比较过去两天和过去两周。我不知道如何重叠图表上的两个信号。

我必须用.find（）方法分隔两个数据范围：

function createRange(days) {
    ms_day = 86400000 * days;
    day = new Date();
    tmp = day.getTime();
    return day.setTime(parseInt(tmp - ms_day));
}
var Data_Day_1 = data.filter(function(d) { return d.date > createRange(1); });
var Data_Day_2 = data.filter(function(d) { return d.date < createRange(2); });

^{createRange计算分隔实际范围终点的Date元素。因此，如果我想显示最后一天的值，函数将返回=＆gt;现在 - 24小时}

结果如下：

Data_Day_1

"2013-11-18 13:00:00",60.6243
"2013-11-18 14:00:00",60.3904
"2013-11-18 15:00:00",61.0474
"2013-11-18 16:00:00",61.0827
"2013-11-18 17:00:00",61.2976
"2013-11-18 18:00:00",61.5349

Data_Day_2

"2013-11-19 13:00:00",62.5751
"2013-11-19 14:00:00",62.7183
"2013-11-19 15:00:00",62.9095
"2013-11-19 16:00:00",63.0192
"2013-11-19 17:00:00",63.0192
"2013-11-19 18:00:00",63.0192

问题是图表的x轴读取日期并继续一个接一个地显示数据，而不是重叠。我应该采取什么方式来解决这个问题？

对不起，这对我来说很难解释，希望你能帮到我。感谢。

更新

我修正了我的一个错误。现在，当我宣布x和y时，我正在做下一行：

var x = d3.scale.linear().range([0, width]);
var y = d3.scale.linear().range([height, 0]);

所以，我有一个包含Data_Day_1和Data_Day_2的对象data_all：

var data_all = [Data_Day_1, Data_Day_2];

现在它出现了我不确定的部分。我不知道我是不是在x和y域做得好或者什么，但它没有显示任何图形。

x.domain([0, d3.max(data_all, function(d) { return d.date; })]);
y.domain([0, d3.max(data_all, function(d) { return d.close; })]);

Here you can see an example of the problem.

D3js折线图。重叠线与不同的日期

0 个答案: