javascript 用 d3 绘制非连续线

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/15259444/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-27 00:04:54  来源:igfitidea点击:

Drawing non-continuous lines with d3

javascriptd3.js

提问by julio

I'm using d3.js to make a simple line graph. I want to know if there's a way to create "holes" in the graph, that is, if the line can be interrupted or cut when there is no data available.

我正在使用 d3.js 制作一个简单的折线图。我想知道是否有办法在图中创建“洞”,即在没有可用数据的情况下是否可以中断或切割线。

I'm looking into either delete the places I don't need from the domain, or setting the line weight to 0 in specific segments, but I can't find a way to do either of these.

我正在考虑从域中删除我不需要的位置,或者在特定段中将线宽设置为 0,但我找不到执行其中任何一个的方法。

Thanks for your help!

谢谢你的帮助!

回答by Josh

The D3 linegenerator has a built in function to do just this, line.defined. You can use this function to control where your line is defined and where it is not (like where you have missing data.) If you wanted to make your line undefined whenever the second value in the point array is a javascript NaN value, you could say:

D3线生成器有一个内置函数可以做到这一点,line.defined。您可以使用此函数来控制线的定义位置和不定义位置(例如丢失数据的位置。)如果您想让点数组中的第二个值是 javascript NaN 值时取消定义您的线,您可以说:

line.defined(function(d) { return !isNaN(d[1]); });

Hereis a good example of this in action.

是一个很好的例子。