html5 canvas学习--设置图形的透明度
来源:互联网 发布:交通银行数据录入员 编辑:程序博客网 时间:2024/06/10 20:22
<!DOCTYPE html><html><head><meta charset="utf-8"><title></title><script type="text/javascript">function draw(){// 获取context对象var ctx = document.getElementById("myCanvas").getContext("2d");// 调整坐标的位置ctx.translate(200,20);// 循环遍历for(var i = 1;i<50;i++){// 保存状态ctx.save();// 矩阵转化ctx.transform(0.95,0,0,0.95,30,30);// 旋转ctx.rotate(Math.PI/12);// 开始路径ctx.beginPath();// 填充的样式ctx.fillStyle = 'rgba(255,0,0,'+(1-(i+10)/40)+')';// 画圆ctx.arc(0,0,50,0,Math.PI*2,true);// 闭合路径ctx.closePath();// 填充ctx.fill();}}window.onload = function(){draw();}</script></head><body><canvas id="myCanvas" width="700" height="300"></canvas></body></html>
0 0
- html5 canvas学习--设置图形的透明度
- <canvas>学习笔记——设置图形的透明度
- html5 canvas学习--缩放图形
- html5 canvas学习--图形的组合与裁切
- Html5学习------canvas绘制径向渐变图形
- 使用 HTML5 canvas 绘制精美的图形
- 使用 HTML5 canvas 绘制精美的图形
- html5学习笔记二:利用canvas绘制简单图形
- HTML5 学习笔记15-Canvas图形绘制处理
- Html5 canvas学习5-图形变形:缩放 旋转 平移 变形
- HTML5 canvas图形库 RGraph
- HTML5 Canvas画简单图形
- html5 canvas基本图形绘制
- HTML5使用canvas绘制图形
- HTML5使用canvas绘制图形
- HTML5 Canvas元素绘制图形
- HTML5 Canvas绘制的图形的事件处理
- html5中的画布canvas---画出弧线、旋转的图形
- 请不要重复犯我在学习Python和Linux系统上的错误
- EL表达式
- C# tcp test 服务器端
- 写博文交作业的意义
- Linux系统操作三之软件安装方法
- html5 canvas学习--设置图形的透明度
- 如何搭建网站
- Codeforces Round #359 (Div. 1) D. Kay and Eternity ★ ★ ★ ★
- 五、OSM2VectorTiles项目介绍
- 《java编程思想》第十八章 java I/O系统
- Windows PE 第四章 导入表
- 最后一个单词长度(程序)
- Fragemnt+ViewPager懒加载
- 指针(2)