【googlemapAPI】地図表示・マーカー表示・ウィンドウ表示

hotpepperAPIを利用して検索したお店たちを、googlemapAPIを利用してマッピングする。


以下↓で公開したソースに入れました。
http://d.hatena.ne.jp/midori_kasugano/20090521/1242975139

print <<"HTML";
<html>
<head>
<script src="http://maps.google.com/maps?file=api&amp;v=2&amp;sensor=true_or_false&amp;key=ABQIAAAAXhkFw77aLRSh_UNrhJEHART2yXp_ZAY8_ufC3CFXhHIE1NvwkxRkGUIY1TSG7kQX0tzrz-PT5M-uEw" type="text/javascript"></script>
<script type="text/javascript">

    function initialize() {
      if (GBrowserIsCompatible()) {
        var map = new GMap2(document.getElementById("map_canvas"));
HTML

my $shop = $res->{results}{shop}[0];
my $lat = $shop->{lat};
my $lng = $shop->{lng};

print "map.setCenter(new GLatLng($lat, $lng), 10);\n";

foreach my $shop (@{$res->{results}{shop}}){
   print qq(
var point = new GLatLng($shop->{lat},$shop->{lng});
var marker = new GMarker(point);
map.addOverlay(marker);
marker.bindInfoWindow(document.createTextNode("$shop->{name}"));
);
   #print "var point = new GLatLng($shop->{lat},$shop->{lng});\n";
   #print "map.addOverlay(new GMarker(point));\n";
   #print "marker.openInfoWindow(point, document.createTextNode(\"HELLO\"));\n";
}


print <<"HTML2";

      }
    }

    </script>