ポリライン上でポインタの形を変えたいのですが...

31 views
Skip to first unread message

maverik1226

unread,
Jan 28, 2009, 2:57:53 AM1/28/09
to Google-Maps-API-Japan
初歩的な事かもしれませんが、標記のことでハマっています。

マーカー上にマウスポインタを持っていった時の動きを、ポリラインでも行いたいのですが
下記のコードでは上手くいかないです。

GEvent.addListener(polyline, "mouseover", function() {
this.style.cursor="pointer"; ←「this.style...」はNullまたはオブジェクトではないエラー発生
});

this.styleをmap.styleに変えたりもしてみましたがダメでした。
何か良い方法を知ってる方がいらっしゃれば、お知恵を貸して下さい。

Masashi.K

unread,
Jan 29, 2009, 1:01:53 AM1/29/09
to Google-Maps-API-Japan
>maverik1226 さん

いろいろ調べてみましたが、残念ながら無理なようです。

「どうしても」というなら、GPolylineに代わるoverlayを自作するしかないです。
(あとはdocument.getElementsByTagName で補足するとか・・・)

maverik1226

unread,
Jan 29, 2009, 1:37:46 AM1/29/09
to Google-Maps-API-Japan
Masashi.K 様

レスありがとうございます。

>GPolylineに代わるoverlayを自作するしかないです。
うむむー、ハードル高そうですね。

ひとまずあきらめます、無理っぽいのが分かっただけでも収穫です。
お世話になりました。

hiroaki

unread,
Jan 29, 2009, 8:05:24 AM1/29/09
to Google-Maps-API-Japan
maverik1226 さん

GPolyline のオブジェクトは DOM ノードではないので CSS スタイルは付けられません。

しかし mouseover と mouseout イベントに反応しますから、そのイベントを捕まえて、
ポリラインの載っている DOM ノードに対して CSS スタイルの cursor に値を付ければよさそうです。

ポリラインの載っている DOM ノードは GMap2.getPane(G_MAP_OVERLAY_LAYER_PANE) で得られます。

サンプルを作りました。

http://homepage.mac.com/hwat/maps/GoogleGroups/thread-7d570e4e05f0c97f.html

Masashi.K

unread,
Jan 29, 2009, 10:59:28 AM1/29/09
to Google-Maps-API-Japan
>hiroakiさん

Good アイディアですね(^^)b

DOMノードをどうやって取得するか、ここの部分でつまづいたのですが
getPaneは見落としてました。

maverik1226

unread,
Jan 30, 2009, 5:15:07 AM1/30/09
to Google-Maps-API-Japan
hiroaki 様

レスありがとうございます。

> GPolyline のオブジェクトは DOM ノードではないので CSS スタイルは付けられません。
なるほど。

> しかし mouseover と mouseout イベントに反応しますから、そのイベントを捕まえて、
> ポリラインの載っている DOM ノードに対して CSS スタイルの cursor に値を付ければよさそうです。
> ポリラインの載っている DOM ノードは GMap2.getPane(G_MAP_OVERLAY_LAYER_PANE) で得られます。
GMapのDOM構造は、過去レスをみると非常に複雑そうなので、構造を取得して細工するのは諦めいたところでした。
サンプルまで作っていただき、感謝です。

maverik1226

unread,
Feb 2, 2009, 7:26:20 AM2/2/09
to Google-Maps-API-Japan
hiroaki 様

実装の報告を忘れていました、申し訳ありません。
下記のように実装し、順調に作動しております。ありがとうございました。
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- - - - -- - - - - - - - - - - - - - - -

//ポリラインにマウスが重なった時に、カーソルの形を変える
GEvent.addListener(polyline, "mouseover", function() {
map.getPane(G_MAP_OVERLAY_LAYER_PANE).style.cursor = 'move';
});

//ポリラインからマウスが離れた時に、カーソルの形を元に戻す
GEvent.addListener(polyline, "mouseout", function() {
map.getPane(G_MAP_OVERLAY_LAYER_PANE).style.cursor = 'auto';
});
Reply all
Reply to author
Forward
0 new messages