京ぽんで Mapion PDA 地図をスクロールさせるブックマークレット



パソコンやPDAで地図をスクロールさせる一般的な方法として、”地図画像上の任意の点をクリックするとその点が中心となる様に地図画像がスクロールする”というUIがある事は大変良く知られています。


もちろん Mapion PDA 地図にもこの UI は有るのだけれど、我等が京ぽんにはマウスが付属品として付いて来ませんでした。


そこで部屋の片隅でホコリを被っていたマウスを引っ張り出して来て。。。。。じゃなくて。


この地図画像スクロールのUIと同じデータを地図サーバに送ってやれば地図をスクロールさせられるハズだろ!ってことで出来たのが↓のブックマークレット

javascript:(function(){function XY(Type,Step){return (Type=='X')?((Step==0)?document.all.size.value.split(',')[0]/2:document.all.size.value.split(',')[0]):((Step==0)?document.all.size.value.split(',')[1]/2:document.all.size.value.split(',')[1]);}with(document){body.innerHTML=body.innerHTML.replace(/<INPUT(.{1,99}?NAME=(["'])map\2[^>]*>)/i,'<SELECT name=map.x><OPTION value=0>西<OPTION value='+XY("X",0)+'>中<OPTION value='+XY("X",1)+'>東</SELECT><SELECT name=map.y><OPTION value=1>北<OPTION value='+XY("Y",0)+'>中<OPTION value='+XY("Y",1)+'>南</SELECT><INPUT TYPE=submit VALUE=GO><BR><IMG$1')}})();

お気付きでしょうが、こちらは京ぽんの文字数制限をはるかにオーバーしてしまって現行の京ぽんでは動きません。パソコンの Opera Ver.8.50 でなら動作確認をしてあります。パソコンならマウスでクリックするだけのほうが断然使い易いので↑こちらはボツバージョン!




で、こっち↓が本命! だけど、スクロール位置の座標を手入力なのがチト辛いかも!

javascript:with(document){body.innerHTML=body.innerHTML.replace(/<INPUT(.{1,99}?NAME=(["'])map\2[^>]*>)/i,'X<INPUT TYPE=TEXT NAME=map.x VALUE=><BR>Y<INPUT TYPE=TEXT NAME=map.y VALUE=><BR>X,Y:0,0->'+all.size.value+'<INPUT TYPE=submit VALUE=GO><BR><IMG$1')}

↑の 2005-10-04版は、数値を全て入力する必要があってメンドイので、↓の 2005-10-05版では、あらかじめ入力欄に地図サイズ(X:横方向サイズ,Y:縦方向サイズ)を初期値として設定しました。
これにより、新たに数字を入力する必要は、ほとんど無くなって不要な数字を [クリア]キーで削除して [送信] ボタンを押すだけで済みそうです。
つまり、 [クリア]キーで削除して残った数値が、1桁なのか2桁なのか3桁なのかって云う大雑把な感覚で気楽に [送信] ボタンを押せばラクでしょっ!って訳です。

javascript:with(document){Z=all.size.value.split(',');body.innerHTML=body.innerHTML.replace(/<INPUT(.{1,99}?(["'])map\2[^>]*>)/i,'X<INPUT TYPE=TEXT NAME=map.x VALUE='+Z[0]+'><BR>Y<INPUT TYPE=TEXT NAME=map.y VALUE='+Z[1]+'>\n<INPUT TYPE=submit>\n<IMG$1')}

使い方

Mapion PDA 地図が表示されている状態でこのブックマークレットを起動します。
座標 ( X , Y ) の数値を半角数字で入力して [GO] もしくは [送信] ボタンを押すとその指定位置が地図の中心に移動します。
指定可能な数値の範囲は、( 0 , 0 ) から ( 地図サイズ X , 地図サイズ Y ) までです。
ただし、特例として、原点 ( 0 , 0 ) は除外します。原点付近に移動したい場合は、( 0 , 1 ) もしくは( 1 , 0 ) を指定してください。
参考までに、地図中心の座標と地図の四隅の座標を図示しておきます。


   ( 0 , 0 )        ( size_X , 0 )
     ┌─────────────┐
     │             │
     │             │
     │             │
     │             │
     │             │
     │      中心      │
     │      ┼      │
     │ ( size_X/2 , size_Y/2 ) │
     │             │
     │             │
     │             │
     │             │
     │             │
     └─────────────┘
   ( 0 , size_Y )     ( size_X , size_Y )



注意
このブックマークレットの目的は、あくまでも、地図画像上でマウスをクリックした状態をシミュレートする事です。
入力座標の数値は指定可能な範囲でお使いください。


メモ


正規表現 .{1,99}? の部分は、不必要にくどい様に見える。事実パソコンのブラウザで試していた時は、 .+? で巧く動いていたし、これが本来の狙い通りの表現だ。つまり?を使って最短マッチをさせたかった。
しかし、京ぽんは、最長マッチしてしまう。しかも後続の (["'])map\2 の部分を無視しているかのように <INPUT TYPE="HIDDEN" NAME="grp" VALUE="pda"> なんてものにマッチする事も有った。試行錯誤しているうちに文字数で範囲を制限する事に落ち着いた。ここまで来ると最短マッチの指定の?は最早本来の狙いを記録として残しているに過ぎない。
同様に [^>]*> の部分も元々は .*?> と書いて最短マッチさせて記述文字数を2文字分減らす予定だった。事実パソコンではこれで巧く動いていた。なのに、京ぽんは。。。。。なので最長マッチとなる表現に変更した。
原因はヒープオーバーフローとか?ってヤツなんだろう。。。なんて、勝手に思い込んでいる。

ここまで書いてきてやっと気が付いたけれど、正規表現 /<INPUT(.{1,99}?NAME=(["'])map\2[^>]*>)/i の中の NAME= は、必要が無い。というか、その前の .{1,99}? が在れば無駄で、京ぽんのオペラに無駄な負荷を掛けていた様に思えてきた。
あとで気が向いたら NAME= を削って、試して見るかも。→これで5バイト削減。
最短マッチが機能するように成るのかもしれない。
最短マッチがうまく行けば、さらに5〜7バイトの削減かも。 追記(2005-10-05) NAME= は削ってOKだった。しかし .{1,99}?  .+? に替えてしまうと、前述の <INPUT TYPE="HIDDEN" NAME="grp" VALUE="pda"> を replace してしまう。つまり最短マッチの?を頼りにすると不思議な事が起きる。結局 NAME= の有無は大勢に影響が無く、有った方がコードの可読性が良いので残して置く事にする。

正規表現 (["'])map\2 の部分は、京ぽんの場合は、 'map' とマッチさせ、PCでの場合は、 "map" とマッチさせる事を狙っている。つまり、京ぽんでだけ動けば良しとするなら、単に 'map' と書けば6バイト減らすことが出来る。が、これは気が進まない。

改行の目的で<BR>を使っている部分が3箇所あるが、PC版の Opera Ver.8.50 では、どれも ¥n に入れ替えても挙動が同じに見えた。つまり、3*2=6バイト分減らせそうに思った。
しかし京ぽんでは前方から2つの<BR>を変更すると挙動が変わった(スクリーンモードとかリロードした場合とかにもよるけれど)。
最後の<BR>だけは、 ¥n に替えても京ぽんの画面の挙動は変わらないように見えた。
つまり、2バイト減らす余地がまだある。まぁ、強引に全部 ¥n に入れ替えても動かない訳では無いのだが。。。。。見た目の問題だけだし。。。。。



追記
このブックマークレットよりも
2005-10-17の日記
ブックマークレットの方がより快適にスクロール出来ます。