SVG:曲線の表現 |
作成日:2001-01-21 最終更新日: |
SVG で規定されている曲線は次の 3 種類のみである。
だから任意の曲線を描くには、曲線上の点を密にとって直線近似をするか、 最初の 3 種類の曲線で近似するしかない。 下の図は、緑色が 2 次のベジエ曲線(放物線)である。 橙色は、制御点から通過点に引いた線で、これは通過点における接線になっていることに注意する(もともとそのようにベジエ曲線が作られている)。
なお、SVG での曲線として制御点(x1, y1)を利用して(x, y)まで3Dスプライン曲線または2Dスプライン曲線を作成できる、 としているページがある。たとえば、 SVGの基本演習(www.envinfo.uee.kyoto-u.ac.jp) などである。 しかし、SVG で作成できるのは 3D ベジエ曲線それから2Dベジエ曲線のみである。狭い意味でのスプライン曲線、 すなわち制御点をすべて通るタイプの曲線は SVG では描けない。
なお、放物線が2次のベジエ曲線と同じであることはつい最近知った。これを利用して、 巨人の星の物理学にある軌跡の図を書くことができた。 また、3 次のベジエ曲線で放物線を作る方法もある。これについては、 池田洋介さんの イラストレーターで正確な放物線を作図する方法(iky.no-ip.org)を参照のこと。
SVG での書き方がわからない直線がある。
たとえば、サインカーブ、つまり正弦曲線がある。当然、多項式近似しかできないので、書けない。 `sin x` を `x = 0` のまわりでテイラー展開して 3 次の項までとれば、`sin x ~= x - (x^3)/6` の結果は得られるが、 だからといってこれを使ってきれいなサインカーブが書けるかというと、書けない。コサインであっても位相がずれるだけである。 どこまで近似できるかはわからない。
また、指数関数、対数関数も不可能である。
双曲線も描画できない。同じ円錐曲線ではあるのに、楕円や放物線ができて双曲線ができないのは不公平な気がするが、 仕方がない。
数式の記述と表現は ASCIIMathML を用いている。
まりんきょ学問所 > コンピュータの部屋 > マーク付け言語手習い > SVG: 曲線の表現