I love iPhone, Android, Cocos2d-x
Posts tagged goolgemap
GoogleMap 特定のキーワードで表示させる
4Google AJAX Search API を使用してキーワードや住所から自分のサイトに Google Map を表示させるメモ
Google AJAX Search API KEY と Google Map API KEY を指定して JavaScript を読み込む
<script src="http://www.google.com/uds/api?file=uds.js&v=1.0&key=Google AJAX Search API KEY" type="text/javascript"></script> <script src="http://maps.google.com/maps?file=api&v=2.x&key=Google Map API KEY" type="text/javascript"></script>
実際の表示部分。 q=キーワードで表示させる地図のキーワード(または住所)を指定する。
<script type="text/javascript"> <!-- var gls; var gMap; function OnLocalSearch() { if (!gls.results) return; var first = gls.results[0]; var point = new GLatLng(parseFloat(first.lat), parseFloat(first.lng)); var zoom = 15; gMap.addControl(new GSmallMapControl()); gMap.addControl(new GMapTypeControl()); gMap.setMapType(G_MAP_TYPE); gMap.setCenter(point, zoom); var marker = new GMarker(point); gMap.addOverlay(marker); GEvent.addListener(marker, "click", function() { marker.openInfoWindowHtml(html); }); } function load() { gMap = new GMap2(document.getElementById("map")); gMap.addControl(new GSmallMapControl()); gMap.addControl(new GMapTypeControl()); gMap.setCenter(new GLatLng(0, 0)); gls = new GlocalSearch(); gls.setCenterPoint(gMap); gls.setSearchCompleteCallback(null, OnLocalSearch); var q = "横浜ランドマークタワー"; gls.execute(q); } //--> </script> <body onLoad="load()"> <div id="map" style="width: 410px; height: 320px"></div> </body>
各 API KEY の取得は下記ページから
Sign-up for an AJAX Search API Key – Google AJAX Search API – Google Code
Sign Up for the Google Maps API – Google Maps API – Google Code