ドラッグの処理

 地図を表示した際にドラッグして欲しくない場合があります。Yahoo Mapsではドラッグするかどうかも指定することができます。初期状態ではドラッグ可能になっています。ドラッグを禁止するにはdisableDragMap()メソッドを使います。(実際のサンプルを実行する

<html>
<head>
<title>sample</title>
<script type="text/javascript" src="http://api.maps.yahoo.com/ajaxymap?v=2.0&appid=openspaceYS"></script>
</head>
<body>
<div id="mapContainer" style="width:600px;height:600px"></div>
<script type="text/javascript">
var myPoint = new YGeoPoint(29, -97);
var map = new YMap(document.getElementById("mapContainer"));
map.drawZoomAndCenter(myPoint, 8);
map.disableDragMap();
</script>
</body>
</html>


 すでにドラッグ禁止になっているマップをドラッグ可能にするにはenableDragMap()メソッドを使います。(実際のサンプルを実行する

<html>
<head>
<title>sample</title>
<script type="text/javascript" src="http://api.maps.yahoo.com/ajaxymap?v=2.0&appid=openspaceYS"></script>
</head>
<body>
<div id="mapContainer" style="width:600px;height:600px"></div>
<script type="text/javascript">
var myPoint = new YGeoPoint(29, -97);
var map = new YMap(document.getElementById("mapContainer"));
map.drawZoomAndCenter(myPoint, 8);
function dragOn()
{
map.enableDragMap();
}
function dragOff()
{
map.disableDragMap();
}
</script>
<form>
<input type="button" value="ドラッグを可能にする" onClick="dragOn()">
<input type="button" value="ドラッグを禁止する" onClick="dragOff()">
</form>
</body>
</html>

 現在ドラッグ可能かどうかを調べることもできます。isDragMapEnabled()で調べることができますが、2006年2月28日現在、リファレンスの記述ミスか実装されていないのか動作しません。(実際のサンプルを実行する

<html>
<head>
<title>sample</title>
<script type="text/javascript" src="http://api.maps.yahoo.com/ajaxymap?v=2.0&appid=openspaceYS"></script>
</head>
<body>
<div id="mapContainer" style="width:600px;height:600px"></div>
<script type="text/javascript">
myPoint = new YGeoPoint(29, -97);
map = new YMap(document.getElementById("mapContainer"));
map.drawZoomAndCenter(myPoint, 8);
function dragOn()
{
map.enableDragMap();
}
function dragOff()
{
map.disableDragMap();
}
function dragCheck()
{
if (map.isDragMapEnabled())
{
document.getElementById("result").innerHTML = "ドラッグできます";
}else{
document.getElementById("result").innerHTML = "ドラッグできません";
}
}
</script>
<form>
<input type="button" value="ドラッグを可能にする" onClick="dragOn()">
<input type="button" value="ドラッグを禁止する" onClick="dragOff()"><br>
<input type="button" value="ドラッグ状態を調べる" onClick="dragCheck()">
<input type="text" size="24" id="result">
</form>
</body>
</html>

[第15章 サイズや位置を取得するへ]
[目次へ]

(2006.2.28)