最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - Have gaps in a SVG path when there is no data - Stack Overflow

programmeradmin3浏览0评论

I am trying to create a realtime line graph in D3. My data is in the format of [[Date, value], [Date, value]. When I don't receive any data the value will be 0. I would like the line to break for these values so they are not plotted. I would then get gaps in my graph where I am missing data.

Anyone have any ideas how I would do this?

I am trying to create a realtime line graph in D3. My data is in the format of [[Date, value], [Date, value]. When I don't receive any data the value will be 0. I would like the line to break for these values so they are not plotted. I would then get gaps in my graph where I am missing data.

Anyone have any ideas how I would do this?

Share Improve this question asked Jan 3, 2013 at 15:32 dtsndtsn 1,1071 gold badge11 silver badges17 bronze badges 2
  • 1 Have you written any code so far ? – Sirko Commented Jan 3, 2013 at 15:34
  • I do, I have created a JS fiddle of what I currently have: jsfiddle/srZwS/1 – dtsn Commented Jan 4, 2013 at 12:18
Add a ment  | 

2 Answers 2

Reset to default 11

Try this. Variable my_dataset is array of objects with attributes {x,y}. "NaN: as y-value is skipped in visualization.

var line = d3.svg.line()
  .x( function( d, i) { return x( d.x); })
  .y( function( d) { return y( d.y); })
  .defined( function( d) { return !isNaN( d.y); })
  ;

my_visualization.append( "svg:path")
    .data( [ my_dataset])
    .attr( "d", line)

You could easily do this by creating several plots on a single set of axis. Each continuos sets of data would be a separate plot. Then just make sure you assign them all the same colour etc.

发布评论

评论列表(0)

  1. 暂无评论