html - 如何在 HTML5 画布上绘制渐变线？

Question

我正在寻找一个绘制渐变线的函数。它可以通过绘制一个 1px 宽的渐变矩形来完成，但不知何故我总是得到错误的颜色。我认为因为矩形内的位置是相对的，我需要使用绝对位置来画线。

那么有人可以展示一个快速示例功能吗？

Answer 1

这是一个函数，它应该可以完成渐变线绘制

function drawgradientline(x,y,height){
     var grd = context.createLinearGradient(x, y, 1, height);

      grd.addColorStop(0, '#12a6eb');   

      grd.addColorStop(1, '#ebc711');
  context.fillStyle = grd;
  context.fill();
}