canvas drawImage

canvas drawImage使用

描述
元素本身并没有绘制能力(它仅仅是图形的容器) - 您必须使用脚本来完成实际的绘图任务。

getContext() 方法可返回一个对象,该对象提供了用于在画布上绘图的方法和属性。
getContext(“2d”) 对象属性和方法,可用于在画布上绘制文本、线条、矩形、圆形

//图像位置
context.drawImage(img,x,y)
//图像宽高
context.drawImage(img,x,y,width,heigth);
//在画布上剪切位置和宽高
context.drawImage(img,sx,sy,swidth,sheight,x,y,width,heigth)

参数值

参数
描述

img
规定要使用的图像、画布或视频。

sx
可选。开始剪切的 x 坐标位置。

sy
可选。开始剪切的 y 坐标位置。

swidth
可选。被剪切图像的宽度。

sheight
可选。被剪切图像的高度。

x
在画布上放置图像的 x 坐标位置。

y
在画布上放置图像的 y 坐标位置。

width
可选。要使用的图像的宽度。(伸展或缩小图像)

height
可选。要使用的图像的高度。(伸展或缩小图像)

相关推荐
©️2020 CSDN 皮肤主题: 深蓝海洋 设计师:CSDN官方博客 返回首页