---
name: "createCanvasContext"
mode: "api"
versionRequirements:
  - { name: "基础库", version: "2.21.8" }
title: "ty.createCanvasContext - 创建 canvas 的绘图上下文 CanvasContext 对象"
---

## createCanvasContext

> [VERSION] 基础库 >= 2.21.8

> 💡 返回的 CanvasContext 通过 canvasId 跟一个 canvas 组件绑定，操作对应的 canvas 组件。

### 描述

创建 canvas 的绘图上下文 CanvasContext 对象

### 参数

`Params`

| 参数 | 类型 | 必填 | 描述 |
| --- | --- | --- | --- |
| `canvasId` | `string` | 是 | canvas 组件的 id |

### 返回值

类型: `CanvasContext`

CanvasContext 实例

### 示例代码

#### 创建画布上下文

```ts
Page({
  onReady() {
    const ctx = ty.createCanvasContext('myCanvas');
    ctx.setFillStyle('#ff0000');
    ctx.fillRect(10, 10, 150, 100);
    ctx.draw();
  },
});
```