Menu
×
   ❮     
HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY EXCEL XML DJANGO NUMPY PANDAS NODEJS R TYPESCRIPT ANGULAR GIT POSTGRESQL MONGODB ASP AI GO KOTLIN SASS VUE DSA GEN AI SCIPY AWS CYBERSECURITY DATA SCIENCE
     ❯   

Canvas moveTo() Method

❮ Canvas Reference

Example

Begin a path, move to position 0, 0. Create a line to position 300, 150:

YourbrowserdoesnotsupporttheHTML5canvastag.

JavaScript:

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

// Start a new Path
ctx.beginPath();
ctx.moveTo(0, 0);
ctx.lineTo(300, 150);

// Draw the Path
ctx.stroke();
Try it Yourself »

Description

The moveTo() method moves the path to a specified point without drawing a line.

See Also:

The beginPath() Method (Begin a new path)

The closePath() Method (Close current path)

The lineTo() Method (Add a line to the path)

The fill() Method (Fill current path)

The stroke() Method (Draw current path)


Syntax

context.moveTo(x, y)

Parameter Values

Param Description Play it
x The x-coordinate of where to move the path to Play it »
y The y-coordinate of where to move the path to Play it »

Return Value

NONE

Browser Support

The <canvas> element is an HTML5 standard (2014).

moveTo() is supported in all modern browsers:

Chrome Edge Firefox Safari Opera IE
Yes Yes Yes Yes Yes 9-11

❮ Canvas Reference