ドラッグ操作とズーム機能

[suzuki.y]

地図上でドラッグ機能を無効にしつつ、マウスをダブルクリックすると新しいウィンドウがでて、その地図の拡大画像を表示することは可能でしょうか？

disableDragging()無効（ドラック可能）にすると、ダブルクッリク拡大はできますが、ドラッグができないときズームはできませんでし
た。

[Masashi.K]

ちょっと形は違うかもしれませんが、GMap2().showMapBlowup とかではダメですか？

[suzuki.y]

showmapblowupだと、吹き出しで拡大なり縮小なりの画像がでるみたいですね。吹き出しもいいですが、やはり新しいウィンドウなり、別のフ
レーム等で拡大画像を出したいと思ってます。そうなりますと、クリックした場所の座標をそのまま新しいウィンドウが引き継ぐという形になりますね。

ほかに、ズームについてですが、ズーム機能はユーザー指定で設定することは可能でしょうか？ユーザーから指定されたズームレベルで（例えば、レベル１０
とします）そして、ダブルクリックするとレベルが１１になり、またダブルクリックすると１０に戻るという機能はできますか？

[hiroaki]

suzuki.y さん

GMap2 のインスタンスに dblclick イベントを付け、そのハンドラで新しいウィンドウを開けばいいですね。

それから「クリックした場所の座標をそのまま新しいウィンドウが引き継ぐ」と考えるよりは、新しいウィンドウ（またはそのウィンドウのなんらかのオブ
ジェクト）に座標の情報を与えてやることにするとやりやすいと思います。

ズームはユーザが指定した値を GMap2.setZoom() に渡してあげればいいだけですし、 10 にしたり 11 にしたりするのも、現在の
ズームレベルを保持しておいてそれを判断させればいいでしょう。

いずれにしてもとくに難しい事はないのでやってみたらいいと思います。そのものズバリの機能はないので、組み合わせです。

Google Maps API リファレンス - Google Maps API - Google Code
http://code.google.com/intl/ja/apis/maps/documentation/reference.html#GMap2


> ダブルクッリク拡大はできますが、ドラッグができないときズームはできませんでした。

ところで、これの意図が分からないです。拡大とズームは違う事なのですか？　ズーム・アウトなら、ダブルクリックでは、そのままではできないですね。
dbclick イベント・ハンドラーに処理を書けばできるでしょう。

[yoko suzuki]

回答ありがとうございます。setzoomかgetzoomでできるかなとは考えていたので、いろいろ組み合わせてやってみます。

> ダブルクッリク拡大はできますが、ドラッグができないときズームはできませんでした。

↑の件ですが、disabledraging()を有効にさせないかぎり、画像上のマウスは「手」の形になっていて、ドラッグなり、拡大なりできます。しかし、disabledraggingが有効なとき、ドラッグができないのは当たり前ですが、ダブルクリックしてもズームはできせんでした。

[hiroaki]

いま試してみたのですが、 disableDragging() すると、 dblclick イベントが働かなくなりますね。
このことはドキュメントには載っていないようなので、もしかすると API 提供者の想定にはない動作である可能性も、あるかもしれません（？）。

ともあれ、この状況では、私が先に述べたようなアプローチでは、すんなりとはできませんね... 。
言い出した手前もあるので、なんとかしてみたのですが、参考になりますでしょうか。サンプルを書きました：

http://homepage.mac.com/hwat/maps/GoogleGroups/thread-3fd5b709f604c0bc/dblclickopen.html

disableDragging() に dblclick イベントが使えなくなってしまう副作用があるため、 disableDragging
() はせずに、 GMap2 のインスタンスの drag イベントを補足して、地図を固定させるように工夫しています。

[hiroaki]

すみません、サンプルはリンクで開かず、 URL をコピー＆ペーストして、開いてください。

> http://homepage.mac.com/hwat/maps/GoogleGroups/thread-3fd5b709f604c0bc/dblclickopen.html

サンプルでは、 window.opener を条件判定に用いているためです。親ウィンドウとして開いてください。

On 8月22日, 午後3:41, hiroaki <hwatatt...@gmail.com> wrote:
> いま試してみたのですが、 disableDragging() すると、 dblclick イベントが働かなくなりますね。
> このことはドキュメントには載っていないようなので、もしかすると API 提供者の想定にはない動作である可能性も、あるかもしれません（？）。
>
> ともあれ、この状況では、私が先に述べたようなアプローチでは、すんなりとはできませんね... 。
> 言い出した手前もあるので、なんとかしてみたのですが、参考になりますでしょうか。サンプルを書きました：
>

> http://homepage.mac.com/hwat/maps/GoogleGroups/thread-3fd5b709f604c0b...

[yoko suzuki]

ありがとうございます！このコードを参考にしたいのですが、可能でしょうか？

[hiroaki]

参考にしてください。
# 少々書き直しました。リンクから開いても（親ウィンドウとして開かなくても）よくしました。

私のサンプルは、新規ウィンドウ（ダブルクリックで現れる、拡大された子ウィンドウの地図）の URL について、開く元と同じ HTML の
URL を指定していますが、もちろん別の HTML でもいいものですので、そのへんは yoko suzuki さんの要件に合わせて書き換えてく
ださい。

