CanvasContext.drawImage(string imageResource, number sx, number sy, number sWidth, number sHeight, number dx, number dy, number dWidth, number dHeight)

CanvasContext 是旧版的接口,新版 Canvas 2D 接口与 Web 一致

从基础库 2.9.0 开始,本接口停止维护,请使用 RenderingContext 代替

微信小程序插件:支持

相关文档: 旧版画布迁移指南、canvas 组件介绍

功能描述

绘制图像到画布

参数

string imageResource

所要绘制的图片资源(网络图片要通过 getImageInfo / downloadFile 先下载)

number sx

需要绘制到画布中的,imageResource的矩形(裁剪)选择框的左上角 x 坐标

number sy

需要绘制到画布中的,imageResource的矩形(裁剪)选择框的左上角 y 坐标

number sWidth

需要绘制到画布中的,imageResource的矩形(裁剪)选择框的宽度

number sHeight

需要绘制到画布中的,imageResource的矩形(裁剪)选择框的高度

number dx

imageResource的左上角在目标 canvas 上 x 轴的位置

number dy

imageResource的左上角在目标 canvas 上 y 轴的位置

number dWidth

在目标画布上绘制imageResource的宽度,允许对绘制的imageResource进行缩放

number dHeight

在目标画布上绘制imageResource的高度,允许对绘制的imageResource进行缩放

示例代码

有三个版本的写法:

  • drawImage(imageResource, dx, dy)
  • drawImage(imageResource, dx, dy, dWidth, dHeight)
  • drawImage(imageResource, sx, sy, sWidth, sHeight, dx, dy, dWidth, dHeight) 从 1.9.0 起支持
const ctx = wx.createCanvasContext('myCanvas')

wx.chooseImage({
  success: function(res){
    ctx.drawImage(res.tempFilePaths[0], 0, 0, 150, 100)
    ctx.draw()
  }
})

CanvasContext.draw(boolean reserve, function callback)

CanvasContext 是旧版的接口,新版 Canvas 2D 接口与 Web 一致

从基础库 2.9.0 开始,本接口停止维护,请使用 RenderingContext 代替

微信小程序插件:支持

相关文档: 旧版画布迁移指南、canvas 组件介绍

功能描述

将之前在绘图上下文中的描述(路径、变形、样式)画到 canvas 中。

参数

boolean reserve

本次绘制是否接着上一次绘制。即 reserve 参数为 false,则在本次调用绘制之前 native 层会先清空画布再继续绘制;若 reserve 参数为 true,则保留当前画布上的内容,本次调用 drawCanvas 绘制的内容覆盖在上面,默认 false。

function callback

绘制完成后执行的回调函数

示例代码

第二次 draw() reserve 为 true。所以保留了上一次的绘制结果,在上下文设置的 fillStyle ‘red’ 也变成了默认的 ‘black’。

const ctx = wx.createCanvasContext('myCanvas')

ctx.setFillStyle('red')
ctx.fillRect(10, 10, 150, 100)
ctx.draw()
ctx.fillRect(50, 50, 150, 100)
ctx.draw(true)

示例代码

第二次 draw() reserve 为 false。所以没有保留了上一次的绘制结果和在上下文设置的 fillStyle ‘red’。

const ctx = wx.createCanvasContext('myCanvas')

ctx.setFillStyle('red')
ctx.fillRect(10, 10, 150, 100)
ctx.draw()
ctx.fillRect(50, 50, 150, 100)
ctx.draw()

CanvasContext.createPattern(string image, string repetition)

CanvasContext 是旧版的接口,新版 Canvas 2D 接口与 Web 一致

从基础库 2.9.0 开始,本接口停止维护,请使用 RenderingContext 代替

基础库 1.9.90 开始支持,低版本需做兼容处理。

微信小程序插件:支持

相关文档: 旧版画布迁移指南、canvas 组件介绍

功能描述

对指定的图像创建模式的方法,可在指定的方向上重复元图像

参数

string image

重复的图像源,支持代码包路径和本地临时路径 (本地路径)

string repetition

如何重复图像

repetition 的合法值

值 说明 最低版本
repeat 水平竖直方向都重复
repeat-x 水平方向重复
repeat-y 竖直方向重复
no-repeat 不重复

示例代码


    const ctx = wx.createCanvasContext('myCanvas')
    const pattern = ctx.createPattern('/path/to/image', 'repeat-x')
    ctx.fillStyle = pattern
    ctx.fillRect(0, 0, 300, 150)
    ctx.draw()

CanvasContext.createLinearGradient

CanvasContext 是旧版的接口,新版 Canvas 2D 接口与 Web 一致

从基础库 2.9.0 开始,本接口停止维护,请使用 RenderingContext 代替

微信小程序插件:支持

相关文档: 旧版画布迁移指南、canvas 组件介绍

功能描述

创建一个线性的渐变颜色。返回的CanvasGradient对象需要使用 CanvasGradient.addColorStop() 来指定渐变点,至少要两个。

参数

number x0

起点的 x 坐标

number y0

起点的 y 坐标

number x1

终点的 x 坐标

number y1

终点的 y 坐标

返回值

CanvasGradient

示例代码

const ctx = wx.createCanvasContext('myCanvas')

// Create linear gradient
const grd = ctx.createLinearGradient(0, 0, 200, 0)
grd.addColorStop(0, 'red')
grd.addColorStop(1, 'white')

