# uni.createCanvasContextAsync(options)

获取CanvasContext对象实例

uni.createCanvasContextAsync 方法可以异步获取页面上指定id的canvas组件的上下文对象CanvasContext。

因微信小程序获取CanvasContext只能异步,所以为了跨端,本API也被设计成了异步API,需要在回调中获取CanvasContext。

获取到CanvasContext对象后,还需通过getContext("2d")方法获取CanvasRenderingContext2D对象。

如果不考虑小程序,那么Web和App其实支持通过uni.getElementById方式同步获取UniCanvasElement

参考文档:

# createCanvasContextAsync 兼容性

Web 微信小程序 Android iOS
4.25 4.41 4.25 4.25

# 参数

名称 类型 必填 默认值 兼容性 描述
options CreateCanvasContextAsyncOptions - - -
名称 类型 必备 默认值 兼容性 描述
id string.IDString -
canvas 元素的 id 属性
component ComponentPublicInstance -
组件或页面实例,限定在什么范围内查找id
success (context: CanvasContext) => void -
接口调用成功的回调函数
fail (error: UniError) => void -
接口调用失败的回调函数
complete () => void -
接口调用结束的回调函数(调用成功、失败都会执行)

# CanvasContext 的方法

# getContext(type: '2d'): CanvasRenderingContext2D | null

# getContext 兼容性
Web 微信小程序 Android iOS
- - - -
# 参数
名称 类型 必填 默认值 兼容性 描述
type string - - -
# 返回值
类型 必备
CanvasRenderingContext2D

# toBlob(callback: CanvasContextToBlobCallback, type?: string, quality?: number): void

创造 Blob 对象

# toBlob 兼容性
Web 微信小程序 Android iOS
4.25 4.41 x x
# 参数
名称 类型 必填 默认值 兼容性 描述
callback (blob: Blob) => void - - -
type string - - -
quality number - - -

# toDataURL(): string

返回一个包含图片展示的 data URI

# toDataURL 兼容性
Web 微信小程序 Android iOS
4.25 4.41 4.25 4.25
# 返回值
类型
string

# createImage(): Image

返回一个包含图片展示的 data URI

# createImage 兼容性
Web 微信小程序 Android iOS
4.25 4.41 4.25 4.25
# 返回值
类型 描述
Image 重复的图像源,支持代码包路径和本地临时路径 (本地路径)

# createPath2D(): Path2D

返回一个包含图片展示的 data URI

# createPath2D 兼容性
Web 微信小程序 Android iOS
4.25 4.41 4.25 4.25
# 返回值
类型
Path2D

# requestAnimationFrame(callback: RequestAnimationFrameCallback): number;

在下一次重绘之前,调用用户提供的回调函数

# requestAnimationFrame 兼容性
Web 微信小程序 Android iOS
4.25 4.41 4.25 4.25
# 参数
名称 类型 必填 默认值 兼容性 描述
callback (time: number) => void - - -
# 返回值
类型
number

# cancelAnimationFrame(taskId: number): void;

取消一个先前通过调用 uni.requestAnimationFrame() 方法添加到计划中的动画帧请求

# cancelAnimationFrame 兼容性
Web 微信小程序 Android iOS
4.25 4.41 4.25 4.25
# 参数
名称 类型 必填 默认值 兼容性 描述
taskId number - - -

# 参见

# 通用类型

# GeneralCallbackResult

名称 类型 必备 默认值 兼容性 描述
errMsg string -
错误信息

# 注意事项

  • CanvasContext的toDataURL方法在 App-Android 平台暂不支持在页面的onLoad和组件的onMount生命周期中调用