Skip to content Skip to sidebar Skip to footer

D3 Bar Chart - Remove Labels With Zero Value

In the fiddle below, you can notice that the first bar has the label no even though its value is zero. How do I remove the labels with zero values in my stacked bar chart? jsFiddle

Solution 1:

There are many ways to handle this, consider this when creating your text elements:

.style("display", function(d) { (test if value is zero) ? "none" : "inline"; }

Implemented in your fiddle here: http://jsfiddle.net/V5fJ7/1/

Or, you could filter your selection before actually creating the text, so they don't get created in the first place:

d3Selection.filter(function(d) { return (conditions of data you wish to keep); })
    .append("text")
    .etc..

You can see this here: http://jsfiddle.net/V5fJ7/2/

Post a Comment for "D3 Bar Chart - Remove Labels With Zero Value"