// Fill with gradient
ctx.setFillStyle(grd)
ctx.fillRect(10, 10, 150, 80)
ctx.draw()

<img alt="" src="https://developers.weixin.qq.com/data:image/png;base64,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%0A%0A“>

CanvasContext.createCircularGradient(number x, number y, number r)

CanvasContext 是旧版的接口,新版 Canvas 2D 接口与 Web 一致

从基础库 2.9.0 开始,本接口停止维护,请使用 RenderingContext 代替

微信小程序插件:支持

相关文档: 旧版画布迁移指南、canvas 组件介绍

功能描述

创建一个圆形的渐变颜色。起点在圆心,终点在圆环。返回的CanvasGradient对象需要使用 CanvasGradient.addColorStop() 来指定渐变点,至少要两个。

参数

number x

圆心的 x 坐标

number y

圆心的 y 坐标

number r

圆的半径

返回值

CanvasGradient

示例代码

const ctx = wx.createCanvasContext('myCanvas')

// Create circular gradient
const grd = ctx.createCircularGradient(75, 50, 50)
grd.addColorStop(0, 'red')
grd.addColorStop(1, 'white')

// Fill with gradient
ctx.setFillStyle(grd)
ctx.fillRect(10, 10, 150, 80)
ctx.draw()

<img alt="" src="https://developers.weixin.qq.com/data:image/png;base64,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

“>

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AKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPAIDDEOH8Dg8AgMAgMMc7fwCAwCAwCQ4zzNzAIDAKDwBDj/A0MAoPA

<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAADwAAAA8AAQMAAACuBRCwAAAAA1BMVEX///+nxBvIAAAAAXRSTlMAQObYZgAAAAlwSFlzAAAOxAAADsQBlSsOGwAADwBJREFUeF7s3QmQJFd1J/z3MrOqu6p7RnJ3VXV3dVV1dVV1dVV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1d%0A%0A“>

CanvasContext.closePath()

CanvasContext 是旧版的接口,新版 Canvas 2D 接口与 Web 一致

从基础库 2.9.0 开始,本接口停止维护,请使用 RenderingContext 代替

微信小程序插件:支持

相关文档: 旧版画布迁移指南、canvas 组件介绍

功能描述

关闭一个路径。会连接起点和终点。如果关闭路径后没有调用 fill 或者 stroke 并开启了新的路径,那之前的路径将不会被渲染。

示例代码

const ctx = wx.createCanvasContext('myCanvas')
ctx.moveTo(10, 10)
ctx.lineTo(100, 10)
ctx.lineTo(100, 100)
ctx.closePath()
ctx.stroke()
ctx.draw()

const ctx = wx.createCanvasContext('myCanvas')
// begin path
ctx.rect(10, 10, 100, 30)
ctx.closePath()

// begin another path
ctx.beginPath()
ctx.rect(10, 40, 100, 30)

// only fill this rect, not in current path
ctx.setFillStyle('blue')
ctx.fillRect(10, 70, 100, 30)

ctx.rect(10, 100, 100, 30)

// it will fill current path
ctx.setFillStyle('red')
ctx.fill()
ctx.draw()

CanvasContext.clip()

CanvasContext 是旧版的接口,新版 Canvas 2D 接口与 Web 一致

从基础库 2.9.0 开始,本接口停止维护,请使用 RenderingContext 代替

基础库 1.6.0 开始支持,低版本需做兼容处理。

微信小程序插件:支持

相关文档: 旧版画布迁移指南、canvas 组件介绍

功能描述

从原始画布中剪切任意形状和尺寸。一旦剪切了某个区域,则所有之后的绘图都会被限制在被剪切的区域内(不能访问画布上的其他区域)。可以在使用 clip 方法前通过使用 save 方法对当前画布区域进行保存,并在以后的任意时间通过restore方法对其进行恢复。

示例代码

const ctx = wx.createCanvasContext('myCanvas')

wx.downloadFile({
  url: 'http://is5.mzstatic.com/image/thumb/Purple128/v4/75/3b/90/753b907c-b7fb-5877-215a-759bd73691a4/source/50x50bb.jpg',
  success: function(res) {
    ctx.save()
    ctx.beginPath()
    ctx.arc(50, 50, 25, 0, 2*Math.PI)
    ctx.clip()
    ctx.drawImage(res.tempFilePath, 25, 25)
    ctx.restore()
    ctx.draw()
  }
})

