プロが教える店舗&オフィスのセキュリティ対策術

教えてください。
画面に表示されている地図を動かす時に移動中の地図の分を次々に読み込むjavascriptとリクエストを受けるサーバーの処理(node.js)のプログラムはどのように書くのでしょか?

A 回答 (1件)

こんにちは



世のシステムがどのような仕組みで行っているかは知りませんので、推測での回答です。

質問者様のマップがどのようなものか不明ですし、地図画像がどのような構成になっているのかも不明ですので、以下のようなものと勝手に仮定しました。
・地図はある大きさ毎に分割されていて、タイリングして表示する仕組みである
・個々の地図データは必要に応じて表示の為に読み込む
・何らかの座標系が用いられており、位置座標からそれに対応する地図のID等が簡単に算出可能。
ご質問文には「移動中」とあるので、初期表示等はできているものと解釈しました。

「移動中」の意味がアニメーション的に表示を移動することを意味しているのか、あるいはフリックなどで一定量移動した場合の表示のことなのかよくわかりませんが、いずれにしろ似たようなものなので、区別はせずに考え方を・・・
地図の表示は基本的に、画面の表示サイズ、地図の縮尺(=拡大率)、表示位置(座標範囲)から必要となる地図データのID(複数)を算出してサーバにリクエストしているものと推測します。
初期表示は、まさに上記の通りのことを行っていることでしょう。

地図を移動しても要領はまったく同じで、新しい表示位置に応じて必要となるデータをリクエストするだけです。
その際に、既に読み込み済みのデータ(地図画像)に関しては、ブラウザがキャッシュを利用するので、実際には新しく必要になる部分だけがリクエストされます。
javascript側で読み込み済みのデータ(地図画像)を覚えておいて、新しく必要になるデータだけをリクエストするような制御をすることも可能ですが、労多くして功少なしということになりそうです。

>サーバーの処理(node.js)のプログラム~~
…とのことですが、マップの表示だけに関して言えば、地図画像データの出力だけなので、リクエストされた画像を出力すれば済むはずです。
データ(画像)のIDがきちんと整理できていれば、プログラムを利用する必要もないでしょう。
何らかの換算やその他の処理を併せて行うのなら、プログラムを介するのもよいでしょうが、見かけ上の機能としては、画像データを送るだけということになるでしょう。


GoogleMapなどでは独自のマップを表示することもできるようなサービスを行っていますので、作るのが面倒なら、そのようなものを利用するのも一法かと思います。
https://qiita.com/haradakunihiko/items/bb690e5af …
https://developers-dot-devsite-v2-prod.appspot.c …

あるいは、もっとオープンなデータ構成を用いることで、複数のソフトを用いて表示することも可能と思います。
http://cse.naro.affrc.go.jp/takahasi/gisdata/ind …
    • good
    • 1

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!