Google Map APIを使ってみました。マップ(地図)から記事を探せます。

前々から触ってみたいと思っていた、
Google Map APIで遊んでみました。

右サイドにKubolog Food mapということで並んでいます。

参考にさせていただいたサイトはココ。
http://www.geekpage.jp/web/google-maps-api/

マーカーを押して
ふきだしをだしてそこに記事の
リンクがあるというものを作りました。
更新がかなり手間ですが、、、

ソースは
こんな感じです。

----------------------------------
<div id="map" style="width:185px; height:270px"></div>
↑地図の大きさを決める

if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map"));
map.addControl(new GSmallMapControl());
var point = new GLatLng(35.69445848270644, 139.758882522583);
map.setCenter(point, 15);

//kizan
var mp = new GLatLng(35.69409252257344, 139.75605010986328);
var marker = new GMarker(mp);
map.addOverlay(marker);

↑マーカーの部分

//kizan
GEvent.addListener(marker, 'click', function() {
marker.openInfoWindowHtml("【 KIZAN 喜山 】 食べ放題<br /><a href='http://www.evolverdesign.com/kubolog/2006/04/_in_kizan.html'>このお店の記事へ</a>");
});
↑ふきだしの部分
----------------------------------

About
Contact

過去の記事