加入收藏 | 设为首页 | 会员中心 | 我要投稿 湖南网 (https://www.hunanwang.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 编程 > 正文

html5 Canvas绘图教程(4)—未闭合的路径及渐变色的添补要领

发布时间:2020-09-23 22:08:06 所属栏目:编程 来源:网络整理
导读:一样平常画图的方法有两种,即添补和描边,前面的文章已经讲了描边的要领stroke,本文就讲一下Canvas中添补图形的要领


这里我配置的径向渐变出发点圆和终点圆的圆心坐标沟通,而出发点圆半径为10,终点圆半径为55.最后画出的径向渐变范畴是一个宽高110的圆形,声名渐变范畴以终点圆的范畴为准。
(可以看到终点圆范畴之外照旧有颜色,这个颜色就是终点色,可是,假如你阴谋行使radial.addColorStop(1.5,’#0f0′);这样来界说渐变范畴之外的颜色,你照旧会收到一个错误).
那么,出发点圆的半径有什么用呢?——原来正常的径向渐变的中心(暂时称之为“变心”…吧)只是一个点,不该该是一个圆的。着实我们没错,这个出发点圆就相等于一个圆点罢了,只是也许较量大。
让我们把出发点圆的半径变得很大,靠近于终点圆的半径:

复制代码

代码如下:


var radial = ctx.createRadialGradient(55,55,50,55,55,55); //很靠近


其他的colorStop都稳固,然后图形就酿成了这个样子。

(编辑:湖南网)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

热点阅读