まずはデモ。
[myphp file=’gmap_sample’]
今回の「登る山」>>>住所入力からGoogleMAPに周辺環境などを表示するbyPHP
GoogleAPI。それは偉大なるGoogle大明神が提供してくださる天界からの貴重でたいへん便利な情報である。とりわけGoogleMAPに係るものはその草分けで、こういうとこのサイトなどを勉強すれば、その世界は必ずや広がると思うが、使いこなすのに半年はかかる、さぁ困った。
ということで、PHPである程度できないか藻掻いてみた。
GoogleMap URLの秘密
URLには、緯度経度、検索語、ズームなど、指定することができる。
<iframe src="http://maps.google.co.jp/maps?ll=35.004212,135.869105&q=大津駅" width="300" height="200"></iframe>
↓こちらのサイトが特に役にたった。感謝
Google Mapsを使ってみよう(神サイト!)
http://www.shurey.com/html/googlemaps.html
つまり、「住所」から緯度経度を検索して割り出しURLに吐き出す、と共に検索用語を選択形式に代入すれば、不慣れなGoogleAPIやJavascriptなどを使わずできるのではと仮定した。
<?php $jamd_location = '東京都千代田区永田町1-7-1'; //こちらに任意の住所を入力 ?> <?PHP // GET用のパラメータ作成 $parametar = "?sensor=false®ion=jp&address=".urlencode(mb_convert_encoding($jamd_location, 'UTF8', 'auto')); $datas = file_get_contents('http://maps.googleapis.com/maps/api/geocode/json'.$parametar); // JSONデータをPHPの値に変換する $geo = json_decode($datas); $status = $geo->status; // エラー判定をして値を取得する if($status == "OK"){ $results = $geo->results[0]; $geometry = $results->geometry; $location = $geometry->location; $lat = $location->lat; // 緯度を取得 $lng = $location->lng; // 経度を取得 } ?>
どこかで拾ったものだが、PHPによる指定住所の座標を抽出するスクリプト。
これで住所から緯度経度割り出し成功した。
あとはGooglemapはiframeタグと決まっているので、
<iframe src="http://maps.google.co.jp/maps?ll=「緯度」,経度>&iwloc=A&output=embed&q=「検索用語」&z=16&hl=ja" width="100%" height="300" id="iframe_id" class="border_none" name="gmap_frame"></iframe>";
に対応するプログラムが組めれば完成。
<?php $jamd_location = '東京都千代田区永田町1-7-1'; //こちらに任意の住所を入力 ?> <?PHP // GET用のパラメータ作成 $parametar = "?sensor=false®ion=jp&address=".urlencode(mb_convert_encoding($jamd_location, 'UTF8', 'auto')); $datas = file_get_contents('http://maps.googleapis.com/maps/api/geocode/json'.$parametar); // JSONデータをPHPの値に変換する $geo = json_decode($datas); $status = $geo->status; // エラー判定をして値を取得する if($status == "OK"){ $results = $geo->results[0]; $geometry = $results->geometry; $location = $geometry->location; $lat = $location->lat; // 緯度を取得 $lng = $location->lng; // 経度を取得 } ?> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> <script type="text/javascript"> $(function() { $('#hyouji_button').click(function(){ $('#hyouji').slideDown(1000); }); }); </script> <hr /> <div style="background-color:pink;"> <h3>Googleマップ周辺環境出力PHPサンプルコード</h3> <p>ここでは住所サンプルとして、住所を国会議事堂(<?php echo $jamd_location;?>)とする(笑)。</p> <form id="hyouji_button" method="post" enctype="multipart/form-data" action="<?php echo get_template_directory_uri(); ?>/gmap_sample_kankyou.php" target="iframe" name="gmap" class="input_custom"> <input type="radio" id="select1" name="radio_group" value="コンビニ"> <label for="select1">コンビニ</label> <input type="radio" id="select2" name="radio_group" value="スーパー"> <label for="select2">スーパー</label> <input type="radio" id="select3" name="radio_group" value="病院"> <label for="select3">病院</label> <input type="radio" id="select4" name="radio_group" value="小学校"> <label for="select4">小学校</label> <input type="radio" id="select5" name="radio_group" value="中学校"> <label for="select5">中学校</label> <input type="radio" id="select6" name="radio_group" value="銀行"> <label for="select6">銀行</label> <input type="radio" id="select7" name="radio_group" value="郵便局"> <label for="select7">郵便局</label> <input type="radio" id="select8" name="radio_group" value="行政機関"> <label for="select8">行政機関</label> <input type="radio" id="select9" name="radio_group" value="ドラッグストア"> <label for="select9">薬局</label> <input type="radio" id="select10" name="radio_group" value="バス停"> <label for="select10">バス停</label> <input type="text" name="ido" value="<?php echo $lat; ?>" style="display:none;"> <input type="text" name="keido" value="<?php echo $lng;?>" style="display:none;"> <div class="crearboth"> 上の環境項目をチェックしてから【調べる】を押してください。<input type="submit" value="調べる"> </div> </form> <div id="hyouji" style="display:none;"> <iframe name="iframe" width="100%" height="300" class="border_none" scrolling="no" frameborder="no"></iframe> ※該当住所(<?php echo $jamd_location;?>)は地図中央付近となります。 </div> </div> <hr/>
gmap_sample_kankyou.php
<?php if (isset($_POST["name"])) { $_POST['name']="gmap"; } if (isset($_POST["radio_group"])) { $kankyou_name = htmlspecialchars( $_POST[ 'radio_group' ], ENT_QUOTES, 'UTF-8' ); $map_keyword ="&q=".$kankyou_name; }else{echo "ラジオボタンを押してください";} if (isset($_POST["ido"])) { $lat = $_POST['ido']; } if (isset($_POST["keido"])) { $lng = $_POST['keido']; } ?> <iframe src="http://maps.google.co.jp/maps?ll=<?php echo $lat; ?>,<?php echo $lng;?>&iwloc=A&output=embed<?php echo $map_keyword; ?>&z=16&hl=ja" width="100%" height="300" id="iframe_id" class="border_none" name="gmap_frame"></iframe>";
そろそろjavascriptを覚えろーって大明神の声が聞こえてきます(保留)
まぁ、こういうの必要ないっちゃ、ないと思いますけど、動くとうれしいですねぇ。