canvas
郭薇薇_
多些关注给自己。
展开
-
canvas 绘图阴影
可以通过以下四个属性,改变图形,文本,图像的阴影效果。 1 shadowColor:CSS3格式的颜色2 shadowOffsetX:阴影水平像素偏移 3 shadowOffsetY:阴影垂直像素偏移4 shadowBlur:对阴影进行模糊化处理需要满足1的颜色不是全透明,然后其他三个属性有一个非0的值。原创 2016-10-26 23:29:09 · 544 阅读 · 0 评论 -
canvas路径,描边与填充
1 canvas中有两个可以用来实现立即绘图的方法。fillRect()和 strokeRect()方法。2 路径有开放路径和封闭路径。其中,rect()方法创建的路径是封闭的,arc()方法创建的圆弧路径则不封闭,除非你用它创建的是圆形路径,要想封闭某段路径,需要用closePath()方法才行。其中fillRect()和rect()方法的区别是 fillRect()能够立即看到原创 2016-10-26 23:29:54 · 1920 阅读 · 0 评论 -
canvas绘制渐变
渐变是指填充时从一种颜色慢慢过渡到另外一种颜色。因为是渐变所以一般会至少使用两次addColorStop()来追加颜色。1) 绘制线性渐变var g1 = ctx.createLinearGradient(xStart,yStart,xEnd,yEnd);//创建一个渐变对象g1.addColorStop(offset,color);//offset是0-1之间的浮点值,颜色离开原创 2016-10-31 21:43:22 · 605 阅读 · 0 评论 -
其他相关canvas绘制属性
绘制文字fillText(text,x,y,[maxWidth]);strokeText(text,x,y,[maxWidth]);其中,text参数表示是要绘制的文字,x,y是绘制文字的起始横纵坐标。maxWidth是可选参数,表示显示文字时的最大宽度。区别:fillText是填充方式绘图,strokeText是轮廓方式绘图。在绘图之前可以设置样式,比如设置字体颜色,字体格式原创 2016-10-31 21:46:09 · 476 阅读 · 0 评论