ズームレベルによってのTLableの制御について

19 views
Skip to first unread message

フェラーリ

unread,
Jul 3, 2009, 1:07:52 AM7/3/09
to Google-Maps-API-Japan
ズームレベルによって、TLbelで設定された文字列の位置の書き換えを行ないたいと考えています。

ソースは下記の様に行っています。

var map;
function load(){
var lat=35.68079483220707;
var lng=139.76662874221802;
var c_lat=35.68574469022577;
var c_lng=139.75218772888184

if (GBrowserIsCompatible()) {
map = new GMap2(document.getElementById("map"));
map.addControl(new GSmallMapControl());
map.setCenter(new GLatLng(c_lat, c_lng), 14);

var set_contents = '<div style= "white-space: nowrap;font-size:
70%;font-weight: bolder;color: black; background-olor:white;width:
auto;">'+ '東京駅' +' </div>';
var latlng= new GLatLng(lat,lng);
var label = new TLabel();

label.id= 'tokyo_station' ;
l label.anchorLatLng = latlng;
label.anchorPoint = 'topCenter';
label.markerOffset = new GSize(0,0);
label.content = set_contents;
label.percentOpacity = 80;
map.addTLabel(label);

GEvent.addListener(map, "zoomend", checkZoom);
 }
}
function checkZoom(oldZoom, newZoom) {
var zoom = map.getZoom();
var latlng;
var content ;

if (zoom == 15) {
latlng=new GLatLng(35.67079483220707,139.76662874221802);
var set_contents = '<div style= "white-space: nowrap;font-size:
70%;font-weight: bolder;color: black; background-olor:white;width:
auto;">'+ '東京駅' +' </div>';
var latlng= new GLatLng(lat,lng);
var label = new TLabel();

label.id= 'tokyo_station' ;
label.anchorLatLng = latlng;
label.anchorPoint = 'topCenter';
label.markerOffset = new GSize(0,0);
label.content = set_contents;
label.percentOpacity = 80;
map.addTLabel(label);

}
}

以上のようなイメージで実行したところ、
ズームアップ後の表示で、指定している場所と異なる部分に
ラベルが表示されてしまいます。

TLabelの使い方が間違っているかも知れませんが、
どなたかアドバイスをお願いいたします。



Masashi.K

unread,
Jul 3, 2009, 1:30:39 AM7/3/09
to Google-Maps-API-Japan
>フェラーリさん

ズームレベルによって表示制御したいなら、GMarkerManager を使うと簡単ですよ。
ただ、TLabel.js は GMarkerManager に対応していないので、
同じような機能の LabeledMarker と組み合わせるのがオススメですよ。

LabeledMarker
http://gmaps-utility-library.googlecode.com/svn/trunk/labeledmarker/

フェラーリ

unread,
Jul 3, 2009, 5:04:37 AM7/3/09
to Google-Maps-API-Japan
Masashi.K さん

On 7月3日, 午後2:30, "Masashi.K" <wf9a5...@gmail.com> wrote:
> >フェラーリさん
>
> ズームレベルによって表示制御したいなら、GMarkerManager を使うと簡単ですよ。
> ただ、TLabel.js は GMarkerManager に対応していないので、
> 同じような機能の LabeledMarker と組み合わせるのがオススメですよ。

そうなんです。TLabel.js が GMarkerManagerに対応していないようなので、
自分で制御を行うと考えました。

LabeledMarkerはオライリーの[google maps hacks]に記載いたので、一瞬考えたのですが、ラベルからウンドウを開くわけ
ではないでの、用途としては違うかなと
思っていました。

制御を考えるとありですね。

素朴な疑問ですが、画像をオリジナル画像で使用しないのであればマーカ機能と
LabeledMarkerの違いはあるのでしょうか。

一つあるとするとマーカー機能では、影の画像が用意できるので見た目はよいと
思います。



Masashi.K

unread,
Jul 3, 2009, 12:17:48 PM7/3/09
to Google-Maps-API-Japan
> 素朴な疑問ですが、画像をオリジナル画像で使用しないのであればマーカ機能と
> LabeledMarkerの違いはあるのでしょうか。
>
> 一つあるとするとマーカー機能では、影の画像が用意できるので見た目はよいと
> 思います。

それもあるかとは思いますが、基本的にはマーカーを拡張しているだけなので、
アイコンを指定しないなら、通常のマーカーとほぼ同じですね。
Reply all
Reply to author
Forward
0 new messages