■

さてさて、新宿を名乗っている以上、新宿についても少し触れておかねばね。
今日は帰りに同僚数人と飯を食って帰ろうとしていると、なんと上司(といっても年齢は変わらないが…)が飯代だけ渡して去っていったのだ！

そんな感動のイベントの中、夜23時に訪れたのがこちらハイチ新宿本店でございます。気になるお値段は千円前後と御値ごろ価格、いただいた千円でお釣りがきました。

では、ハイチをマップで出して見よう。
が、しかし、ハイチを出すにはハイチの位置情報が必要だ。昔GoogleMapを触ったころはツールを使ってなんとなく位置情報も得ていたが、今回はせっかくなのでガイドに従ってやってみる。

リンクをたどっていると、ディベロッパーガイドのサービスにジオコーディングという項目に辿り着いた。どうやら、リクエストを投げると複数の形式で返してくれるようだ。

先ほどのハイチのサイトから得た住所情報からガイドに従ってリクエストを作ってみた。

http://maps.google.com/maps/geo?q=東京都新宿区西新宿1-19-2&key=****&output=xml

おそるおそるリクエストを投げてみると、見事に返ってきた！すばらしい！こんな感じ。

<?xml version="1.0" encoding="UTF-8" ?> 
<kml xmlns="http://earth.google.com/kml/2.0">
<Response>
  <name>東京都新宿区西新宿1-19-2</name> 
  <Status>
    <code>200</code> 
    <request>geocode</request> 
  </Status>
  <Placemark id="p1">
    <address>日本東京都新宿区西新宿１丁目１９-２</address> 
    <AddressDetails Accuracy="1" xmlns="urn:oasis:names:tc:ciq:xsdschema:xAL:2.0">
      <Country>
        <CountryNameCode>JP</CountryNameCode> 
        <AddressLine>東京都新宿区西新宿１丁目１９-２</AddressLine> 
      </Country>
    </AddressDetails>
    <Point>
      <coordinates>139.697620,35.688413,0</coordinates> 
    </Point>
  </Placemark>
</Response>
</kml>

うれしくなって他の形式も投げてみる。まずはCSV
リクエストはこちら。

http://maps.google.com/maps/geo?q=東京都新宿区西新宿1-19-2&key=*****&output=csv

戻り値はこちら。

200,1,35.688413,139.697620

最後にJSON、リクエストはこちら。ただし、IEだとなぜかうまくいかず…、FireFoxだと問題なかったです。

http://maps.google.com/maps/geo?q=東京都新宿区西新宿1-19-2&key=*****&output=json

そして戻り値、けど、JSONのインデントのつけ方間違ってるよな…また勉強しないと。

{
  "name":"東京都新宿区西新宿1-19-2",
  "Status":
    {
    "code":200,
    "request":"geocode"
    },
  "Placemark":
    [
      {
      "id":"p1",
      "address":"日本東京都新宿区西新宿１丁目１９-２",
      "AddressDetails":
        {
        "Country":
	  {
	  "CountryNameCode":"JP",
	  "AddressLine":["東京都新宿区西新宿１丁目１９-２"]
	  },
	"Accuracy": 1
	},
      "Point":
        {
        "coordinates":[139.697620,35.688413,0]
	}
      }
    ]
}

さて、では、マーカーにトライする前にまずは地図をハイチセンターにしてみる。
GoogleMap APIのkey取得ページの完コピソースを改変。中心座標を変えて、拡大率を上げる。最大で19まで行けたが、意味わからなくなるので18で。

    function load() {
      if (GBrowserIsCompatible()) {
        var map = new GMap2(document.getElementById("map"));
        map.setCenter(new GLatLng(35.6884, 139.6976), 18);
      }
    }

これでセンターになる。
ついでにマーカーも打ってみる。GMarkerはコンストラクタ引数にGLatLngをとる。素直に書くと。

    function load() {
      if (GBrowserIsCompatible()) {
        var map = new GMap2(document.getElementById("map"));
        map.setCenter(new GLatLng(35.6884, 139.6976), 18);
        map.addOverlay(new GMarker(new GLatLng(35.6884, 139.6976)));
      }
    }

一応リファクタ。

    function load() {
      if (GBrowserIsCompatible()) {
        var map = new GMap2(document.getElementById("map"));
        var haitipoint = new GLatLng(35.6884, 139.6976);
        map.setCenter(haitipoint, 18);
        map.addOverlay(new GMarker(haitipoint));
      }
    }

これでマーカーが立った！吹き出しもつけたかったが、ヤバい、眠い。でもおもしろい。おやすみ。。

おっと、で編集後はこんな感じ。今日のサンプル