Chart JS Fill Between two lines

Question

I am looking for a way to fill between two lines with Chart.js so that it would look like this. I have looked and everything seems to talk about filling between two lines ac

Answer 1

Setting fill property to +1 of a dataset will set the backgroundColor from this line to the next line in dataset.

datasets: [{
        label: 'Systolic Guideline',
        data: [],
        fill: '+1',
        borderColor: '#FFC108',
        backgroundColor: 'rgba(255,193,8,0.2)'
      },
      {
        label: 'Diastolic Guideline',
        data: [],
        fill: true,
        borderColor: '#FFC108',
        backgroundColor: 'rgba(0,0,0,0)'
      }]