HTML5
关注
分享
扫一扫
文章平均质量分 69
雅痞子军
这个作者很懒，什么都没留下…
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
透明处理
对于透明处理，我们都是在得到像素数组后，将该数组中每一个像素的透明度乘以n，然后保存像素数组，最后使用putImageData()方法将图像重新绘制在画布上。语法： for(var i=0;i<data.length;i++){ data[i+3]=data[i+3]*n; }说明：n的取值范围为0.0~1.0看下面一段代码：<!DOCTYPE ...原创 2018-05-08 22:18:31 · 344 阅读 · 0 评论 -
arcTo()画弧线
在Canvas中，可以使用arcTo()方法来画一条弧线。语法： cxt.arcTo(cx,cy,x2,y2,radius);说明：（cx,cy）表示控制点的坐标，（x2,y2）表示结束点的坐标，radius表示圆弧的半径。如果我们想要画一条弧线，需要提供三个点的坐标：开始点、控制点和结束点。其中一般由moveTo()或lineTo()提供开始点，arcTo()提供控制点和结束点。arcTo()方...原创 2018-05-04 23:19:59 · 1435 阅读 · 0 评论 -
strokeText()方法
在Canvas中，我们可以使用strokeText()方法来绘制“描边文本”。“描边文本”是指空心的文本。语法：strokeText(text,x,y,maxWidth);说明：参数text是一个字符串文本。参数x表示文本的x坐标，也就是文本最左边的坐标。参数y表示文本的y坐标，也就是文本最下边的坐标（注意是最下边，而不是最上边）。参数maxWidth是可选参数，表示允许的最大文本的宽度（单位为p...原创 2018-05-05 20:58:59 · 2557 阅读 · 0 评论 -
translate（）方法
在canvas中，可以使用translate()方法来平移图形。所谓的平移，是指图形沿着x轴或y轴进行直线运动。平移不会改变图形的形状和大小。语法： cxt.translate(x,y);说明：x表示图形在x方向上移动的距离，默认单位是px。当x为正时，图形向x轴正方向移动；当x为负时，图形向x轴反方向移动。y表示图形在y方向上移动的距离，默认单位是px。当y为正时，图形向y轴正方向移动；当y为负...原创 2018-05-06 21:53:39 · 11001 阅读 · 2 评论 -
scale()方法的副作用
在Canvas中，可以使用scale()方法来改变图形大小（即缩放）。不过scale()方法是有一定副作用的，它除了改变图形大小之外，还会改变其他属性如线条宽度（即lineWidth）、左上角坐标等。看下面一段代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" />...原创 2018-05-07 23:06:01 · 2672 阅读 · 0 评论