FC2ブログ

SVGについて

SVG

SVGは
scalable
vector
graphics
の略

SVGはHTML5の関連技術なので
HTML5の仕様には含まれない

canvasでもSVGでも
イラストや図形が描ける

canvasとSVGの違いを紹介

まず、canvas
こちらはピクセルの集まりで
グラフィックを表現

次にSVG
こちらは座標点の集まりで
グラフィックを表現
このため、毎回描画するときに計算するので
canvasより遅い


あと
canvasは
ピクセルごとにエフェクト処理できるけと
SVGでは
ピクセル単位のエフェクト処理はできない

まるでメリットなしみたいだけど
SVGにもメリットがあり
少ないデータでどのようなサイズでも
グラフィック描画ができるという利点がある

これは、canvasだと
画像を縮小したら画像が潰れたり
拡大したら、ピクセルが大きくなり
輪郭がブロックみたいなかんじになる
よくあるパソコンとかで、
ドット絵を拡大したような状態になるものを
描画したいときに

SVGなら
毎回サイズにあわせて計算するから
ベストな状態になるというのが
利点

あと、Canvasは描画するときに
Javascriptの制御が必要だけど

SVGは
XMLベースなので
HTML内に
svg要素を書いて図形を描画できる
スポンサーサイト



コメント

非公開コメント

最新記事
検索フォーム
GREEハコニワ攻略サイト
リンク
カテゴリ
月別アーカイブ
フリーエリア
最新記事
FXプライムレート
最新コメント
最新トラックバック