如何在D3.js中丢失数据时分割行 [英] How split line in D3.js when missing data

问题描述

我的数据源可能缺少数据，例如：

My data source can be missing data for example:

7/1/13 1

7 / 2/13 2

7/2/13 2

7/3/13 3

7/4/13 4

7/5/13 5

7/8/13 8

7/9/13 9
......

7/9/13 9 ......

当我使用d3.svg.line（）。x（X） .y（Y1）其中X和Y是我的访问器函数。它将画一条连续线。我想知道如何将它分成两个不同的行，这样可以很容易看到缺少的日子。

When I use d3.svg.line().x(X).y(Y1) where X and Y are my accessor functions. It will draw a continuous line. I was wondering how can split this up into two different lines, such that missing days can be easily seen.

我的意思是我应该得到一行1到5，然后一个8到9的行。5到8之间没有连接。

I mean I should get a line for 1 to 5 and then a line for 8 to 9. No connection between 5 to 8.

推荐答案

有一种方法可以指定是否定义数据，至少在当前版本的d3中有：

There is a way to specify if data is defined, at least there is in the current version of d3:

d3.svg.line()
    .defined(function(d){return d.y != null && d.y != undefined})

区域：

d3.svg.area()
    .defined(function(d){return d.y != null && d.y != undefined})

这对我来说很奇怪。

当数据未定义时，会出现尖锐的悬崖。
查看这个例子：

When data is not defined, a sharp cliff will appear. Check this out for an example:

http://bl.ocks.org/mbostock/3035090

这篇关于如何在D3.js中丢失数据时分割行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！