教会地図検索と自転車ツーリングGPS記録で、Googleマップのストリートビューに対応しました。
最初は、教会の住所の用に情報ウィンドウで表示させようとしましたが、ビュー内での矢印クリックによる移動で、アイコンと一緒に情報ウィンドウをメソッドGInfoWindow.resetで移動しようとしたけどうまくいかないので、あきらめました。
とりあえず、Prototype Window Classで対応しました。
ツーリング記録 一覧 (1/1)
なんとなく、教会地図検索と自転車ツーリングGPS記録の地図の選択で、普通の地図と衛星写真に加えて、地形が表示できるようになりました。
最初は、ストリートビューを表示させたいと思ったのですが、大変そうなので、こうなりました…
MacのブラウザSafariが、バージョン3よりWindows版がリリースされるとのことで、Windows版Safari3Betaをダウンロードして、インストールしてみました。
以前、Safariで天理教教会地図検索が動作しないとの報告がありましたが、Macを持っていないため自分では検証できなかったので、Windows版Safari3で動作するか確認してみました。
結果は、きちんと動作しました♪
Safari2以前では駄目だったのが、3では他のブラウザとの互換性が高まったのでしょうか?
とりあえず、よかったです。
ついでに自転車ツーリングGPS記録は動くかな?と試したところ、以前見つかってしまった軌跡が見れなくなったときと同様の動作でした…
ということで、修正しようと多少いぢってみました。
軌跡を描くGoogleMapsAPIのGPolylineのメソッドfromEncodedの引数をいぢったところ、半透明処理を設定すると思われる引数opacityの値を0から1に変更したところ、軌跡が表示されました。
半透明処理が解除されたためか、以前表示されていたときより、くっきり表示されるようにもなりました。
なぜ、opacityを0にすると表示されないかは不明ですが…
Google Maps APIのページを見ると、Examplesの部分のEncoded PolylinesにNew!とあるので確認すると、2.63から地図上に線を引くGPolylineにfromEncodedというメソッドが増えているようである。
このfromEncodedは緯度経度を指定の方式でエンコードした文字列を引数に渡すことにより、やり取りするデータも小さくなるし、縮尺により無視する位置も指定できるようだ。
とりあえず、無視する縮尺を細かく指定するのは面倒なので実装せず、エンコードのやり方はInteractive Polyline Encoder Utilityの関数をそのまま使わしてもらうことにして、自転車ツーリングGPS記録に対応しました。
試してみるとなんとなく早くなったような気がしますが、きっとプラシーボ効果でしょう…
ツーリングGPS記録のスライダの上の空白部分に標高を示す折れ線グラフを表示するようにしました。
グラフ表示のために、DOMでDIVタグを作成し、それを並べて線などを引く実験をしていましたが、あまりに重いのであきらめていました…
IE限定だがVMLで描画を実現させようかと思っていましたが、なんとなくやらずじまい…
firefoxとoperaでは、canvasタグというので描画できるというので調べてみると、google codeがIEでも対応させるライブラリを作っていましたので、それを利用して折れ線グラフを実現しました♪
http://excanvas.sourceforge.net/
しかし、グラフの領域とスライダをwindowサイズに合わせて横に広げようとして、IEでは動作するのですが、firefoxとoperaでは比率がうまくいきませんでした…
今後は横幅を拡張したり、グラフで速度を表示できたりしたらいいかなと思っております。
ツーリングGPS記録のルート表示の処理に時間が掛かっていたので、
タイマーで一定時間ごとに少しずつ分割して表示するようにしてみました。
感覚的に速く表示されるようになったかな?
ちなみに、高度グラフ表示はこれでも、遅くて使えない…
次はgoogle mapsのルートと同じように、VMLで表示するようにしようかな。
SVGの方がいいのかな?
ツーリングGPS記録のルートの各点のデータを、連想配列なjsonデータで処理していました。
ルートデータを表示する際、ずいぶんと時間がかかるので、一度に表示させていたのを、タイマーかなにかで分割して表示しようと考えています。
しかし、連想配列だと処理がしづらいので、普通の配列にデータ構造を変更しました。
内容の変更は特にありません…
ツーリングGPS記録にGoogle Maps API Ver.2の目玉?の、
GOverviewMapControlを追加してみました。
結果から言うと、IEではうまく表示されません…
firefoxとoperaに対しても苦労しました…
デフォルトの右下にOverviewMapを表示させようとすると、
地図の領域の右下でなく、ブラウザの右下になるので、左上に移動。
(追い出されGLargeMapControlは右上に移動。)
すると、z-indexで、地図の下になるので、地図を下にするように…
下記のページを見ると、タイマーやら非公表のidを使ったりと、
かなりトリッキーな処理をする必要があるようですが、
本日はとりあえず断念…
http://www.econym.demon.co.uk/googlemaps/basic13.htm
ツーリングGPS記録を、
Google Maps APIのバージョン2に対応させました。