将空值传递到SVG路径（使用d3.js）以抑制缺少的数据 [英] Pass null values to SVG path (using d3.js) to suppress missing data

问题描述

使用jQuery Flot，我可以传递 null 值到绘图机制，所以它不会在绘图上绘制任何东西。查看缺少的记录如何被删除：

Using jQuery Flot, I can pass a null value to the plotting mechanism so it just won't draw anything on the plot. See how the missing records are suppressed:

我想移动到 d3js ，这样我就可以更深层次的控制使用SVG的图形。然而，我还没有找到如何做同样的过程，抑制缺失的记录。下面的图片是尝试使用 0 而不是 null 的值（其中 d3 包损坏）。下面是一些代码，让您了解如何生成以下图表：

I'm looking to move to d3js, so that I can have deeper low level control of the graphics using SVG. However, I have yet to find out how to do that same process of suppressing missing records. The image below is an attempt to do this, using a value of 0 instead of null (where the d3 package breaks down). Here is some code to give you an idea of how I produced the graph below:

var line = d3.svg.line()
    .x(function(d) {
       var date = new Date(d[0]);
       return x(date);
    })
    .y(function(d) {
       var height = d[1]; 
       if (no_record_exists) {
           return y(0);
       }
       return y(height) + 0.5;
    });

我在Mozilla开发者网络上查找了SVG path 我发现有一个MoveTo命令， M xy ，只将笔移动到某个点，没有绘制任何东西。这已经在 d3js 包中实现，所以我不必每次创建几个 path 元素遇到缺少的记录？

I looked up the SVG path element at the Mozilla Developer Network, and I found out that there is a MoveTo command, M x y, that only moves the "pen" to some point without drawing anything. Has this been implemented in the d3js package, so that I won't have to create several path elements every time I encounter a missing record?

推荐答案

$ c> d3.svg.line（）是这样做的方法

假设我们想在图表中包含一个断点if y is null：

Let's say we want to include a break in the chart if y is null:

line.defined(function(d) { return d.y!=null; })

这篇关于将空值传递到SVG路径（使用d3.js）以抑制缺少的数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！