Curves & interpolation · 3 / 10

Catmull–Rom Spline

指定点を通る滑らかな経路を作る。

Compare in motion

Interactive demo

カメラの経路

Synchronized comparison

AReference

通過点を折れ線で結ぶ

BCatmull–Rom Spline100%

指定点を通るカメラワークになる

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 Catmull–Rom Spline. 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