ナメサメカリンチョ

<script src="http://maps.google.com/maps?file=api&v=2&key=???" type="text/javascript"> </script> <script type="text/javascript" src="http://yourcite.com/script/gmap/gmap_polyline_xml.php?date=20080705"> </script> <div class="gcontent"> <div id="gmaps_20080705" class="gmaps">Now loading Google Maps...</div> <div id="gmapnavi_20080705" class="gmapnavi">Now loading...</div> </div>

<?php the_date('Ymd') ?>

<?php header("Content-type: application/x-javascript"); echo "if (GBrowserIsCompatible()) { var gmapnavi_html_";echo $_GET['date'];echo " = ''; var gmarkers = []; var htmls = []; var i = 0; // 地点指示板の共通値 var baseIcon = new GIcon(); baseIcon.shadow = 'http://www.google.com/mapfiles/shadow50.png'; baseIcon.iconSize = new GSize(20,34); baseIcon.shadowSize = new GSize(37,34); baseIcon.iconAnchor = new GPoint(9,34); baseIcon.infoWindowAnchor = new GPoint(9,2); baseIcon.infoShadowAnchor = new GPoint(18,25); // 地点指示板、情報窓、サイドバー。html が情報窓の中身、name がサイドバーの中身、n が地点指示板の中の数字。 function createMarker_";echo $_GET['date'];echo "(point, html, name, n) { var icon = new GIcon(baseIcon); icon.image = 'http://yourcite.com/img/gmap/marker-' + [n] + '.png'; var marker = new GMarker(point, icon); GEvent.addListener(marker, 'click', function() { marker.openInfoWindowHtml(html); }); gmarkers[i] = marker; htmls[i] = html; gmapnavi_html_";echo $_GET['date'];echo " += '<a href=\"javascript:myclick(' + i + ')\">' + n + ' ' + name + '<\/a><br />'; i++; return marker; } function myclick(i) { gmarkers[i].openInfoWindowHtml(htmls[i]); } // 基本記述 function gmap_polyline_xml() { var map = new GMap2(document.getElementById('gmaps_";echo $_GET['date'];echo "')); map.setCenter(new GLatLng(36.527295, 139.888916), 6); // 初期中心座標と初期縮尺 map.addControl(new GSmallZoomControl(), new GControlPosition(G_ANCHOR_BOTTOM_LEFT, new GSize(68,5))); // 縮尺操作ボタン小とその位置 map.addControl(new GMapTypeControl(), new GControlPosition(G_ANCHOR_BOTTOM_LEFT, new GSize(88,22))); // 地図種類変更ボタンとその位置 map.addControl(new GScaleControl(300), new GControlPosition(G_ANCHOR_BOTTOM_LEFT, new GSize(3,45))); // 縮尺目盛とその大きさ、位置 map.addControl(new GOverviewMapControl(new GSize(100,100))); // 広域図とその大きさ // XML の呼出 var request = GXmlHttp.create(); request.open('GET', 'http://yourcite.com/script/gmap/coordinate/";echo $_GET['date'];echo ".xml', true); request.onreadystatechange = function() { if ((request.readyState == 4) && (request.status == 200)) { var xmlDoc = request.responseXML; // マーカーの座標や名前などの読み出し var markers = xmlDoc.documentElement.getElementsByTagName('marker'); for (var i = 0; i < markers.length; i++) { var latlng = markers[i].getAttribute('latlng'); var latlng = latlng.split(','); var lat = parseFloat(latlng[0]); var lng = parseFloat(latlng[1]); var point = new GLatLng(lat,lng); var html = markers[i].getAttribute('html'); var name = markers[i].getAttribute('name'); var n = markers[i].getAttribute('n'); var marker = createMarker_";echo $_GET['date'];echo "(point,html,name,n); map.addOverlay(marker); } document.getElementById('gmapnavi_";echo $_GET['date'];echo "').innerHTML = gmapnavi_html_";echo $_GET['date'];echo "; // 折れ線の座標や色などの読み出し var lines = xmlDoc.documentElement.getElementsByTagName('line'); for (var a = 0; a < lines.length; a++) { var color = lines[a].getAttribute('color'); var width = parseFloat(lines[a].getAttribute('width')); var opacity = parseFloat(lines[a].getAttribute('opacity')); var points = lines[a].getElementsByTagName('point'); var pts = []; for (var i = 0; i < points.length; i++) { var latlng = points[i].getAttribute('latlng'); var latlng = latlng.split(','); var lat = parseFloat(latlng[0]); var lng = parseFloat(latlng[1]); pts[i] = new GLatLng(lat,lng); } map.addOverlay(new GPolyline(pts, color, width, opacity)); } // 中心座標の読み出し var center = xmlDoc.documentElement.getElementsByTagName('center'); var latlng = center[0].getAttribute('latlng'); var latlng = latlng.split(','); var lat = parseFloat(latlng[0]); var lng = parseFloat(latlng[1]); var point = new GLatLng(lat,lng); map.setCenter(point, parseInt(center[0].getAttribute('zoom'))); } // if ((request.readyState } // request.onreadystatechange request.send(null); } // function gmap_polyline_xml if (window.addEventListener) { // for W3C DOM window.addEventListener('load', gmap_polyline_xml, false); } else if (window.attachEvent) { // for IE window.attachEvent('onload', gmap_polyline_xml); } else { window.onload = gmap_polyline_xml; } } // if (GBrowserIsCompatible()) window.onunload = GUnload; "; ?>

<?xml version="1.0" encoding="utf-8"?> <markers> <center latlng="36.527295, 139.888916" zoom="8" /> <marker latlng="35.653705, 139.410292" html="出発 八王子" name="出発" n="1" /> <marker latlng="37.467637, 139.962730" html="東山温泉 東山グランドホテル" name="東山温泉" n="2" /> <line color="#ff0000" width="2" opacity="0.5"> <point latlng="35.653705, 139.410292" /> <point latlng="35.653966, 139.410592" /> </line> </markers>