[Solved]-How to create a gradient fill line chart in latest Chart JS version (3.3.2)?-Chart.js

    var ctx = document.getelementbyid('chart').getcontext('2d');

    var gradient = ctx.createlineargradient(0, 0, 0, 300);
    gradient.addcolorstop(0, 'rgba(224, 195, 155, 1)');
    gradient.addcolorstop(1, 'rgba(100, 100, 0,0)');

    var mychart = new chart(ctx, {
      type: 'line',
      data: {
        labels: ['red', 'blue', 'yellow', 'green', 'purple', 'orange'],
        datasets: [{
          backgroundcolor: gradient,
          label: 'numbers',
          fill: true,
          data: [12, 19, 3, 5, 2, 3],
        }]
      },
      options: {
        scales: {
          y: {
            beginatzero: true
          }
        },
        tension: 0.3
      }
    });

<script src="https://cdn.jsdelivr.net/npm/chart.js@3.3.2/dist/chart.min.js"></script>
<canvas id="chart" width="800" height="400"></canvas>