'stacked column highchart custom modifications

I attached the below photo describe the challenge that I have hide black color value change the black color to red and decrease the black color value from the total

here is the code URL

    https://jsfiddle.net/Anasddrx/gtyhrvp3/33/

enter image description here

highcharts


Solution 1:[1]

To set the red color for the Stop series and hide dataLabels use this config:

 {
    name: 'Stop',
    data: [5000, 3000, 4000, 7000, 2000],
        color: 'red',
        dataLabels: {
            enabled: false
        },
  },

To subtract Stop value from the stacking sum try this approach:

  formatter: function() {
            const stopSeries = this.axis.series.find(s => s.name === 'Stop');

    return this.total - stopSeries.processedYData[this.x] + " Pcs";
  },

Demo: https://jsfiddle.net/BlackLabel/pq7tdufk/

API: https://api.highcharts.com/highcharts/yAxis.stackLabels.formatter

API: https://api.highcharts.com/highcharts/series.column.color

API: https://api.highcharts.com/highcharts/series.column.dataLabels

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Sebastian W?dzel

Related Questions