SVG panzoom - SVGのズームイン/アウト機能を提供
Web上でSVGが多く使われるようになってきました。SVGの利点の一つに挙げられるのが、ベクターなので拡大しても綺麗ということです。拡大や縮小するというのは、情報の粒度を自分で変更したいという時に便利です。 そこで紹介したいのがSVG panzoomです。その名の通り、SVGのズームイン/アウトを実現するためのライブラリです。
SVG panzoomの使い方
サンプルです。多くの情報が散りばめられています。
拡大しました。マウスでできます。
逆にパンしました。これでも綺麗な線で描かれるのがSVGの良さですね。
実際の動きです。
実際の使用例です。書籍同士の関連度を可視化しています。
SVGはJavaScriptと組み合わせたインタラクティブなコンテンツを作るのに向いています。また、ベクターなので軽量であり、それでいて高解像度にも対応できるなどモバイルなどにも向いています。こうしたライブラリが増えればより使われていくようになるでしょう。
SVG panzoomはHTML5/JavaScript製のオープンソース・ソフトウェア（MIT License）です。