<img alt="" src="https://developers.weixin.qq.com/data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAUoAAACsCAYAAAAdQ+UuAAAYiElEQVR4nO3dCZhdZXkH8P/Zz7137p09mUlCSMwCIWxh3xEQWWRxAWvFrWIttoiIPH2stn3s4kMfUdQqLRZrwQWwVVGgbBKJCoRdlhAggeyZyUxmn7udve93bmwVCUdsZnIJ/r9xuDN37r3n3PM8/vO+93zfd7REgIiIdkrf3TtARNTsGJRERBkYlEREGRiUREQZGJRERBkYlEREGcysB2iaNh37QUS0y+zqUY+ZQTkVGyUimipTUdyx9SYiysCgJCLKwKAkIsrAoCQiysCgJCLKwKAkIsrAoCQiysCgJCLKwKAkIsrAoCQiysCgJCLKwKAkIsrAoCQiysCgJCLKwKAkIsrAoCQiysCgJCLKwKAkIsrAoCQiysCgJCLKwKAkIsrAoCQiysCgJCLKwKAkIspg7u4dmAq3T96Jh6oPY2u4FX1BP/rDbegL+9O/zTJ70Wv2YJbVi9nmbByfPwbnFM/ezXtMRM1MS8RrPkDTkPGQ3a4cl3Fn+R78eOI23FW+F5W48rqe36K34KyWt+LtpfPSW/U7Eb0xTUVmvaGDUgXkNUNfxVeGv/66w3FnVEhe3nkpLu/6OIp6cZe8JhFNHwblDn7i47qR6/FPg1/EUDQ0JdvoMrrwmRl/iY92XAxbs6dkG0S06zEoxXPe87ho0wew2nvht+7Xpmh7S50D8P19v4dF9sIp2gIR7UpTkVlvqLPe3xu7Bce8dOLvhORUes5bnW7z26PfnbZtElFzeUNUlOqzyEv7LsdNY9/f6WOmqqL8Te9vuwhfm/1l5LTcNGyNiP4Qe2Xrvbq+Ghds+COsDda/5uOMadrFpe5S3Dj333Gge+D0bJCIXpe9Lihj+XrH+gtw2+hPgFIRCDW4foJ8bRzj8veoA1jiHIll44dg6Yxl6LCK6EUrOiIHceRjSzKEVfFmrIm34VFvBUYq6+BpHmDJc0NXNuDAlN/NpC63rUgiqUs1A3XdQ5RUAdtEISlISSubdv3/3a8ziqfj1vk/hP7G+uSCaK+w1wXlZzf/Da4e/jKMvIbeyQSb4goiw8W83IE4rngiTu08GSfllmAR2hGHJmLTQaRSUBpxE2qfffmqYwyT2A4DqweexIqt9+Dn5fuxJvcy0KkjF9jwBqrQOyRcA3lmbECzJQDNBJHcoct9RqgjecWJ7091fxKf7/2H3XFYiOg17FVB+aOxn+A96y6SYIylsksQj9WxrzMDJ3acgdNnXohT3dMwp56X0hCNU1KqSrTS4g+q9svt+FZPTzOzjvSDzCHTxwPxfbih71/w0213oWrHaC/OxoQ2hCiQB3o6HAljx5IA9avwgypc10acGL+zj9+ZewMubLtg+g4KEWXaa4JyIBjE/qsPRT0nFWQQIijX0NK7EJfnLsSf5d6HObn9kJZ6aQloYUR30AF5nLTq6qSOqf4rbTo8td8ScKYOz+lH4BXgOqU0SF/C47hl84344di9WBOuh5GTStLQEdZCGFJlFvQ8QmnfA4les6gjqv/uWMqSXsJLS1ejVW+d1uNDRDu31wwPumrwaowZg6jXy3B9B/PtRbi6+Flc2n0J5jhL4EmgbddqcjsJ9UlmR6SKxkjeTCIRqUrMUI5W1AhTO0LkxFJwWtCcCPIs5DzgYO8IfHqfv8WH5/8pOv25MCYkKOsaNFNDLM8NwzB9jmU5CFUgv4qJeAJfGPjStB4bIpp+TVdRDoQD2H/LIRirDgDbgWX5w3D2gnPwj8nfSQmn2usQ4xKErnzlJQ9RjxHnJCRjC6HE/qQUkrHcqvpPrfhhpKeEYrgVM+3FPQlPJ9zRo8vvL9gbcPfIcnzt+asxqG9DpViBbpmwKrKFxEVse5gIR2HvZDqjozlYs3QVesyZ03aMiGjn9oqK8u/7rkI1qEB6XvToM3F621vxwY4PAWqdCsm6oO6joxohl9TwlLca30/uxB3GCgnMGkwJznZ5XqdUjEX5ziWhVJDb8dS2B/HD2v345egjmPSG5F3LAwtIP9ecp83Fe4rvwIlzTkZb1I5EWn3NjiV0ffih19hojPTAv9p3Pa7jC9tYVRLtyZoqKDf6m/C9oVvgj0hQVoElnfvjpJknYVE4H54zDDV6x03yUiYW8ET8IK7YcDne+9gf469WfxzL9aexxRmC70hSqoAzqhjShnFLdTmuWHMtLnj5VHxj4p8xnGxNS041X3xCr0urHksgd+D4eSeg2+1KAzqRxA0lAGu+vE6iQzOc19zv64e+hXX+a4/zJKI3rqYKyuXD92FcH4KZl7JZb8HpLe/CstIp6ZltJ2lNz92k/bRTxrPlZ/FstBpxWxmr3ZfwyPYXMEPejj2mIZJg88y8PNTHxqEnsLJ9hVSkOTy85Sk8Eb6EMbMM3bbT9t2TR6mu/M04A6f2nosiuhENxsgZJmaaObjjvlSpLiwvhG1IbjohgqSCMKzCkZh15b/1IMby8eW7+egR0VRpqqC8ffvtUgma0CQQ261uLCjug5wEkTpxDc2Dbu14YOKi25+Ng7yD0TE0H4vX7Y9Deg+Qh8nbceVbnhIlqrsu4vDWZZg1MAd2uYZ5EqAL8zPk3lJaOapzPcWyj0I9wCLPxTFhF94U96TjjGpaDttyOgYLMUbsKjTfRFjTYAU5FOw2uJqLeqWGijcJSKt+2+jtu/PQEdEUapoVztUZ5OUTPwM6pU6b8DCv0IuDS/OlYtPSvQylOgwiW4JT0jI0cWz3qbii2ImRyjA6QgdHOYfACCM1OhxlzUiHB+W1Es5qPQtfOK4N6yobcJi1GEfpR0tIBhipb8H24iSe11/EprHNiKRqfFh/AgPdIeDJ86tlOJK2Vj6GVpTsjdpRDX14tTD9sNiWnbItaeHNKB2YtGLi52k7zyXZiPY8TROUd4/fCV/zpcwrIKlJ21vokgqwR+Ue6qYqEi2JTL0xeFxuWtGFU9zjYLiJhKkld0uAxhKUVohYgitnuip9kXc6cV7+rdDzEm1SQfaVN+MnA3fgjslfoF6KMDtswYJ6O8btVszId+Gs3LGoRQsxFg9iU20b1oRbEPqRhPQoYlsNPE+QSKutJyZytoS6Gkrk1RBoOu6XsDyj9fTdfSiJaBdrmqBcU3+hcUo/0SWEdIk9Q3bOTLvuOIkkkFz52Uhn1/hqPHkSw5XHpTNvhKaGCqkEVdO1JSrTzxTsRrC2SP03GD6Ja1/8KVZE67BvbwcunncmjjQWyWPnoYpZWBzJCxkSiEkV9bCC8biMVf5G3Dv2OB4aeQ5Pl2+Wdt6HlpO9ciW0/QT1ahXqEObMgvzNw6PlRxmURHugpgnKl72N0GM1/ieEZWuY0KoYRQVdZiecxJDWeMd0RDVaZ8dswjQ4Jdx8SUk7sRCFYXqfK4WlH3hSbVqoo4YXJtbissHLcVr7MnyldAaWFA6GrndKy1xAQc24UVN1HD0NadNoRd5qRVECdo4zH0eZSzBgbsMXu4HHNj6DVYNrEJRqMCUwEz2CHurIGwWUpS3fUN+0Ow8hEU2RpgnK9X4fDGlnDT+AaUXoj0awxt+CVnsu7KAxj9tQZ70lFNXcG7XsBTwpH6WyHM/F6LLUjEVptaVJd+V1AnncEMZwT/+9WLnxAXyk/Tyc0nOatPMHyIs5qEnoWqrsNOWHag2JPSkB3CIv6UrjriPRPKlqYxRybViUa8df43O4I74HN6//AZ6sPi6Pq8B0LNlXQ9ryevoeNngMSqI9UdME5TYJRlMqRyOS8s6MMByNYtPkAJZ1SgddjxDahnTSaq6iSksrbcklzSQ9baivmtSOhm2nJ1sceVuWY6IvGMDKwUcRL4nxJy1XoiJPUhetbZXbvBpLLmVqnDcx2FFAt4SjIc/Mh78eCJBLO/lkx5Tx+dWFeP+cXmidLspry3hWWvLQ9KGbJmq1AJYE5oBsj4j2PE0zPGjC25KGne5LG2t3Yri6FXfUbpd7JHzG0yYbkxLrVcORFlyHo9plFfNSObZKix6oEY2VF2GolljuHwxfxucHPo03tc7GV7Rr0unfhTLQG6cjg/B4sAar9M3yc4IeeS3Dk2AcbXymqcZVPhOtw1P+s5jUyvLKSHPTlQrzEvdcfK77s8hVFqePbQvq0KwSkkSqYKmKiWjP0zRBWfdD2FIR2moFH89LK8d1w+vxZP1pSTc1PAcoSsWphgtZqsxTYyoNpEEn9Vy6pBrcgipGoUmALZ94CrbXgtM6D4NWkirQqcAvBBjTx3Dr6A34i2c+iI/86iLcNHQD6mYZE84golKAuhXi7upPcMmT78P7H343buy/HpP6RNriq5NLZuJicfd+OGHBsTB9C+ocUBKo8lRHEx1OItqFmub/2TPMHiS6OmWtSr5augbluvGX8YM1t+N584W0IkwHiVdCaFHYOPuNCL6l1gtSzXeMmtHVODEjVaYa/jMb83FYbplUqo0q0tY0CdQIG+vP49GJh/FI+WGs9V+EqxsStzaM9HYSayefwMpgJVZpL+BlqUyjQOI4iRvDk0IHbzIX4pyFZ6K13gFPzatMPHVqHj3GjN17EIloSjRNUPa4c1Cr+wjT+dVSveWstPq7u/8+fHPgOxhRSwnZEpByv56uOhmmtWT6eaT8Fsd1uc2n7fiQ1oc18Ys4suMIoNaWvr5bU5d0MKU9d7FUW4oTZ56Go2e8BUv0Q6WfzyEek1ep6cj57TjMPQwnFk7CUmsZDsChaEs6oZlm49IPiYN8ZOEYed4scw7q6my82bi0WY/NFYSI9kRNczKn156F2K9Dy+dh6yaCSJ3A0bCxvBG3rr8VB+57AI7vPR776rPhWBJqSQhHNxoD0CU/a1JZ5lTp6AR4sTIoBd4kjmk/PF3ZvBBIvajCLO2Oczir53ws7D4JsWZigT4jrULbnUKjag0THFc4Gdcffqj8amIWGgtlqGwOAh+2IduWTnx+ey/mts7HsyPPIC+9fhDp6JGqmIj2PE0TlD1Gd1q1maaezrLxa/XG55DFBJuDjbjmhWuxrroRFy/4IOZJU52Gmhra0/hBnpPOc0SSq2B7NYQrT5+FDoyZIdpiE54VINBq8rgQdlTCoUlrunxaIN/j9jAiX8LUUUv12iigFYuq7ZCsRpSLUJXn5mM1WChJTxRp6cwgE225dgleachDtR86ZrKiJNojNU3rfXT+cBSlmvTDAKH6LFK10YEBW6pH3QiwyluJu9bdgf76jjPLfpRWeeWwlo6xVFMcG59bVtAad6WLWEReiLrppVWnqYXymo78WEJimI0LgavRRWYgkdeCFltdQMKWZxtShCbQnRBWXlp7qUQ9NCpXS/ZFrZCuds1Qa13W1BUdTRgqKOV/RxeP3K3HkIimRtME5Vmdb0UpV0StWoXvRSjmWmGpSx966uSNJOcC6XjNIehunIZWkhgSijqGwrJ0wr6aoIPIRvq55T7OHMSxjZGREYm4xmUcDF+tiO5INSkBqopQQ/p0czRdQagQyf11qSSjHEryPEtdSMyQ/loblO1HaA/0xkXMJA0raml0Ndbdm8DI2LD8rKZa6rA0C2d3nLk7DyERTZGmab1bzVYcpB2Kbc5Q+nulMpLeJmookCrhBkIc33IaDqzNB3JjuMn6L1y3/jt4aWArDug8BIvi2TihdTHaHBerrC1wJ2pYsfhuvAsXpdVe2kdL1ahWYVMFYi3Myd056DumQ2q2m/6zofKwMX28I50qbjq/vpJjHaNyuBx0pi3+I+Vn0O88L1XvJEJtP5zcuh+KxqtfLoKI3tiaJiiV87vOxU9H73v1P0piGbMT3IeVePyRJ3Bz34+xoX0zksBHNFTFzzpcfGttiO72LvRV+2EXc5gx/CssK52O/Y0SxnOqsgwQV2IUtQJyajW09OROkC5oYcR5deocSVpuqlXNVbudNE4WqW/NRclLs1ZafQ+/2L4SL878L1XvJEJtP5zcuh+KxqtfLoKI3tiaJiiV87vOxU9H73v1P0piGbMT3IeVePyRJ3Bz34+xoX0zksBHNFTFzzpcfGttiO72LvRV+2EXc5gx/CssK52O/Y0SxnOqsgwQV2IUtQJyajW09OROkC5oYcR5deocSVpuqlXNVbudNE4WqW/NRclLs1ZafQ+/2L4SL878L1XvJEJtP5zcuh+KxqtfLoKI3tiaJiiV87vOxU9H73v1P0piGbMT3IeVePyRJ3Bz34+xoX0zksBHNFTFzzpcfGttiO72LvRV+2EXc5gx/CssK52O/Y0SxnOqsgwQV2IUtQJyajW09OROkC5oYcR5deocSVpuqlXNVbudNE4WqW/NRclLs1ZafQ+/2L4SL878L1XvJEJtP5zcuh+KxqtfLoKI3tiaJiiV87vOxU9H73v1P0piGbMT3IeVePyRJ3Bz34+xoX0zksBHNFTFzzpcfGttiO72LvRV+2EXc5gx/CssK52O/Y0SxnOqsgwQV2IUtQJyajW09OROkC5oYcR5deocSVpuqlXNVbudNE4WqW/NRclLs1ZafQ+/2L4SL878L1XvJEJtP5zcuh+KxqtfLoKI3tiaJiiV87vOxU9H73v1P0piGbMT3IeVePyRJ3Bz34+xoX0zksBHNFTFzzpcfGttiO72LvRV+2EXc5gx/CssK52O/Y0SxnOqsgwQV2IUtQJyajW09OROkC5oYcR5deocSVpuqlXNVbudNE4WqW/NRclLs1ZafQ+/2L4SL878L1XvJEJtP5zcuh+KxqtfLoKI3tiaJiiV87vOxU9H73v1P0piGbMT3IeVePyRJ3Bz34+xoX0zksBHNFTFzzpcfGttiO72LvRV+2EXc5gx/CssK52O/Y0SxnOqsgwQV2IUtQJyajW09OROkC5oYcR5deocSVpuqlXNVbudNE4WqW/NRclLs1ZafQ+/2L4SL878L1XvJEJtP5zcuh+KxqtfLoKI3tiaJiiV87vOxU9H73v1P0piGbMT3IeVePyRJ3Bz34+xoX0zksBHNFTFzzpcfGttiO72LvRV+2EXc5gx/CssK52O/Y0SxnOqsgwQV2IUtQJyajW09OROkC5oYcR5deocSVpuqlXNVbudNE4WqW/NRclLs1ZafQ+/2L4SL878L1XvJEJtP5zcuh+KxqtfLoKI3tiaJiiV87vOxU9H73v1P0piGbMT3IeVePyRJ3Bz34+xoX0zksBHNFTFzzpcfGttiO72LvRV+2EXc5gx/CssK52O/Y0SxnOqsgwQV2IUtQJyajW09OROkC5oYcR5deocSVpuqlXNVbudNE4WqW/NRclLs1ZafQ+/2L4SL878L1XvJEJtP5zcuh+KxqtfLoKI3tiaJiiV87vOxU9H73v1P0piGbMT3IeVePyRJ3Bz34+xoX0zksBHNFTFzzpcfGttiO72LvRV+2EXc5gx/CssK52O/Y0SxnOqsgwQV2IUtQJyajW09OROkC5oYcR5deocSVpuqlXNVbudNE4WqW/NRclLs1ZafQ+/2L4SL878L1XvJEJtP5zcuh+KxqtfLoKI3tiaJiiV87vOxU9H73v1P0piGbMT3IeVePyRJ3Bz34+xoX0zksBHNFTFzzpcfGttiO72LvRV+2EXc5gx/CssK52O/Y0SxnOqsgwQV2IUtQJyajW09OROkC5oYcR5deocSVpuqlXNVbudNE4WqW/NRclLs1ZafQ+/2L4SL878L1XvJEJtP5zcuh+KxqtfLoKI3tiaJiiV87vOxU9H73v1P0piGbMT3IeVePyRJ3Bz34+xoX0zksBHNFTFzzpcfGttiO72LvRV+2EXc5gx/CssK52O/Y0SxnOqsgwQV2IUtQJyajW09OROkC5oYcR5deocSVpuqlXNVbudNE4WqW/NRclLs1ZafQ+/2L4SL878L1XvJEJtP5zcuh+KxqtfLoKI3tiaJiiV87vOxU9H73v1P0piGbMT3IeVePyRJ3Bz34+xoX0zksBHNFTFzzpcfGttiO72LvRV+2EXc5gx/CssK52O/Y0SxnOqsgwQV2IUtQJyajW09OROkC5oYcR5deocSVpuqlXNVbudNE4WqW/NRclLs1ZafQ+/2L4SL878L1XvJEJtP5zcuh+KxqtfLoKI3tiaJiiV87vOxU9H73v1P0piGbMT3IeVePyRJ3Bz34+xoX0zksBHNFTFzzpcfGttiO72LvRV+2EXc5gx/CssK52O/Y0SxnOqsgwQV2IUtQJyajW09OROkC5oYcR5deocSVpuqlXNVbudNE4WqW/NRclLs1ZafQ+/2L4SL878L1XvJEJtP5zcuh+KxqtfLoKI3tiaJiiV87vOxU9H73v1P0piGbMT3IeVePyRJ3Bz34+xoX0zksBHNFTFzzpcfGttiO72LvRV+2EXc5gx/CssK52O/Y0SxnOqsgwQV2IUtQJyajW09OROkC5oYcR5deocSVpuqlXNVbudNE4WqW/NRclLs1ZafQ+/2L4SL878L1XvJEJtP5zcuh+KxqtfLoKI3tiaJiiV87vOxU9H73v1P0piGbMT3IeVePyRJ3Bz34+xoX0zksBHNFTFzzpcfGttiO72LvRV+2EXc5gx/CssK52O/Y0SxnOqsgwQV2IUtQJyajW09OROkC5oYcR5deocSVpuqlXNVbudNE4WqW/NRclLs1ZafQ+/2L4SL878L1XvJEJtP5zcuh+KxqtfLoKI3tiaJiiV87vOxU9H73v1P0piGbMT3IeVePyRJ3Bz34+xoX0zksBHNFTFzzpcfGttiO72LvRV+2EXc5gx/CssK52O/Y0SxnOqsgwQV2IUtQJyajW09OROkC5oYcR5deocSVpuqlXNVbudNE4WqW/NRclLs1ZafQ+/2L4SL878L1XvJEJtP5zcuh+KxqtfLoKI3tiaJiiV87vOxU9H73v1P0piGbMT3IeVePyRJ3Bz34+xoX0zksBHNFTFzzpcfGttiO72LvRV+2EXc5gx/CssK52O/Y0SxnOqsgwQV2IUtQJyajW09OROkC5oYcR5deocSVpuqlXNVbudNE4WqW/NRclLs1ZafQ+/2L4SL878L1XvJEJtP5zcuh+KxqtfLoKI3tiaJiiV87vOxU9H73v1P0piGbMT3IeVePyRJ3Bz34+xoX0zksBHNFTFzzpcfGttiO72LvRV+2EXc5gx/CssK52O/Y0SxnOqsgwQV2IUtQJyajW09OROkC5oYcR5deocSVpuqlXNVbudNE4WqW/NRclLs1ZafQ+/2L4SL878L1XvJEJtP5zcuh+KxqtfLoKI3tiaJiiV87vOxU9H73v1P0piGbMT3IeVePyRJ3Bz34+xoX0zksBHNFTFzzpcfGttiO72LvRV+2EXc5gx/CssK52O/Y0SxnOqsgwQV2IUtQJyajW09OROkC5oYcR5deocSVpuqlXNVbudNE4WqW/NRclLs1ZafQ+/2L4SL878L1XvJEJtP5zcuh+KxqtfLoKI3tiaJiiV87vOxU9H73v1P0piGbMT3IeVePyRJ3Bz34+xoX0zksBHNFTFzzpcfGttiO72LvRV+2EXc5gx/CssK52O/Y0SxnOqsgwQV2IUtQJyajW09OROkC5oYcR5deocSVpuqlXNVbudNE4WqW/NRclLs1ZafQ+/2L4SL878L1XvJEJtP5zcuh+KxqtfLoKI3tiaJiiV87vOxU9H73v1P0piGbMT3IeVePyRJ3Bz34+xoX0zksBHNFTFzzpcfGttiO72LvRV+2EXc5gx/CssK52O/Y0SxnOqsgwQV2IUtQJyajW09OROkC5oYcR5deocSVpuqlXNVbudNE4WqW/NRclLs1ZafQ+/2L4SL878L1XvJEJtP5zcuh+KxqtfLoKI3tiaJiiV87vOxU9H73v1P0piGbMT3IeVePyRJ3Bz34+xoX0zksBHNFTFzzpcfGttiO72LvRV+2EXc5gx/CssK52O/Y0SxnOqsgwQV2IUtQJyajW09OROkC5oYcR5deocSVpuqlXNVbudNE4WqW/NRclLs1ZafQ+/2L4SL878L1XvJEJtP5zcuh+KxqtfLoKI3tiaJiiV87vOxU9H73v1P0piGbMT3IeVePyRJ3Bz34+xoX0zksBHNFTFzzpcfGttiO72LvRV+2EXc5gx/CssK52O/Y0SxnOqsgwQV2IUtQJyajW09OROkC5oYcR5deocSVpuqlXNVbudNE4WqW/NRclLs1ZafQ+/2L4SL878L1XvJEJtP5zcuh+KxqtfLoKI3tiaJiiV87vOxU9H73v1P0piGbMT3IeVePyRJ3Bz34+xoX0zksBHNFTFzzpcfGttiO72LvRV+2EXc5gx/CssK52O/Y0SxnOqsgwQV2IUtQJyajW09OROkC5oYcR5deocSVpuqlXNVbudNE4WqW/NRclLs1ZafQ+/2L4SL878L1XvJEJtP5zcuh+KxqtfLoKI3tiaJiiV87vOxU9H73v1P0piGbMT3IeVePyRJ3Bz34+xoX0zksBHNFTFzzpcfGttiO72LvRV+2EXc5gx/CssK52O/Y0SxnOqsgwQV2IUtQJyajW09OROkC5oYcR5deocSVpuqlXNVbudNE4WqW/NRclLs1ZafQ+/2L4SL878L1XvJEJtP5zcuh+KxqtfLoKI3tiaJiiV87vOxU9H73v1P0piGbMT3IeVePyRJ3Bz34+xoX0zksBHNFTFzzpcfGttiO72LvRV+2EXc5gx/CssK52O/Y0SxnOqsgwQV2IUtQJyajW09OROkC5oYcR5deocSVpuqlXNVbudNE4WqW/NRclLs1ZafQ+/2L4SL878L1XvJEJtP5zcuh+KxqtfLoKI3tiaJiiV87vOxU9H73v1P0piGbMT3IeVePyRJ3Bz34+xoX0zksBHNFTFzzpcfGttiO72LvRV+2EXc5gx/CssK52O/Y0SxnOqsgwQV2IUtQJyajW09OROkC5oYcR5deocSVpuqlXNVbudNE4WqW/NRclLs1ZafQ+/2L4SL878L1XvJEJtP5zcuh+KxqtfLoKI3tiaJiiV87vOxU9H73v1P0piGbMT3IeVePyRJ3Bz34+xoX0zksBHNFTFzzpcfGttiO72LvRV+2EXc5gx/CssK52O/Y0SxnOqsgwQV2IUtQJyajW09OROkC5oYcR5deocSVpuqlXNVbudNE4WqW/NRclLs1ZafQ+/2L4SL878L1XvJEJtP5zcuh+KxqtfLoKI3tiaJiiV87vOxU9H73v1P0piGbMT3IeVePyRJ3Bz34+xoX0zksBHNFTFzzpcfGttiO72LvRV+2EXc5gx/CssK52O/Y0SxnOqsgwQV2IUtQJyajW09OROkC5oYcR5deocSVpuqlXNVbudNE4WqW/NRclLs1ZafQ+/2L4SL878L1XvJEJtP5zcuh+KxqtfLoKI3tiaJiiV87vOxU9H73v1P0piGbMT3IeVePyRJ3Bz34+xoX0zksBHNFTFzzpcfGttiO72LvRV+2EXc5gx/CssK52O/Y0SxnOqsgwQV2IUtQJyajW09OROkC5oYcR5deocSVpuqlXNVbudNE4WqW/NRclLs1ZafQ+/2L4SL878L1XvJEJtP5zcuh+KxqtfLoKI3tiaJiiV87vOxU9H73v1P0piGbMT3IeVePyRJ3Bz34+xoX0zksBHNFTFzzpcfGttiO72LvRV+2EXc5gx/CssK52O/Y0SxnOqsgwQV2IUtQJyajW09OROkC5oYcR5deocSVpuqlXNVbudNE4WqW/NRclLs1ZafQ+/2L4SL878L1XvJEJtP5zcuh+KxqtfLoKI3tiaJiiV87vOxU9H73v1P0piGbMT3IeVePyRJ3Bz34+xoX0zksBHNFTFzzpcfGttiO72LvRV+2EXc5gx/CssK52O/Y0SxnOqsgwQV2IUtQJyajW09OROkC5oYcR5deocSVpuqlXNVbudNE4WqW/NRclLs1ZafQ+/2L4SL878L1XvJEJtP5zcuh+KxqtfLoKI3tiaJiiV87vOxU9H73v1P0pi%0A

