0

How to apply border in the stacked bar chart when the series contains zero value? When the series contains zero value, stacked bar don't visible instead of that how to set the border for that empty bar. Please check this [fiddle]:https://jsfiddle.net/fekkyDev/3b1jahsg/1/ 

Highcharts.chart('container', {
    chart: {
        type: 'bar'
    },
    title: {
        text: 'Stacked bar chart'
    },
    xAxis: {
        categories: ['Apples', 'Oranges', 'Pears', 'Grapes', 'Bananas']
    },
    yAxis: {
        min: 0,
        title: {
            text: 'Total fruit consumption'
        }
    },
    legend: {
        reversed: true
    },
    plotOptions: {
        series: {
            stacking: 'normal'
        }
    },
    series: [{
        name: 'John',
        data: [0, 3, 4, 7, 2]
    }, {
        name: 'Jane',
        data: [0, 2, 3, 2, 1]
    }, {
        name: 'Joe',
        data: [0, 4, 4, 2, 5]
    }]
});
Pritesh
  • 1,066
  • 3
  • 15
  • 35
fekky Dev
  • 344
  • 3
  • 16
  • to apply border you could add `bar: { borderColor: 'black', borderWidth: 1 }` in `plotOptions` but the apples columns still wont be visible, until there is a value for it – shrys Sep 06 '19 at 04:48
  • oh ok, but how to add an border without the value ? – fekky Dev Sep 06 '19 at 05:02
  • For zero value there will not be any bar generated so it doesn't generate the border also. What is the expected result? – Ashu Sep 06 '19 at 05:16
  • When zero value need to render grey bar with border – fekky Dev Sep 06 '19 at 05:20
  • 1
    Check this example: https://jsfiddle.net/BlackLabel/4L6oc7fy/. Try to be more precise please, because it's obvious that zero value won't render a bar. – Wojciech Chmiel Sep 06 '19 at 07:09
  • I had a similar Question. You can see the answers [here](https://stackoverflow.com/questions/52181643/overlapping-and-rounded-stack-in-stacked-column-graph-in-highcharts). This might help you. – mukesh.kumar Sep 09 '19 at 08:46

0 Answers0