Scatter to-zero fills don't honored gaps in coordinates

[etpinard]

See http://codepen.io/etpinard/pen/GNorWw

Where (I believe) the desired behavior would show two fill rectangles spanning from the line segments down to y=0.

First reported on https://community.plot.ly/t/area-chart-is-not-breaking-at-null-values/2652

[rreusser]

@etpinard This is a bug right, not a regression? Something must have changed so that I didn't immediately succeed in rolling back the version to check.

[etpinard]

@rreusser it's not a regression. No stress.

[morganh35]

@etpinard is there any update on this bug? Has anyone started work on it?
If not, if you can point me in the right direction I could give it a go.

Thanks!

[rreusser]

@morganh35 Currently the way scatter plots work is essentially all contained in traces/scatter/plot.js. I was going to try to explain verbally how this could work, but it's gonna be way too difficult. So here's my image-based description instead. The blue arrows show the points that could accomplish this most simply. It's SVG though so there are probably five different ways to accomplish this. Open to other thoughts!

[craigdrayton]

Hi team - is this bug still being worked on? I've just come across it in my work. Many thanks

[Kolano]

I'm also interested in seeing this addressed, I've had to convert to using Bar graphs to avoid this issues.

[Kolano]

I was able to use the following map function to account for this in the current Plotly.js with the minor caveat that you'll have 1 erroneous data point indicating 1 rather than nothing beside each chunk of data.

//Account for filled "scatter" plots not honoring null data gaps
values.map(function(value, i){
   if(value == null){
   //Check for non-null values on either side
      if((typeof values[i+1] != undefined && values[i+1] != null) || (typeof values[i-1] != undefined && values[i-1] != null)){
         //Return minimal value to keep fill lines sensible
         value = 1;
      }
   }
   return value;
})

[supern8ent]

A workaround is to insert y=0 at each x=(desired cut). To use rreuser's diagram as an example, you would insert y=0 immediately before and after each of the two filled blocks.

This workaround is a bit more difficult to code than inserting Nulls so it would be great to see this bug fixed!

[jqlee85]

Has anyone figured out a solution that doesn't involve adding superfluous data? I would expect this to work like the green trace in this example from dygraphs.

[danyalejandro]

This problem could be extended to any general use of the "fill: tonexty" parameter or similar use cases. For example, notice the gap in the middle being connected:

[th0ger]

@rreusser it's not a regression. No stress.

(7 years later.) Maybe a tiny bit of stress would help. Is this solveable?

[gvwilson]

Hi - this issue has been sitting for a while, so as part of our effort to tidy up our public repositories I'm going to close it. If it's still a concern, we'd be grateful if you could open a new issue (with a short reproducible example if appropriate) so that we can add it to our stack. Cheers - @gvwilson