CanvasContext.clearRect(number x, number y, number width, number height)

CanvasContext 是旧版的接口,新版 Canvas 2D 接口与 Web 一致

从基础库 2.9.0 开始,本接口停止维护,请使用 RenderingContext 代替

微信小程序插件:支持

相关文档: 旧版画布迁移指南、canvas 组件介绍

功能描述

清除画布上在该矩形区域内的内容

参数

number x

矩形路径左上角的横坐标

number y

矩形路径左上角的纵坐标

number width

矩形路径的宽度

number height

矩形路径的高度

示例代码

clearRect 并不是在指定区域画一个白色的矩形,而是清空该区域。为了有直观感受,这里给 canvas 加了一层背景色。

<canvas canvas-id="myCanvas" style="border: 1px solid; background: #123456;"/>
const ctx = wx.createCanvasContext('myCanvas')
ctx.setFillStyle('red')
ctx.fillRect(0, 0, 150, 200)
ctx.setFillStyle('blue')
ctx.fillRect(150, 0, 150, 200)
ctx.clearRect(10, 10, 150, 75)
ctx.draw()

<img alt="" src="https://developers.weixin.qq.com/data:image/png;base64,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%0A%0A“>

CanvasContext.bezierCurveTo 方法

CanvasContext 是旧版的接口,新版 Canvas 2D 接口与 Web 一致

