CodeGrid 12th Event Site

SVGを活用したUIの基本

全1回

SVGは、拡大やドラッグ移動などを備えるやや特殊なUI実装で真価を発揮します。このシリーズでは、SVGのビューポート、移動や伸縮、座標の扱いに注目し、解説します。これらの機能を知ることでSVGならではのUI構築応用を身に着けることができます。

SVGの移動・拡大縮小に関するAPIを活用したUI

SVGは拡大しても劣化しない静的な画像ファイルですが、一方でSVGはマークアップ言語でもあり、DOMを構成するという特徴もあります。この特徴を活かし、拡大やドラッグ移動などの特殊なUIを実装してみましょう。