Calculadora da Curva de Bézier Cúbica (Ponto e Tangente em t)
O ponto de uma curva de Bézier cúbica para qualquer t entre 0 e 1, com a velocidade e a direção da tangente nesse ponto, a partir dos quatro pontos de controlo.
Resultados
A linha tracejada marca o valor que escreveu.
O que faz esta ferramenta
Uma curva de Bézier cúbica parte de P0 em direção a P1, chega a P3 vinda de P2 e nunca precisa de tocar nos dois pontos do meio — eles só puxam a curva para si. A mesma curva de quatro pontos desenha caminhos SVG, contornos de letras e o easing cubic-bezier() do CSS, onde P0 = (0, 0) e P3 = (1, 1). Passos iguais em t não são passos iguais ao longo da curva: a velocidade mostra onde a curva é percorrida depressa e onde demora.
Fórmula
B(t) = (1−t)³ P0 + 3(1−t)² t P1 + 3(1−t) t² P2 + t³ P3 · B′(t) = 3(1−t)² (P1−P0) + 6(1−t) t (P2−P1) + 3 t² (P3−P2)
Variáveis
| Símbolo | Significado | Unidade |
|---|---|---|
x0 | Ponto inicial P0, x | — |
y0 | Ponto inicial P0, y | — |
x1 | Ponto de controlo P1, x | — |
y1 | Ponto de controlo P1, y | — |
x2 | Ponto de controlo P2, x | — |
y2 | Ponto de controlo P2, y | — |
x3 | Ponto final P3, x | — |
y3 | Ponto final P3, y | — |
t | Parâmetro t (0 = início, 1 = fim) | — |
X | Ponto da curva, x | — |
Y | Ponto da curva, y | — |
V | Velocidade ao longo da curva (|dP/dt|) | — |
A | Direção da tangente | ° |
Exemplo resolvido
- Ponto inicial P0, x0
- Ponto inicial P0, y0
- Ponto de controlo P1, x25
- Ponto de controlo P1, y100
- Ponto de controlo P2, x75
- Ponto de controlo P2, y100
- Ponto final P3, x100
- Ponto final P3, y0
- Parâmetro t (0 = início, 1 = fim)0,5
- Ponto da curva, x50,0000
- Ponto da curva, y75,0000
- Velocidade ao longo da curva (|dP/dt|)112,5000
- Direção da tangente0,00 °
Limitações
- Misturar unidades é a causa de erro mais comum. Converta todos os valores para as unidades indicadas ao lado de cada campo antes de calcular.
- O cálculo é feito com precisão total e apenas a apresentação é arredondada. Se copiar um valor intermédio e voltar a escrevê-lo, podem surgir pequenas diferenças.