Ajaxでホームページをつくろう














■YAHOO MAPの座標を取得します

これを使えば地図上でマーキングの位置が簡単に取得できます。何かと役に立つツールとなります。

上の「■ホームページにYAHOO MAPを設置する」と併せてお使いください。

サンプルはこちらです。

<html>
<head>
<title>YAHOOのMAPで座標を取得</title>
<script type="text/javascript" src="http://api.maps.yahoo.com/ajaxymap?v=2.0&appid=railwalker"></script>
<link href="./js/style.css" type="text/css" rel="stylesheet">
</head>
<body>
<h1>YAHOOのMAPで座標を取得する</h1>

<div id="mapContainer" style="width:800px;height:500px"></div>
<script type="text/javascript">
myPoint = new YGeoPoint(49.26458231510124,-123.10154646635055);
map = new YMap(document.getElementById("mapContainer"));
map.drawZoomAndCenter(myPoint, 11);
// Add a pan control
map.addPanControl();

// Add a slider zoom control
map.addZoomLong();

YEvent.Capture(map, EventsList.changeZoom, dispZoomLevel);
function dispZoomLevel()
{
n = map.getZoomLevel();
document.getElementById("zLevel").value = n;
}

YEvent.Capture(map, EventsList.MouseClick, dispBounds);
function dispBounds()
{
pointObj2 = map.getCenterLatLon();

document.getElementById("latMin").value = pointObj2.Lat;
//緯度を取得します document.getElementById("latMax").value = pointObj2.Lon;
//経度を取得します //document.getElementById("lonMin").value = pointObj.LonMin;
//document.getElementById("lonMax").value = pointObj.LonMax;
}

</script>

<form>
緯度:<input type="text" size="18" id="latMin"><br>
経度:<input type="text" size="18" id="latMax"><br>
</form>

<form>
倍率:<input type="text" size="18" id="zLevel">
</form>
</body>
</html>





       
mail:info @ a-jax.net