从基础库 2.9.0 开始,本接口停止维护,请使用 RenderingContext 代替

微信小程序插件:支持

相关文档: 旧版画布迁移指南、canvas 组件介绍

功能描述

创建三次方贝塞尔曲线路径。曲线的起始点为路径中前一个点。

参数

number cp1x

第一个贝塞尔控制点的 x 坐标

number cp1y

第一个贝塞尔控制点的 y 坐标

number cp2x

第二个贝塞尔控制点的 x 坐标

number cp2y

第二个贝塞尔控制点的 y 坐标

number x

结束点的 x 坐标

number y

结束点的 y 坐标

示例代码

const ctx = wx.createCanvasContext('myCanvas')

// Draw points
ctx.beginPath()
ctx.arc(20, 20, 2, 0, 2 * Math.PI)
ctx.setFillStyle('red')
ctx.fill()

ctx.beginPath()
ctx.arc(200, 20, 2, 0, 2 * Math.PI)
ctx.setFillStyle('lightgreen')
ctx.fill()

ctx.beginPath()
ctx.arc(20, 100, 2, 0, 2 * Math.PI)
ctx.arc(200, 100, 2, 0, 2 * Math.PI)
ctx.setFillStyle('blue')
ctx.fill()

ctx.setFillStyle('black')
ctx.setFontSize(12)

