クリッカブルマップというのは,こんなの. 今回はクリッカブルという名のもとでクリック機能に対応していないのだが,便宜上クリッカブルマップと呼ぶ. 実際,クリック対応も数行追加するだけで楽々と対応できる. 用意するもの SVG吐き出せるソフト(今回はInkscape) jQuery だけ. マップ画像の作成 inkscapeを使い,適当に日本地図を書く. そして,inkscapeのXMLエディタを開き,各地域,都道府県などにidを追加する. あとは,PlainSVGとして書き出すだけ.(今回はjapan-map.svgとして書き出した) jQueryプラグインを書く jquery.svg-japan-map.js (function($) { $.fn.svgJapanMap = function(options) { function composeIdName(prefix, name,
![jQueryとSVGでクリッカブルマップ - MJHD](https://cdn-ak-scissors.b.st-hatena.com/image/square/9f69713977c420d5feaed73b43fa71aca7c8cce4/height=288;version=1;width=512/http%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fw%2Fwait0000%2F20160104%2F20160104214251.png)