CanvasRenderingContext2D.lineTo()

CanvasRenderingContext2D.lineTo() 是 Canvas 2D API 使用直线连接子路径的终点到 x,y 坐标的方法(并不会真正地绘制)。

语法

void ctx.lineTo(x, y);

参数

x

直线终点的 x 轴坐标。

y

直线终点的 y 轴坐标。

示例

使用 lineTo 方法

这是一段使用 lineTo 方法的简单的代码片段。 使用 beginPath() 绘制路径的起始点,使用 moveTo()移动画笔,使用 stroke() 方法真正地画线。

HTML

<canvas id="canvas"></canvas>

JavaScript

var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");

ctx.beginPath();
ctx.moveTo(0,0);
ctx.lineTo(100, 100);
ctx.stroke();

修改下面的代码并在线查看 canvas 的变化:

规范描述

Specification
HTML Standard
# dom-context-2d-lineto-dev

浏览器兼容性

BCD tables only load in the browser

参见