Метод arcTo() холста HTML

❮ Справочник по холсту HTML

Пример

Создайте дугу между двумя касательными на холсте:

Ваш браузер не поддерживает HTML5canvastag.

JavaScript:

var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.beginPath();
ctx.moveTo(20, 20);           // Create a starting point
ctx.lineTo(100, 20);          // Create a horizontal line
ctx.arcTo(150, 20, 150, 70, 50); // Create an arc
ctx.lineTo(150, 120);         // Continue with vertical line
ctx.stroke();                // Draw it

Поддержка браузера

Цифры в таблице указывают на первую версию браузера, полностью поддерживающую метод.

Method
arcTo() Yes 9.0 Yes Yes No

Определение и использование

Метод arcTo() создает дугу/кривую между двумя касательными на холсте.

Диаграмма canvas arcto()

Совет: используйте метод stroke() , чтобы на самом деле нарисовать дугу на холсте.

Синтаксис JavaScript: контекст .arcTo( x1,y1,x2,y2,r );

Значения параметров

Parameter Description Play it
x1 The x-coordinate of the first tangent
y1 The y-coordinate of the first tangent
x2 The x-coordinate of the second tangent
y2 The y-coordinate of the second tangent
r The radius of the arc

❮ Справочник по холсту HTML