Javascript 如何制作最小填充图js折线图

我有一张这样的图表：

我想这样做：

如果我们在第二个折线图中看到有一个最小填充

这是我的密码：

html:

---

这里我使用了fill origin，如何使用最小填充。

请检查下面的代码，我刚刚尝试实现您想要的输出

你可以做复杂的渐变，但这里是一个简单的代码（改变相同红色的不透明度）

主要焦点

示例代码

var ctx=document.getElementById（“图表”）.getContext（“2d”）；
/***梯度***/
var gradient=ctx.createLinearGradient（0,0,0,400）；
梯度。添加颜色停止（0，'rgba（214,31,31,0.5'）；
渐变色停止（1，'rgba（214,31,31,0）'；
/***************/
风险值数据={
标签：[“02:00”、“04:00”、“06:00”、“08:00”、“10:00”、“12:00”、“14:00”、“16:00”、“18:00”、“20:00”、“22:00”、“00:00”]，
数据集：[
{
fillColor:gradient，//将渐变作为填充颜色放在这里
strokeColor:#ff6c23“，
点颜色：“#fff”，
pointStrokeColor:#ff6c23“，
pointHighlightFill:“fff”，
pointHighlightStroke:#ff6c23“，
数据：[25.0,32.4,22.2,39.4,34.2,22.0,23.2,24.1,20.0,18.4,19.1,17.4]
}
]
};
变量选项={
回答：是的，
datasetStrokeWidth:3，
pointDotStrokeWidth:4，
工具提示FillColor:“rgba（0,0,0,0.8）”，
tooltipFontStyle：“粗体”，
ToolTiptTemplate:“：”，
scaleLabel:“
};
var myLineChart=新图表（ctx）.Line（数据、选项）
请检查以下答案，如果对您有用，请接受
 <canvas id="canvas"></canvas>

  var data = [1,0,3,0,5,6]
  var lineChartData = {
  labels: ['Mon', 'Tues', 'Wed', 'Thu','Fri', 'Sat', 'Sun'],
  datasets: [{
      label: 'Temperature',
      borderColor: '#077d07',
      backgroundColor: '#077d07',
      fill: 'origin',
      data: data ,
      yAxisID: 'y-axis-1'}
     ]
   };

     var weekly  = Chart.Line('canvas', {
      data: lineChartData,
      options: {
          responsive: true,
          hoverMode: 'index',
          stacked: false,
          title: {
              display: true,
              text: 'Last updated at  : '+ new Date().toLocaleString()
          },
          scales: {
              yAxes: [{
                ticks:{
                    min: 0,
                    max:10,
                    stepSize:2
                  },
                  type: 'linear',
                  position: 'left',
                  id: 'y-axis-1'
                }],
          }
      }
  });

var gradient = ctx.createLinearGradient(0, 0, 0, 400);
gradient.addColorStop(0, 'rgba(214, 31, 31, 0.5)');   
gradient.addColorStop(1, 'rgba(214, 31, 31, 0)');