Q: How to achieve this gradient crosshair line in ApexChart.js with Angular?

What I've tried, from the docs: https://apexcharts.com/docs/options/xaxis/#crosshairsFillGradient

xaxis: {
  crosshairs: {
    show: true,
    position: 'back',
    stroke: {
      color: 'rgba(255, 255, 255, 0.5)',
      width: 1,
      dashArray: 0,
    },
    //TODO: crosshair gradient
    fill: {
      type: 'gradient',
      color: 'blue', //sample color only
      gradient: {
        colorFrom: 'blue', //sample color only
        colorTo: 'blue', //sample color only
        stops: [0, 100, 0],
        opacityFrom: 1,
        opacityTo: 1
      },
    }
  }
}

Dependencies version: "apexcharts": "3.32.0", "ng-apexcharts": "1.6.0",

CodePudding user response：