見出し画像

SVG部(エスブイジーぶ) 事始(ことはじ)め

学校がっこうのクラブ活動かつどうのように、noteノート のコミュニティのなか SVGエスブイジー はじめようとおもいます。

というのは SVG というベクトル規格きかくはこれからどんどん使つかわれていくのではないか、SVG でもっと面白おもしろいことができるのではないか、とわたし以前いぜんからかんがえているからです。

みなさまが興味きょうみしめしてくれるかからないのですが、まずは一人ひとりでコツコツとやっていこうとおもいます。最初さいしょむのは SVG をプログラムで生成せいせいできるようにすることです。

わたしながあいだSmall Basicスモールベーシック という入門にゅうもんようのプログラミング言語げんご簡単かんたんくプログラムをたくさんいてきました。出来上できあがるのはプログラム画面がめんじょう画像がぞうです。画像がぞうはスクリーンショットをればラスター(ビットマップ)にすることができます。でもプログラムでは長方形ちょうほうけい楕円だえんなどをわせてえがいているので、本来ほんらいはベクトルにできるはずです。それで、Shapesシェイプス という SVG を出力しゅつりょくするプログラムもつくりました。

ただ、それだけではどうも満足まんぞくがいきません。SVG 自体じたい長方形ちょうほうけい楕円だえんなどをわせてベクトルとして表示ひょうじされるので Small Basic のプログラムと基本的きほんてきちかいのですが、たとえば Small Basic では乱数らんすう発生はっせいさせて花吹雪はなふぶきえがいたり、ロジックをんでうごかしたりすることができます。SVG でも簡単かんたんなアニメーションはつくれますが、制限せいげんがあります。

それで、事始ことはじめとして、JavaScriptジャバスクリプト で SVG を生成せいせいしてみることにしました。note とはべつ以前いぜんからいているブログで JavaScript の連載れんさいがあるので、まずはそこに「SVGを生成せいせい」という記事きじきました。しばらくはこの連載れんさいつづけていこうとかんがえています。


この記事が気に入ったらサポートをしてみませんか?