Path2D

Experimental: Esta é uma tecnologia experimental (en-US)
Verifique a tabela de compatibilidade entre Navegadores cuidadosamente antes de usar essa funcionalidade em produção.

A Path2D interface da API Canvas 2D é usada para declarar caminhos que são usados posteriormente em objetos CanvasRenderingContext2D. Os métodos de caminho da interface CanvasRenderingContext2D também estão presentes nessa interface e permitem criar caminhos que você pode reter e reproduzir conforme necessário em uma tela.

Construtores

Path2D() (en-US)

Path2D construtor. Cria um novo objeto Path2D.

Metodos

Path2D.addPath() (en-US)

Adiciona um caminho ao caminho atual.

Path2D.closePath()

Faz com que o ponto da caneta retorne ao início do sub-caminho atual. Ele tenta desenhar uma linha reta desde o ponto atual até o início. Se a forma já foi fechada ou tem apenas um ponto, essa função não faz nada.

Path2D.moveTo()

Move o ponto inicial de um novo subcaminho para as coordenadas (x, y).

Path2D.lineTo()

Conecta o último ponto no subcaminho às coordenadas x, y com uma linha reta.

Path2D.bezierCurveTo() (en-US)

Adiciona uma curva cúbica de Bézier ao caminho. Requer três pontos. Os dois primeiros pontos são pontos de controle e o terceiro é o ponto final. O ponto de partida é o último ponto no caminho atual, que pode ser alterado usando moveTo () antes de criar a curva Bézier.

Path2D.quadraticCurveTo()

Adiciona uma curva quadrática de Bézier ao caminho atual.

Path2D.arc()

Adiciona um arco ao caminho que é centralizado na posição (x, y) com raio r iniciando em startAngle e terminando em endAngle indo na direção dada no sentido anti-horário (padrão no sentido horário).

Path2D.arcTo()

Adiciona um arco ao caminho com os pontos de controle e raio dados, conectados ao ponto anterior por uma linha reta.

Path2D.ellipse() (en-US)

Adiciona uma elipse ao caminho que é centralizado na posição (x, y) com os raios radiusX e radiusY começando em startAngle e terminando em endAngle indo na direção determinada no sentido anti-horário (padrão no sentido horário).

Path2D.rect()

Cria um caminho para um retângulo na posição (x, y) com um tamanho determinado por width e height.

Especificações

Specification
HTML Standard
# path2d-objects

Compatibilidade com navegadores

BCD tables only load in the browser

Veja também