Método quadráticoCurveTo() da tela HTML
Exemplo
Desenhe uma curva Bézier quadrática:
JavaScript:
var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.beginPath();
ctx.moveTo(20, 20);
ctx.quadraticCurveTo(20, 100, 200, 20);
ctx.stroke();
Suporte ao navegador
Os números na tabela especificam a primeira versão do navegador que oferece suporte total ao método.
| Method | |||||
|---|---|---|---|---|---|
| quadraticCurveTo() | Yes | 9.0 | Yes | Yes | Yes |
Definição e uso
O método quadraticCurveTo() adiciona um ponto ao caminho atual usando os pontos de controle especificados que representam uma curva Bézier quadrática.
Uma curva quadrática de Bézier requer dois pontos. O primeiro ponto é um ponto de controle que é usado no cálculo quadrático de Bézier e o segundo ponto é o ponto final da curva. O ponto inicial para a curva é o último ponto no caminho atual. Se um caminho não existir, use os métodos beginPath() e moveTo() para definir um ponto de partida.
Ponto de partida:
moveTo( 20,20 )
Ponto de controlo:
quadráticaCurvePara ( 20.100 , 200.20)
Ponto final:
quadráticaCurveTo (20,100, 200,20 )
Dica: Confira o método bezierCurveTo() . Tem dois pontos de controle em vez de um.
| Sintaxe JavaScript: | context .quadraticCurveTo( cpx,cpy,x,y ); |
|---|
Valores de parâmetro
| Parameter | Description | Play it |
|---|---|---|
| cpx | The x-coordinate of the Bézier control point | |
| cpy | The y-coordinate of the Bézier control point | |
| x | The x-coordinate of the ending point | |
| y | The y-coordinate of the ending point |
❮ Referência de tela HTML