你可以使用Highcharts.SVGRenderer在每一列上绘制额外的元素。首先使用renderer.rect创建三个矩形，然后使用renderer.path创建它们之间的直线。注意，每次绘制图表时，你都必须销毁旧的元素并绘制新的元素。请查看我在下面发布的演示。
于飞：

<script src="https://code.highcharts.com/highcharts.js"></script>
<div id="container"></div>

JS：

Highcharts.chart('container', {
  chart: {
    type: 'column',
    events: {
      render: function() {
        var chart = this,
          series = chart.series[1],
          points = series.points,
          yAxis = chart.yAxis[0],
          customPoints = [
            24,
            41,
            49
          ],
          path = [],
          height = 7,
          element,
          width,
          x,
          y,
          i;

        if (chart.customElements) {
          chart.customElements.forEach(function(elem) {
            elem.destroy();
          });
        }

        chart.customElements = [];

        points.forEach(function(point) {
          if (point.series.visible) {
            x = point.plotX + chart.plotLeft;
            width = point.pointWidth * 0.2;

            for (i = 0; i < customPoints.length; i++) {
              y = yAxis.toPixels(customPoints[i]);

              if (i === 0) {
                path.push('M');
              } else {
                path.push('L');
              }

              path.push(x);
              path.push(y);

              element = chart.renderer.rect(x - (width / 2), y, width, height)
                .attr({
                  strokeWidth: 1,
                  fill: '#000'
                })
                .add()
                .toFront();

              chart.customElements.push(element);
            }

            element = chart.renderer.path(path)
              .attr({
                'stroke-width': 1,
                stroke: '#000',
                fill: '#000'
              })
              .add()
              .toFront();

            chart.customElements.push(element);
          }
        });
      }
    }
  },
  plotOptions: {
    column: {
      stacking: 'normal',
    },
    series: {
      borderColor: '#000'
    }
  },
  series: [{
    name: 'Total',
    data: [{
      y: 20,
      color: "white"
    }]
  }, {
    name: 'Actual',
    data: [{
      y: 80,
      color: "skyblue"
    }]
  }]
});

演示：https://jsfiddle.net/BlackLabel/hn96dfwm/

这对我来说很管用：
安装库

npm install --save highcharts

在要呈现图表的组件中：

import * as Highcharts from 'highcharts';

    // Imports all modules you need and then inicialized
    declare var require: any;
    let Boost = require('highcharts/modules/boost');
    let Pareto = require('highcharts/modules/pareto');
    let noData = require('highcharts/modules/no-data-to-display');
    let More = require('highcharts/highcharts-more');

    Boost(Highcharts);
    noData(Highcharts);
    Pareto(Highcharts);
    More(Highcharts);
    noData(Highcharts);

   export class YourNameComponent implements OnInit {

    options: any = {
    title: {
      text: null // Your title
    },
    chart: {
      type: 'spline'  // type chart
    },
    tooltip: {
      crosshairs: true,
      shared: true
    },
    yAxis: {
      title: {
        text: 'Ventas'
      }
    },
    xAxis: {
      title: {
        text: 'Mobiliario'
      },
      categories: [] // Your categories
    },
    legend: {
      layout: 'vertical',
      align: 'right',
      verticalAlign: 'middle'
    },
    plotOptions: {
      spline: {
        marker: {
          radius: 4,
          lineColor: '#666666',
          lineWidth: 1
        }
      }
    },
    series: [] // Your data series
  };

    ngOnInit(): void {
     this.initChart();
    }

    initChart(): void {
       const idElementHtml = 'your id chart container';
       const chartR = document.getElementById(idElementHtml) // or you can use ViewChild as well;
       if (typeof chartR !== undefined && chartR !== null){
          Highcharts.chart(idElementHtml, this.options);
       }
    }
  }
}