CODEWITHSUNDEEP
highchartscolumn-chart
Andy
Andy

Reputation: 503

Hide stacklabel if zero

I have this code that hides the number inside the label if the value is zero. My problem is that i also want to hide the sum number that is displayed over the column.

Here is an example, the last label. http://jsfiddle.net/4NxYh/72/

plotOptions: {                    
    line: {dataLabels: {enabled: true, style: {fontSize: '8px'}, style: {textShadow: false}, allowDecimals: true,  formatter: function() {return this.y + 'e'}}},
    column: {stacking: 'normal', shadow: false, dataLabels: {
                        formatter:function() {
                            if(this.y != 0) {
                                return this.y;
                            }
                        },
                        enabled: true,
                        color: (Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'white',
                        style: {
                            textShadow: '0 0 3px black',
                            fontSize: '8px'
                        }
                    }},
    series: {minPointLength: 0}

},

Upvotes: 1

Views: 786

Answers (1)

Mike Zavarello
Mike Zavarello

Reputation: 3554

In order to hide the stack totals when the total number is zero, you can apply a similar variant of your dataLabels formatter to the stackLabels attribute (see also this Stack Overflow question that talks about formatting stackLabels).

stackLabels: {
    enabled: true,
    formatter: function(){
        var val = this.total;
        if (val > 0) {
            return val;
        }
        return '';
    },
    style: {
        fontWeight: 'bold',
        color: (Highcharts.theme && Highcharts.theme.textColor) || 'gray'
    } 
},

In this instance, if your total is greater than zero, show the stack label. If not, show nothing.

Here is an updated version of your fiddle with this change: http://jsfiddle.net/brightmatrix/4NxYh/76/

I hope this is helpful for you!

Upvotes: 1

Related Questions