クリッカブルマップは、直訳すれば「クリック」できる「地図」で、一つの画像の中にいくつかの「領域」を定義して、それらをマウスなどでクリックして選択できるようにする物です。

　吉里吉里/KAGでは、本体の画像の他に「領域画像」と「領域アクション定義ファイル」という２つのファイルを使ってこれを実現します。

　領域画像は、本体の画像と同じサイズの 256 色の画像です。フルカラーの画像ではいけません。JPEG はこのような用途には向かないので、 PNG か BMP などの、256 色を使用できる画像形式を使います。

　領域画像とは、本体の画像の各領域に対応して、各領域を任意のパレットインデックスで塗りつぶした物です。たとえば、


　のようなものです。左が本体の画像で、この例では関東地方の地図です。右が、各都県に対応して各領域を塗りつぶした「領域画像」です。
　領域画像は、各領域を任意の ( それぞれ異なる ) パレットインデックスで塗りつぶした物です。上の例で各領域に書いてある数字はそのパレットインデックスです ( 説明のために入れてあるので本来は必要ありません )。パレットインデックス 0 ( 図では海 ) で塗りつぶされた領域は領域としては使われない部分です。

　グラフィック編集ソフトなどには 256 色の画像で「パレットインデックス」を扱える物がありますが、そのようなソフトを用いて編集する必要があります ( パレット番号とか、カラーインデックス、インデックスカラー、色番号など名称は異なる場合があります )。このとき、重要なのはパレットインデックス ( 色番号 ) であって、色ではありません。吉里吉里は領域画像を見るとき、色ではなくてそのパレットインデックスのみを見ます。色は、編集時に他の領域と見分けが付きやすいように、適当にばらけた色をつけておいてかまいません。

　領域画像のファイル名は、通常、本体の画像のファイル名 ( 拡張子を除く ) に _p をつけたファイル名です。たとえば、本体の画像の名前が map.png であれば、領域画像のファイル名は ( PNGで保存する場合 ) map_p.png にします。

　領域アクション定義ファイルとは、クリッカブルマップの各領域の振る舞いを定義したファイルです。
　拡張子は .ma で、通常は本体の画像ファイルと同じファイル名にします。たとえば、本体の画像の名前が map.png であれば、領域アクション定義ファイルのファイル名は map.ma にします。

　領域アクション定義ファイルはテキストファイルですのでテキストエディタで編集します。

　領域アクション定義ファイルは、一行ごとに、「領域番号 ： アクション」を領域の数だけ書いた物です ( コロンは半角 )。
　たとえば、上記の地図の例だと、

11: hint="埼玉"; storage="maptest2.ks"; target="*m11";
8: hint="群馬"; storage="maptest2.ks"; target="*m8";
7: hint="栃木"; storage="maptest2.ks"; target="*m7";
9: hint="茨城"; storage="maptest2.ks"; target="*m9";
10: hint="千葉"; storage="maptest2.ks"; target="*m10";
12: hint="東京"; storage="maptest2.ks"; target="*m12";
2: hint="神奈川"; storage="maptest2.ks"; target="*m2";
3: hint="山梨"; storage="maptest2.ks"; target="*m3";
1: hint="静岡"; storage="maptest2.ks"; target="*m1";
4: hint="長野"; storage="maptest2.ks"; target="*m4";
5: hint="新潟"; storage="maptest2.ks"; target="*m5";
6: hint="福島"; storage="maptest2.ks"; target="*m6";

　のような記述になります。領域番号と、上の例の領域画像のパレットインデックスは一致しています。
　「アクション」 ( コロンより後の部分 ) は KAG の文法からは離れ、TJS の文法で書きますが、難しい物ではありません。
　「名前=値;」の形式で必要なだけ書くというものです。セミコロンを忘れないようにしてください。

　使用できる名前には以下の物があります。

storage, target, onenter, onleave, hint, exp, countpage

    　これらはすべて link タグと同様の機能を持っていますが、すべて、属性の値を " " ( ダブルクオーテーション ) で囲んで指定してください ( 上記の例のように )。" " で囲まないとエラーになったり、正常に動作しなかったりします。

cursor

    　領域の上にマウスカーソルがある場合のマウスカーソル形状を指定します。cursor タグでの指定に似ていますが、 cr で始まるマウスカーソル定数を用いる場合は、& をつけずにそのまま書きます ( たとえば cursor = crSizeAll; )。マウスカーソルのファイルを指定する場合は " " ( ダブルクオーテーション ) で囲んで書きます ( たとえば cursor = "wagtail.ani"; )。

　領域アクション定義ファイルでは、領域番号 0 は特別な指定をするために使用されます。現バージョンでは autodisable が使用可能です。たとえば、
0 : autodisable=false;
　とすると、クリッカブルマップをクリックしても、クリッカブルマップが無効な ( クリッカブルマップとして操作できない ) 状態になりません。通常はこの指定を行わなくて OK です。
　この指定を行わなかったり、領域アクション定義ファイルに領域番号 0 の指定がなかったりすると、クリッカブルマップをクリックしたとき、再び image タグか mapaction タグで領域アクション定義ファイルが読み込まれるまで、クリッカブルマップは無効な ( クリッカブルマップとして操作できない ) 状態になります。

　クリッカブルマップを使ってみます。
　上記の例を、本体の画像を map1.png、領域画像を map1_p.png、領域アクション定義ファイルを map1.ma とします。
　image タグは、読み込もうとした本体ファイル名をもとにして、ファイル名に _p がついたファイルと、拡張子が ma のファイルを探して、それぞれ領域画像と領域アクション定義ファイルとして読み込みます。
　ですので、通常は、クリッカブルマップを使用可能にするためには image タグのみを使います。


　たとえば、maptest.ks に以下の内容を書いたとします。

*start
@image layer=0 page=fore visible=true storage=map1
@position left=400 width=220
@wt
クリッカブルマップのテスト。
@s

　これだけで、クリッカブルマップが使用可能な状態で s タグで停止します。




　クリッカブルマップがクリックされたときにジャンプするシナリオも記述しなければなりません。たとえば、maptest2.ks に以下のような内容を書きます。

*m11
@cm
そこは埼玉です。[l]
@jump storage="maptest.ks" target="*start"

*m8
@cm
そこは群馬です。[l]
@jump storage="maptest.ks" target="*start"

*m7
@cm
そこは栃木です。[l]
@jump storage="maptest.ks" target="*start"

*m9
@cm
そこは茨城です。[l]
@jump storage="maptest.ks" target="*start"

*m10
@cm
そこは千葉です。[l]
@jump storage="maptest.ks" target="*start"

*m12
@cm
そこは東京です。[l]
@jump storage="maptest.ks" target="*start"

*m2
@cm
そこは神奈川です。[l]
@jump storage="maptest.ks" target="*start"

*m3
@cm
そこは山梨です。[l]
@jump storage="maptest.ks" target="*start"

*m1
@cm
そこは静岡です。[l]
@jump storage="maptest.ks" target="*start"

*m4
@cm
そこは長野です。[l]
@jump storage="maptest.ks" target="*start"

*m5
@cm
そこは新潟です。[l]
@jump storage="maptest.ks" target="*start"

*m6
@cm
そこは福島です。[l]
@jump storage="maptest.ks" target="*start"