ホントは、こうらしい。

プロデューサーに向かって（？）このように叫ぶのは『デレマス』====ThisIsTheErrorMessege====の登場人物、本田未央（ほんだみお）。らしい。
で、これの派生で、毎週末に競馬をやっては惨敗して「競馬をやめる」宣言を繰り返す「ちゃんみお」というのがあるらしい。こんな風にだ。（すいません１つだけ引用します。いろいろ知りたい方はハッシュタグ「ちゃんみお競馬」で検索を。電車の中で声出して笑っちゃってもしらないよ（笑））。 そして次の週末になると、また競馬に手を出して「ぜんぜん違うじゃ（以下略。これの集大成同人誌が冬コミで売られているそうで。今年１月に貸してもらったけど、笑い殺す気か（笑）。

で、何が言いたいのかというと。

---

ある日。とある会場（ピッチ）へのアクセスを知りたくなった。ＰＣは立ち上げてなかったか『だぞんのこし』で使えなかったかで、スマホ『ジャンヌダルク』で「鋳造総研」のピッチページを検索したところ……「あれ？地図のポインターが切れてる」。
上段の広域地図で、範囲内で観戦した他ピッチのガイドアイコンが地図エリアからはみ出していた。ＰＣで視るとこんなことは起きない。間違いない。作った時は確認しているからだ。
なんでなんで？誰が悪いの？と調査開始。自宅にあるギアで見比べてみよう。旧スマホ『鹿目まどか』、タブレット『篠ノ乃箒』、そして旗艦ＰＣ『阿良々木火憐』。ギアにアニメキャラの名前がついているのは、そのギアを購入した際に当該アニメとタイアップしたパチ＆スロに購入資金調達で大変お世話になったからです（笑）。

ジャンヌ Xperia XZ3
まどか Xperia XZ
ほうき ZenPad
かれん PC

鋳造が持ってるネット接続ギア５つのうち、４つを試して全部違う。重ねてみると、こんな感じ。同じサイトを視ているのに、これだ。 ちなみに、この症状はすべて『やっほーマップ』で起きている。『ぐるぐるマップ』では、同じＵＲＬの地図はどのギアでも同じ範囲が出る。これは「やっほー」に問い合わせなれば。すると、戻ってきたのはゼロ回答だった。回答ゼロではなく、ゼロ回答。

「有料サービス会員のみ、サポートいたします」。

と鋳造が「ちゃんみおモード」になっても、許されるでしょう。許されるよね？だって『ぐるぐるマップ』ではちゃんと同じエリアの地図が出るんだよ？地図のデザインは『やっほーマップ』の方が圧倒的にわかりやすいんだけど、ギアによって出て来る範囲が違うってんじゃあ、地図ページとしては使いモノにならない。
というわけで、鋳造総研の地図は全部『ぐるぐるマップ』化するという方向で設計の見直しを行っていたのです。そう、
『ぐるぐるマップ』がグレるまでは（笑）。

---

2019年３月22日の夜、予告はされていたという話もあるけど、突如『ぐるぐるマップ』がグレた。「自分の家の前に巨大な湖が出来た」「線路が海の上を渡り出した」などなどなど。どうやら、ゼンリンとの契約を解消して、画像解析やユーザのデータをもとに地図を作って表現するという遠大な社会実験に取り組み始めたみたい。うん、社会実験は社会実験でいいからさ、そういうのは実験室でやろうよ。どうして、『とても小さくて柔らかいさん』とか『ぐるぐるさん』とかはユーザにバグフィックスさせて平気な顔をしていられるのかしら。わけがわからないよ（キュゥべえ）。まあ、直接は『ぐるぐるさん』にはカネ払ってませんけどね。とにかく、『鋳造ちゃんみお案件』は行き詰ってしまったのでした。

---

ゆっくり整理してみよう。ぼくが『やっほーマップ』をちゃんみおしよう（笑）とした理由は、ギア次第で表示される範囲が変わるから。ということは、『やっほーマップ』で範囲が変わらないようにすればいいんじゃん。ぴかぁーんっ！アッタマいいっ！でも、どうやって？

これまでの鋳造総研では、こういう仕組みで地図やポインター画像を表示していた。ここでは「可変マップ」という言い方にする。

しかし、実は鋳造総研のページでは実は「可変マップ」にする必要はない。地図中心やズームは変更出来なくてもいいのだ。そんな需要のために、『やっほーマップ』には「スタティックマップ」というサービスがある（ここでは「静止マップ」という言い方にする）。「ここを中心にこの倍率で地図を出しなさい」というオーダーを『やっほーマップ』コントロールに送るとオーダー結果を静止画に加工した表示用ＵＲＬが帰ってくる。静止画なので地図の中心も倍率も表示後にユーザーがいじりようがない。
しかし、このやり方には大問題があって、「可変マップ」の『Ｄ』のように、バス停等案内や範囲内他観戦ピッチの座標や表示するＰＮＧファイルのアドレスをコントロールに送って「静止マップ」に表示させる機能がない。座標は送れるのだけどユーザ作成ＰＮＧファイルを受け付けてくれないので、『やっほーマップ』側が用意する味気ないミナモの顔が上下逆になったようなポインターで表示するしか出来ない。そのポイントに付随する説明テキストの表示も実に味気なく、これでは使えない。さて。

そこで、またしてもぴかぁーんっ！と気づいたわけさ。「静止マップ」はイメージタグを使ってHTML内に書き込まれる。で、ＣＳＳの初歩の扱いにdivタグを使って画像の上に文字や別の画像を表示させるというのがある。これじゃん。

要するに、地図面は『やっほーマップ』にデータを送ってそれを写真を載せるように静止画として配置し、その地図（静止画）の上に表示箇所を計算して、ＨＴＭＬ側でピンポイントでレイヤーのように重ねて表示していく（ポインターに関する情報は『やっほーマップ』には送らない、送っても受け取る窓口がないから）。

これで作ったページを、再び『ジャンヌ』『鹿目まどか』『篠ノ乃箒』『かれん』で視てみよう。上にも書いたけれど、地図画像は『やっほーマップ』に中心座標と倍率を送って帰ってきた静止画像、『掛洞』『長良川』など６つのポインター画像は、その画像の上にdivタグのtop、left指定で場所を精密に計算して表示させている透過ＰＮＧ画像です。

ジャンヌ Xperia XZ3
まどか Xperia XZ
ほうき ZenPad
かれん PC

これで、ギアによる表示範囲の違いはなくなった。『やっほーマップ《解呪ノ儀》』、成功。ふう、長かったよ、ママ。
ちなみに、「静止マップ」の作り方の『Ａ』で触れた「表示範囲の四隅の緯度・経度の出し方」は、『やっほーマップ』コントロールに中心座標と倍率を送って「可変マップ」を表示させると右上隅と左下隅の緯度・経度が拾える関数のようなものがあるので、それを使ってゲットする。手間は増えたけど、ちゃんとした地図が綺麗に出せるのなら手は抜かないさ。

ここでちょっとご注意を。現在、『総研』ピッチ地図を視ると、赤いヘンテコな枠が表示されるところがありますが、あれはその（赤く表示した）範囲を他のページがカバーしているという意味です。ただ、見苦しくなってしまっているページもあるので、それは今後逐次修正いていきます。しばらくお待ちください。