SVGはHTML5になって標準化された新しいメディアです。これまでのPNG、JPEG、GIFとは異なり、ベクターベースなので拡大しても綺麗で、かつHTMLの中に埋め込んだりJavaScriptから操作することもできます（画像も埋め込めますが、あれはBase64エンコードした結果です）。 そこでSVGをもっと手軽に使えるようにするのがSvidget.jsです。SVGのウィジェット化し、再利用性を高めるライブラリになります。

Svidget.jsの使い方

時計のウィジェットです。生成されるコードはそのまま自分のサイトに埋め込めるようになっています。

色を変更するのも簡単にできます。

グラフ。これもパラメータを動的に変更して自分の好きなグラフを描くことができます。

星の形。

クリックで回転します。こういったアクションも簡単に定義できます。

USの地図。これもアニメーション付きです。

アニメーションする星がたくさん描かれたデモ。

グラフもアニメーションしながら描かれます。

Svidget.jsは幾つかのデザインをテンプレートにしつつ、パラメータを変更して自由にオブジェクトを描くことができます。グラフであれば、一旦慣れてしまえば後は数値を変更するだけで自由に使いこなせるようになりそうです。今後もテンプレートは増えていくそうなので、SVG活用の幅が広がるのではないでしょうか。

Svidget.jsはHTML5/JavaScript製のオープンソース・ソフトウェア（MIT License）です。

A JavaScript framework for building fantastic SVG widgets - Svidget.js joeax/svidget