isPointInPath
方法
- 该方法主要是判断参数(x,y)点是否在路径上,如果在路径上就返回true,否则false
- 该方法主要是针对路径的,对
fillRect
这里是没有效果的 - 该方法主要是针对当前路径的,如果当前路径上有多路径,只对第一个子路径有效
向canvas上绘制图形或是图像的步骤:
- 将图像绘制放到一个无限大的透明位图上
- 将图像的阴影绘制到另一个位图上
- 将阴影中的每个像素的alpha分量都乘以绘图环境中设置的
globalAlpha
属性值,也就是给每个像素都设置了一个透明度 - 将上面两个位图进行合图像合成,在操作的时候可以使用合成模型参数
圆角矩形的绘制
- 没有规定具体的像素的话,可以通过
lineJoin
来实现圆角
rect
创建的路径是闭合的,但是arc
创建的路径不是闭合的,如果在调用该方法是已有其他的子路径存在,arc
会用一条线段将已有的路径终点和该圆弧的起点连接在一起.rect
是只能顺时针创建,而arc
可以通过参数来改变创建的方向
问题是如何确保可以在像素之间呢
线段的连接点 当两条线段进行连接的时候
lineJoin = miter
,可以通过miterLimit
属性来表示斜接线的长度与二分之一线宽的比值。如果斜切线的长度超过了该值。浏览器会以bevel
方式来绘制线段的连接点
贝塞尔曲线 内容跳转 图像和视频
drawImage
参数drawImage(image,dx,dy)
- 如果没有传入目标canvas的宽度就直接按照图片的原始默认大小来绘制
drawImage(image,dx,dy,dw,dh)
drawImage(image,sx,sy,sw,sh,dx,dy,dw,dh)
- 其中以字母
d
开头的变量是指目标canvas,以字母s
开头的变量指的是源图像 - 如果
drawImage
中传入的是视频对象HTMLVideoElement
,那么该方法就是将当前视频帧绘制出来