我正在使用 Chart.js 构建图表，并尝试用渐变填充线条下方的空间，但是我希望渐变基于线条而不是来自画布。例如，这是标准渐变，渐变基于总高度而不是线高。
我想做的是让渐变跟随线条的高度。到目前为止，我已经尝试过阴影和不同的渐变填充，但未能获得所需的效果。例如，这个设计就是我想要实现的。
var ctx = document.getElementById( 'large-line-FUA' ).getContext('2d');
var gradientStroke = ctx.createLinearGradient(0, 0, 0, 100);
gradientStroke.addColorStop(0, "#2aabdb");
gradientStroke.addColorStop(1, "rgba(42, 171, 219,0.2)");
var myChart = new Chart( ctx, {
type: "line",
data: {
labels: [ "JAN", "FEB", "MAR", "APR", "MAY", "JUN" ],
datasets: [
{
label: 'Cash',
data: [ 12, 19, 3, 5, 2, 3 ],
borderColor: "#2aabdb",
backgroundColor:gradientStroke,
pointRadius: 5,
pointBorderWidth:2,
pointBorderColor: "#FFF",
pointBackgroundColor: "#2aabdb",
},
]
},
options: {
legend: {
display: true, …