Curves & interpolation · 1 / 10

Cubic Hermite Curve

両端の位置と接線で曲がる軌道を指定する。

Compare in motion

Interactive demo

曲がるレーザー

Synchronized comparison

AReference

始点と終点を直線で結ぶ

BCubic Hermite Curve100%

出入りの方向を決めた軌道になる

Loading demo…

Speed

Time1.20 / 8.00 sB · effect amount100%

Scrub to pause and inspect. At 0%, B matches A; at 100%, B shows the effect. The scene repeats every 8 seconds.

Look for: 両端の接線に沿って曲がる → 終点へ指定の向きで届く。

A small visual example of a game use case. Games combine these techniques with assets and other effects.

Read the storyboard

例: 曲がるレーザー

1. Start
始点から出る
2. Change
両端の接線に沿って曲がる
3. Result
終点へ指定の向きで届く

出入りの方向を決めた軌道になる。時間変化を示す模式図です。実際の描画結果や処理速度を再現したものではありません。

How it works

1. Input
両端の位置と接線
2. Process
三次式で補間
3. Result
指定接線で出入りする曲線

A schematic of Cubic Hermite Curve. It shows the relationship between input, process, and result; exact values and rendering depend on the implementation.

Compare in motion

曲がるレーザー

How it works

Further reading