Mixed stacked bar with custom series and stepped line chart

[vano20]

Is it possible to mixed stacked bar with stepped line chart?

My stacked bar options

var options = {
  series: [
    {
      name: 'Job 1',
      type: 'bar',
      data: [
        {
          x: 'Piston',
          y: 23,
          status: 'value'
        },
        {
          x: 'Block',
          y: 10,
          status: 'non-value'
        },
      ]
    },
    {
      name: 'Job 2',
      type: 'bar',
      data: [
        {
          x: 'Piston',
          y: 14,
          status: 'non-value'
        },
        {
          x: 'Block',
          y: 8,
          status: 'nva'
        },
      ]
    }
  ],
  chart: {
    height: 350,
    type: 'bar',
    stacked: true
  },
  plotOptions: {
    bar: {
      horizontal: false,
    }
  },
  colors: [
    function(context) {
      const { value, seriesIndex, dataPointIndex, w } = context
      const status = w.config.series[seriesIndex].data[dataPointIndex].status
      if (status === 'non-value') {
        return '#FF0000'
      } else if (status === 'nva') {
        return '#FFFF00'
      } else if (status === 'value') {
        return '#00FF00'
      } 
    }
  ],
  dataLabels: {
    enabled: true,
    textAnchor: 'middle',
    style: {
      colors: ['#fff'],
      fontSize: '12px'
    },
    formatter: function (val, opt) {
      return opt.w.config.series[opt.seriesIndex].name
    },
    offsetX: 0,
    dropShadow: {
      enabled: true
    },
  },
  legend: {
    customLegendItems: ['value', 'non-value', 'nva'],
    markers: {
      fillColors: ['#00FF00', '#FF0000', '#FFFF00']
    }
  }
}

[vano20]

Happen to made it work myself

var options = {
  series: [
    {
      name: 'Job 1',
      type: 'bar',
      data: [
        {
          x: 'Piston',
          y: 23,
          status: 'value'
        },
        {
          x: 'Block',
          y: 10,
          status: 'non-value'
        },
      ]
    },
    {
      name: 'Job 2',
      type: 'bar',
      data: [
        {
          x: 'Piston',
          y: 14,
          status: 'non-value'
        },
        {
          x: 'Block',
          y: 8,
          status: 'nva'
        },
      ]
    },
    {
      name: 'LA',
      type: 'line',
      data: [
        {
          x: 1, 
          y: 14,
        },
        {
          x: 2, 
          y: 30,
        }
      ]
    },
    {
      name: 'takt',
      type: 'line',
      data: [
        {
          x: 1, 
          y: 44,
        },
        {
          x: 2, 
          y: 44,
        }
      ]
    }
  ],
  chart: {
    height: 350,
    type: 'line',
    stacked: true
  },
  plotOptions: {
    bar: {
      horizontal: false,
    }
  },
  stroke: {
    curve: 'stepline',
  },
  colors: [
    function(context) {
      const { value, seriesIndex, dataPointIndex, w } = context
      const status = w.config.series[seriesIndex].data[dataPointIndex]?.status
      if (status === 'non-value' || w.config.series[seriesIndex].name === 'LA') {
        // red
        return '#FF0000'
      } else if (status === 'nva') {
        // yellow
        return '#FFFF00'
      } else if (status === 'value') {
        // green
        return '#00FF00'
      } 
      else {
        return '#02DFDE'
      }
    }
  ],
  dataLabels: {
    enabled: true,
    textAnchor: 'middle',
    style: {
      colors: ['#fff'],
      fontSize: '12px'
    },
    formatter: function (val, opt) {
      return opt.w.config.series[opt.seriesIndex].name
    },
    offsetX: 0,
    dropShadow: {
      enabled: true
    },
  },
  legend: {
    customLegendItems: ['value', 'non-value', 'nva'],
    markers: {
      fillColors: ['#00FF00', '#FF0000', '#FFFF00']
    }
  }
}