ポイントは GMap2 の dragstart, drag および dragend イベントで工夫したところです。
そのほかはみな JavaScript の話ですね。


On 8月23日, 午前3:56, yoko suzuki <sun1014ch...@gmail.com> wrote:
> ありがとうございます！このコードを参考にしたいのですが、可能でしょうか？

[yoko suzuki]

ありがとうございます。大変参考になります。自分なりにアレンジした際には、アップさせていただきます。

[yoko suzuki]

リンクを参考にして自分なりにプログラミングしてみたのですが、GClientGeocoder()を入れると動かなくなってしまうのですが、

このリンクに住所の検索機能はつけれますでしょうか？

[hiroaki]

何かをしたら GClientGeocoder を付けられなくなる、という情報は目にした事はありません（ただし私は
GClientGeocoder を使った事はないですから、その視野は狭いものです）。したがって付けられるんじゃないでしょうか、特別な事はしてい
ませんから。

ドキュメントをよく読んでみてください。
http://code.google.com/intl/ja/apis/maps/documentation/reference.html#GClientGeocoder

エラーは出ていたりしませんか？　もし出ていれば、コードをよく見直してください。
エラーが出ていてかつ、修正に悩むようでしたら、ソースの URL を提示して頂けると、悪い箇所を指摘できるかもしれません。


On 8月25日, 午後7:39, yoko suzuki <sun1014ch...@gmail.com> wrote:
> リンクを参考にして自分なりにプログラミングしてみたのですが、GClientGeocoder()を入れると動かなくなってしまうのですが、
> このリンクに住所の検索機能はつけれますでしょうか？

[yoko suzuki]

以下のコードを付け足したのですが、住所の検索ができません。お手数ですが、よろしくお願いいたします

これ以前のコードは参考にさせてもらったのと同じです。

GEvent.addDomListener(window,'load',function (){

this.app = new App('map', 35.6841306, 139.774103);

if( this.opener && this.opener.app instanceof this.opener.App ){

// 'dblclick' is also disabled in a new window.

// the method disableDragging() disables 'dblclick', and it is expected here.

this.app.map.disableDragging();

// this.app.map.setMapType(G_SATELLITE_MAP);

this.app.map.setCenter(

new GLatLng( this.opener.app.lat_on_dblclick, this.opener.app.lng_on_dblclick ),

App.zoom_detail );

// initialize GClienetGeococer()

var geocoder = new GClientGeocoder();

}

});

GEvent.addDomListener(window,'unload',function (){

GUnload();

});

function moveAddress(address){

geocoder.getLatLng(address, showMap);

}

　function showMap(latlng){

if (latlng){

map.setCenter(latlng, 10);

var marker = new GMarker(latlng);

}else{

alert("Can't change the address to its cordinates");

}

} // end showmap

</script>

</head><body bgcolor="#92C7C7">

<b> enter an address of interest:</b>

<form onsubmit="moveAddress(this.address.value); return false">

<input type="text" size="40" name="address" value="" />

<input type="submit" value="search" />

</form>

<div id="map" style="width:335px; height:335px;"></div>

</body></html>

[hiroaki]

まっさきに目についたのは、関数 moveAddress の中の変数 geocoder です。その変数は、その数行上で行った var
geocoder = new GClientGeocoder(); の変数 geocoder とは何の関わりもありません。オブジェクトでもあ
りませんから、メソッド getLatLng() も実行できません。つまり検索ができない状態です。

私のサンプルを更新して、 GClientGeocoder を使うようにしてみましたので、参考にしてください。ただしその前
に、"JavaScript スコープ" で検索するか、手元の JavaScript の参考書を開いて、プライベート変数が有効である範囲を知っ
てください。これは Google Maps API の話ではないですね。

（コードの断片をメッセージに貼付けるのではなく、ページの URL を示すようにしてください。レイアウトが崩れない状態で、 HTML を含めたす
べてを見る必要がありますから。）

[yoko suzuki]

ありがとうございました。自分のやりたいことができたので満足してます。

最後に一つ気になることがあるのですが、地図を検索したあとダブルクリックで拡大図を別のウィンドウでだすと、親ウィンドウの地図が元の詮索前の地図になってしまうのは、google mapsの機能でしょうか？

[hiroaki]

「地図を検索したあとダブルクリックで拡大図を別のウィンドウでだすと、親ウィンドウの地図が元の詮索前の地図に」という機能は、 Google
Maps の機能（？）ではありますね。その API を用いて、そういう動作をする書き方をしている（若しくは、してしまっている）のですから。ほか
に、何の機能だと思いますか？

──元の位置に戻らない動作をさせたいのであれば、そのように修正するだけの事です。私のサンプルでいえば、 moveend イベントのハンドラ
で、 App オブジェクトのプロパティ fixed_center の値を地図の中心位置の値で更新する処理を書き足してください。


On 8月27日, 午後5:26, yoko suzuki <sun1014ch...@gmail.com> wrote:
> ありがとうございました。自分のやりたいことができたので満足してます。最後に一つ気になることがあるのですが、地図を検索したあとダブルクリックで拡大図を別 のウィンドウでだすと、親ウィンドウの地図が元の詮索前の地図になってしまうのは、google
> mapsの機能でしょうか？

[yoko suzuki]

moveendイベントで検索後の地図も固定できるようになりました。ありがとうございます。