JavaScriptで作るスクロール地図ver.5「ウィルコムサポート拠点282カ所」 /usePocket.com

2010.05.12

JavaScriptで作るスクロール地図ver.5「ウィルコムサポート拠点282カ所」

ver.4を改造して、外部データをその場で重ねて表示するようにしました。今回は昨日時点でのウィルコムサポート拠点場所。データ取得プログラムに不具合が無ければ282カ所あるようです。2008年12月の時点で340カ所あったので減ってますね。
プログラムはちょっと長くなって345行ほど。地図はトップレベル以外は東日本しかありません。

以下、個人的メモ

JavaScriptでサーバーに置いてあるファイルを読み込んで(今回はこのファイル)、データの場所に透過GIFで作成した黄色い丸画像を重ねて表示しています。それぞれの黄色い丸にマウスを重ねると詳細を表示するのはtitleタグを利用。
全国の詳細マップを作っているのですが、ver.4で示した最大解像度で日本全国を画像化すると256x256ピクセルの画像が15万枚になりました(＾－＾；。google mapとか何枚の画像を使っているんだろう。
表示するために256x256ピクセルの画像を9枚タイル表示しています。この方式が一番画面の切り替えが少なくて良いのですが、解像度切り替えのたびに9枚の画像を読み込まれると画像データを置いている自宅サーバーの最大接続数をすぐにオーバーしてしまいます。どうしたものか、現在最大接続数100なのですが、単にもっと上限を上げれば良いのか？一般的なWebサーバーの最大接続数ってどれぐらいなんでしょうか？
今回の表示では最初に282カ所のデータを読み込んで、画面内に表示可能なデータのみ表示しています。この方式だと、データ数1万ある場合などに重たくて使い物にならなくなりそうなので、オンデマンドで読み込むデータを切り替える仕組みを作る必要がありそう。
「ダブルクリックで拡大」はチャレンジしてみたけど、うまくいかなくて保留中。
店舗の位置が数十メートルずれている気がします。なんでだろう・・・・・ウィルコムHPから取得したサポート拠点情報は日本測地系、地図は世界測地系なので、その変換の時にミスがあるのかもしれません。
この地図の作成に当たっては、国土地理院長の承認を得て、同院発行の基盤地図情報を使用した。(承認番号　平22業使、第40号)

Category:位置情報・GPS・地図

Follow @fetuin

いいっすね！=4
001 [05.12 12:16]ω★79:ドラッグ時に表示エリア外でボタンを離すとonmouseupが実行されないので、dragStart時にマウスをキャプチャしておく必要があるのでは？ ↑(1)
002 [05.13 01:13]ふぇちゅいん★26:おお、ご指摘ありがとうございます。なるほど。onmouseoutというイベント設定して地図からマウスが外れた場合にドラッグ終了するようにしてみました。 ↑(1)

すべて見る

この地図の作成に当たっては、国土地理院長の承認を得て、同院発行の基盤地図情報を使用した。（承認番号　平22業使、第40号）

最近コメントが書かれた記事

姉妹サイト

Twitterでのお返事