Search code examples
highchartsstacked-chart

Highcharts: stacked bar chart with different ranges of scales


I have an example of a stacked bar chart with different ranges of scales. In the example below, you will see, that it looks not so good and it is impossible to see the Sales.

series: [{
    name: 'Sales',
    data: [5, 3, 4, 7, 2]
}, {
    name: 'Leads',
    data: [20, 20, 30, 20, 10]
}, {
    name: 'Clicks',
    data: [3000, 4000, 4000, 2000, 5000]
}

https://jsfiddle.net/x3teouks/

Is there a way to transform the data, so we can display all the data in a good way for the user?


Solution

  • You can set minPointLength property for the series:

    series: [{
        minPointLength: 4,
        ...
    }, ...]
    

    Live demo: https://jsfiddle.net/BlackLabel/d9p5jbrm/

    API Reference: https://api.highcharts.com/highcharts/series.column.minPointLength