Canvasの諸々概念についてメモ

最近趣味でCanvasを使ったお絵描きにはまっている。とはいっても線を曲げたり円を描いたりするレベルの静的な描画だけど。絵は描きたくないけど絵を作りたいのでCodepenで悠々と遊んでいる。あまりCodepenに投稿されているのは大概アニメーション処理が入っているので、静的画像を描画するための参考にするには難しいけど、色々と刺激になります。

Canvasのリファレンスを読んでよくわからなかったのがPath（パス）の概念について。描画ツールではポピュラーな用語のようだけど、そういうのに疎い自分としてはPathがどういったものなのかイメージしづらかったので、諸々の。ついでにがてらメモ。

PathとはCanvasにおけるPathは描画を行うための情報（点座標・線色・背景色など）の集合体。 描画状態とは異なる。

Contextとは描画APIを利用するためのオブジェクト。

Pathは一つのContextに対して一つしか存在できない 。複数のPathから描画したい場合、

Pathの作成・描画
↓
Pathのリセット  
↓
新たなPathの作成・描画
↓
...繰り返し...

という流れで処理を行う必要がある。

Pathのリセットを行うためにはbeginPathを呼ぶ。

線や弧などの2つ以上の点を持ったパス情報の一種をSubpathと呼ぶ。例えば、(0, 0) (10, 10)で閉じたPathは(0, 0)から(10, 10)のsubPathを持っているの場合と同様の描画になる。 ただし、上記二つの情報自体は異なるので同一の情報ではない。値として「解が算出可能な式」を持っているような状態に近いような感覚だと思われる。

Path ∈ Subpath

closePathを呼ぶことで現在の開始パスと最終パスをつなげ、終点を新たな最終パスとして追加する。

三次曲線を使うようになると途端に面倒になってきた。Processingは動的なクリエイティブコーディングに適していると思うが静的でも問題ないんだろうか。そもそも絵を描くのにCanvasを利用するっていうのが時代錯誤的ではあるんだけど。静的な描画に適したプログラミング言語があれば教えて頂けると幸いです。