svgコードをsvgファイルにしてみよう
svgコードは簡単にsvgファイルにすることができます。
ということで以下のようなsvgコードを用意してみました。
3次ベジェ曲線(cコマンド)を使っているので、このコードを読んで描画内容を想像できる人はかなりの練達者でしょう。
常人には無理です。
htmlを知っている人なら、300×300のサイズで色はピンク、というのは何となく読み取れると思いますが、それ以上のことは難しいのではないでしょうか？
ということでsvgファイルにして確認してみましょう。
やり方は次の通りです。
- 怪しいコードが入っていないかチェックします。
- コードをコピーしてテキストエディタに貼り付けます。
- 拡張子をsvgにして保存します。
1の怪しいコードについて判断できず、コードの入手元が不明であったり信用できない場合は、素直に諦めましょう。
当サイトではsvgコード内にスクリプトの記述を行わないので悪い動作はしません。信じてくれるのでしたら2、3をやってみてください。
2と3が分からない場合、windowsでの手順は次の通りになります。
- メモ帳を起動し、上のコードをコピペします。
- 左上の「ファイル」をクリックし「名前を付けて保存(A)」をクリックします。
- 保存画面になりますのでファイル名を「任意のファイル名.svg」にします。
- 画面下部「文字コード(E):」で「UTF-8」を選びます(ここは任意です)。
- お好きな保存先を選んで保存します。
さて無事svgファイルは作成できましたでしょうか?
作成できたらillustratorとかinkscapeとかブラウザで開いてみましょう。
何が書いてあるか確認できると思います。
関係ないですが「この大きさでたったの176バイトなのか」とか「ブラウザを拡大表示にしてもジャギらない」とか思った人はきっとsvgが好きになると思います。