Esta é uma tecnologia experimental
Verifique a tabela de compatibilidade entre Navegadores cuidadosamente antes de usar essa funcionalidade em produção.

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()
Path2D construtor. Cria um novo objeto Path2D.

Metodos

Path2D.addPath()
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()
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()
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 Status Comment
HTML Living Standard
The definition of 'Path2D' in that specification.
Padrão em tempo real  

Compatibilidade com o Navegador

FeatureChromeEdgeFirefoxInternet ExplorerOperaSafari
Basic support Yes Yes31 ? Yes10
Path2D() constructor Yes Yes131 ? Yes10
addPath Yes ?34 No Yes Yes
FeatureAndroid webviewChrome for AndroidEdge mobileFirefox for AndroidOpera AndroidiOS SafariSamsung Internet
Basic support Yes Yes ?31 Yes No Yes
Path2D() constructor No42 ?31 Yes No4.0
addPath Yes Yes ?34 Yes Yes Yes

1. The constructor for Path2D objects in Edge does not support being invoked with a string consisting of SVG path data. See issue 8438884 for details.

Veja também:

Etiquetas do documento e colaboradores

Colaboradores desta página: dayvitSiqueira
Última atualização por: dayvitSiqueira,