画布中绘制渐变线

画布中绘制渐变线

本文介绍了如何在 HTML 画布中绘制渐变线?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在尝试绘制一条渐变线.这在画布中怎么可能?

I am trying to draw a line which is a gradient. How is that possible in canvas?

推荐答案

是的.示例:

// linear gradient from start to end of line
var grad= ctx.createLinearGradient(50, 50, 150, 150);
grad.addColorStop(0, "red");
grad.addColorStop(1, "green");

ctx.strokeStyle = grad;

ctx.beginPath();
ctx.moveTo(50,50);
ctx.lineTo(150,150);

ctx.stroke();

在这里查看它的实际效果:

See it in action here:

http://jsfiddle.net/9bMPD/

这篇关于如何在 HTML 画布中绘制渐变线?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

08-06 07:56