さて、MySQLからJOSNファイルの生成方法はわかった。
では、同じphpMyAdminのMySQLのデータテーブル「KOUEN」からどんなJSONとXMLが表示されるのか比較してみる。
Google Maps APIで、マーカーデータをダウンロードし、表示させるためには、この違いが判っていないとね・・・・。
◆先ずMySQLのデータテーブル「KOUEN」はこんな感じ。
◆MySQLテーブルの要素は、次の通り
スポンサードリンク
さて、MySQLからJOSNファイルの生成方法はわかった。
では、同じphpMyAdminのMySQLのデータテーブル「KOUEN」からどんなJSONとXMLが表示されるのか比較してみる。
Google Maps APIで、マーカーデータをダウンロードし、表示させるためには、この違いが判っていないとね・・・・。
◆先ずMySQLのデータテーブル「KOUEN」はこんな感じ。
◆MySQLテーブルの要素は、次の通り
Google Maps APIプロジェクトのClusterMarker サンプルがJSONファイルなるものを使っていた。
いままではXMLファイルにマーカー表示用の情報を直接書き込む方法、それからMySQLデータベースからphpでXMLファイルを生成させる方法を勉強したが、今回のJSONとういうファイルを作成してみる。
さて、JSONとは?
JSONはXMLと違ってマークアップ言語ではないらしい。JSONの記述ルールは次のようなもの・・・・・
true
,false
,null等は小文字とする
◆さて、MySQLからJOSNファイルを生成させてみよう
Google Geoブログで、Google Maps APIのアプリケーションAPI開発に重視しているソフトウェア技術者が発表した最初のライブラリに、MarkerClustererがあります。 Google Maps APIで大量のマーカーを取り扱うアプリケーション開発で問題にぶつかり(地図表示の遅れ)、それはブラウザが何千ものDOM要素を作成することのに非常に多くの処理を必要とするからだとっています(マーカーがDOM数要素の組み合わせであるため)。
そこで、クラスタリング(clustering)が良い解決になるであろうと、MarkerClustererを思いついたとのことです。 MarkerClustererとは、ラベルでマーカーを異なったクラスタに集めて、各クラスタにマーカーの数を表示するものです。地図のズームレベルが変化すると、それに併せて新しいクラスタが作成されていきます。 デモをブラウザGoogle Chromeで試すと、1000マーカーで約160msecでした(驚き!!)
◆自分でもやってみた。 驚いた!何と遅いI.E7でも2000マーカの大量のマーカー(アイコン)でも動く。ズームは、弱いが、地図の横移動はストレスがない。
さて、たくさんの大量マーカー(アイコン)を表示させる方法として、GmarkerMnagerに挑戦。
マーカー数は、約600。
ブラウザGoogle Chromeでアクセスしてみる。
おっ 動く。読み出しも1秒とかからない。さくさくか?
次は、IE7でアクセス・・・・・・・おっ・・・・しかし、ズーム、地図移動がいまいち。なんとかというレベル。
これ以上マーカーが増えてたくさんになったら、多量のマーカー表示は出来そうもない。
◆GmarkerMnager+XMLファイル
作成済みXMLファイルを読み込んで、GmarkerMnagerで+XMLファイルで大量のマーカーを表示させてみることに
◆XMLファイル
ともかくUTF8で作成ね。
XMLファイルサンプル (※Google Chrome使用の方は、ページのソース表示で確認してください)
◆XMLファイルへのズームの設定とGmarkerMnagerでのマーカー表示
◆Html記述
<body onload=”initialize()” onunload=”GUnload()”>
<div id=”map100″>Loading…</div>
◆script記述
<script type=”text/javascript”>function initialize() {if (GBrowserIsCompatible()) {var map100 = new GMap2(document.getElementById(“map100″));map100.setCenter(new GLatLng(35.65862, 139.74541), 9, G_NORMAL_MAP);}}</script>
◆Google Maps APIで地図に初期表示させるマップの種類を変えてみる。 scrptの記述を変更するだけ
標準:
map.setCenter(new GLatLng(36.350527, 138.076172), 6, G_NORMAL_MAP);
航空写真:
map.setCenter(new GLatLng(36.350527, 138.076172), 6, G_SATELLITE_MAP);
航空写真+地図:
map.setCenter(new GLatLng(36.350527, 138.076172), 6, G_HYBRID_MAP);
地形:
map.setCenter(new GLatLng(36.350527, 138.076172), 6, G_PHYSICAL_MAP);
Earth:
map.setCenter(new GLatLng(36.350527, 138.076172), 6, G_SATELLITE_3D_MAP);
多量のマーカー(アイコン)をGoogle地図で表示していくととてもマップ(地図)重くなっていく。どうしたら対策になるのか。は、もちろんのだが、これが一番困る。
素人なので、あまり難しいことは出来んしな。
Google Chrome を自分の標準ブラウザで使っていたが、ある日Internet Explore 7 で自分のサイトを覗いて驚いた。多数のマーカー(アイコン)を表示しているせいで、5秒まっても地図が表示されないほど遅く重い。
何とかならんかの。
◆I.E7でさくさくとは言わないまでもストレスなく地図を操作できることを目的に、あれこれ調べていきますか。
今まで、やったことがあるのは、GMarkerManager。それでもアイコン(マーカー)数が増えて、1000近くなってくるとブラウザI.E7では、かんべんてな感じになってしまうので、Floatを使って、XMLからマーカを呼び出す範囲を限定してしまった始末。
大量のマーカー(アイコン)表示のパフォーマンスチェックは、ココのサイトでやってみた。
◆GMarker
スポンサードリンク