マウスでスクロールできる地図
MapServer開発キットとAJAX技術を組み合わせればマウスでスクロールできる地図を作ることも可能です。
地図上の任意の地点にポイントを登録することもできます。
縮尺ごとに、表示するレイヤーを変化させ、大量のデータの処理を軽減するようにしています。
この画面は複数のタイル画像によって構成されています。個々のタイル画像は一度作成されるとキャッシュされ、次からのアクセスではそのキャッシュ画像が使用されます。
画像作成の処理が重いので、はじめてその地域が閲覧されている場合、画像の切り替わりがスムーズではない、と感じるかもしれませんが、一度だけなので、ご勘弁下さい。
対応ブラウザ
- Internet Explorer 6
- Firefox1.5
- 現在Operaでは一部の縮尺で正常に表示されません。
解説
小さな地図のタイル画像を数個配置して、マウスのドラッグに合わせて必要な部分の画像のみを新たにJavaScriptにて読み込みすることにより、画面遷移なしで地図の更新ができます。
今回のデモでは、JavaScriptの通信部分等には「prototype.js」を、
地図のドラッグや、移動部分に[scriptaculous.js」を使用しています。