// Draw guides
ctx.beginPath()
ctx.moveTo(20, 20)
ctx.lineTo(20, 100)
ctx.lineTo(150, 75)

ctx.moveTo(200, 20)
ctx.lineTo(200, 100)
ctx.lineTo(70, 75)
ctx.setStrokeStyle('#AAAAAA')
ctx.stroke()

// Draw quadratic curve
ctx.beginPath()
ctx.moveTo(20, 20)
ctx.bezierCurveTo(20, 100, 200, 100, 200, 20)
ctx.setStrokeStyle('black')
ctx.stroke()

ctx.draw()

针对 moveTo(20, 20) bezierCurveTo(20, 100, 200, 100, 200, 20) 的三个关键坐标如下:

  • 红色:起始点(20, 20)
  • 蓝色:两个控制点(20, 100) (200, 100)
  • 绿色:终止点(200, 20)

CanvasContext.beginPath()

CanvasContext 是旧版的接口,新版 Canvas 2D 接口与 Web 一致

从基础库 2.9.0 开始,本接口停止维护,请使用 RenderingContext 代替

微信小程序插件:支持

相关文档: 旧版画布迁移指南、canvas 组件介绍

功能描述

开始创建一个路径。需要调用 fill 或者 stroke 才会使用路径进行填充或描边

  • 在最开始的时候相当于调用了一次 beginPath。
  • 同一个路径内的多次 setFillStyle、setStrokeStyle、setLineWidth等设置,以最后一次设置为准。

示例代码

const ctx = wx.createCanvasContext('myCanvas')
// begin path
ctx.rect(10, 10, 100, 30)
ctx.setFillStyle('yellow')
ctx.fill()

// begin another path
ctx.beginPath()
ctx.rect(10, 40, 100, 30)

// only fill this rect, not in current path
ctx.setFillStyle('blue')
ctx.fillRect(10, 70, 100, 30)

ctx.rect(10, 100, 100, 30)

// it will fill current path
ctx.setFillStyle('red')
ctx.fill()
ctx.draw()