Skip to content

Commit

Permalink
[zh-cn]: update the translation of `CanvasRenderingContext2D.moveTo()…
Browse files Browse the repository at this point in the history
…` method (#22012)

Co-authored-by: A1lo <[email protected]>
  • Loading branch information
tianyeeT and yin1999 authored Jul 30, 2024
1 parent 6d4fef3 commit 3b5fd0d
Showing 1 changed file with 17 additions and 11 deletions.
28 changes: 17 additions & 11 deletions files/zh-cn/web/api/canvasrenderingcontext2d/moveto/index.md
Original file line number Diff line number Diff line change
@@ -1,30 +1,36 @@
---
title: CanvasRenderingContext2D.moveTo()
title: CanvasRenderingContext2DmoveTo() 方法
slug: Web/API/CanvasRenderingContext2D/moveTo
l10n:
sourceCommit: 1f216a70d94c3901c5767e6108a29daa48edc070
---

{{APIRef}}

**`CanvasRenderingContext2D.moveTo()`** 是 Canvas 2D API 将一个新的子路径的起始点移动到 (x,y) 坐标的方法
Canvas 2D API 的 **`CanvasRenderingContext2D.moveTo()`** 方法用于在给定的 `(x,y)` 坐标处开始一个新的子路径

## 语法

```
void ctx.moveTo(x, y);
```js-nolint
moveTo(x, y)
```

### 参数

- `x`
- : 点的 x 轴。
- : 点的 x 轴(横)坐标
- `y`
- : 点的 y 轴。
- : 点的 y 轴(纵)坐标。

### 返回值

无({{jsxref("undefined")}})。

## 示例

### 绘制多条子路径

这是一段使用 `moveTo` 方法的简单的代码片段,移动画笔到起始点绘制一条线
此示例使用 `moveTo()` 方法在单个路径中创建了两条子路径。然后,这两条子路径通过单个 `stroke()` 方法调用进行渲染

```html
<canvas id="canvas"></canvas>
Expand All @@ -39,16 +45,16 @@ const canvas = document.getElementById("canvas");
const ctx = canvas.getContext("2d");

ctx.beginPath();
ctx.moveTo(50, 50); // Begin first sub-path
ctx.moveTo(50, 50); // 开始第一条子路径
ctx.lineTo(200, 50);
ctx.moveTo(50, 90); // Begin second sub-path
ctx.moveTo(50, 90); // 开始第二条子路径
ctx.lineTo(280, 120);
ctx.stroke();
```

#### 结果

{{ EmbedLiveSample('绘制多条子路径-paths', 700, 180) }}
{{ EmbedLiveSample('绘制多条子路径', 700, 180) }}

## 规范

Expand All @@ -60,6 +66,6 @@ ctx.stroke();

## 参见

- 接口定义, {{domxref("CanvasRenderingContext2D")}}
- 定义此方法的接口:{{domxref("CanvasRenderingContext2D")}}
- {{domxref("CanvasRenderingContext2D.lineTo()")}}
- {{domxref("CanvasRenderingContext2D.stroke()")}}

0 comments on commit 3b5fd0d

Please sign in to comment.