[GMapsJ:2670] Google Mapsを無限スクロールさせない方法を探しています。

[OHTSUKA Ko-hei]

おはようございます。

Google Mapsはスクロールさせれば東西南北どこまででもスクロールでき、東西は繋がってしまっていますが、
東西を繋がらないように（東経西経180°より向こうはグレータイル）し、またタイルの存在範囲外はスクロール
できないようにしたいと思っています。

いろいろ自分で試してみてはいるのですが、考えてみればよくありそうなユースケースなので、もしかすれば
既知のやり方があるのではないか（極端な話、実はプロパティ設定一つでできるとか？）と思い、質問してみます。
ご存知の方おられましたら、教えていただければ幸いです。

よろしくお願いいたします。

＃ちなみに、自分で試したのは、まだ範囲外をグレータイル化するところだけですが、以下のような感じです。
＃
＃・既存地図のMapTypeのクラスを継承して、範囲外ではグレータイルを返すgetTileを備えたクラスを作ろうとした
＃　⇒既存地図のクラス名が判らず挫折

--
このメールは Google グループのグループ「Google-Maps-API-Japan」の登録者に送られています。
このグループに投稿するには、google-map...@googlegroups.com にメールを送信してください。
このグループから退会するには、google-maps-api-...@googlegroups.com にメールを送信してください。
詳細については、http://groups.google.com/group/google-maps-api-japan?hl=ja からこのグループにアクセスしてください。

[YON]

グレータイル化する以外の方法として、ぱっと思いつきました。
mapのdrag()とかdragend()のイベントを監視して、map中心点が制限範囲以外になった時、
強制的に、map.panTo()とかmap.setCenter()で端っこに戻すとか、
map.disableDragging() でいったんドラッグ禁止にして、再びmapがクリックされたら
map.enableDragging()で解除するとか、どうでしょうか。
何か動きががくがくしそうですが．．．

[YON]

早速試してみました。
drag()のイベントでなくmove()のイベントの方がよかったです。
見事とまではいかないですが、それほどギクシャクしませんでした。
GEvent.addListener(map, "move", function(){
if (map.getCenter().lng()>139){
map.setCenter(new GLatLng(map.getCenter().lat(),139));
}
});
だけです。
東経139度以東に遷移できません。

[YON]

グレータイル化については、GTileLayer(),GTileLayerOptionsやGTileLayerOverlay()
のインターフェースを使ってカストマイズできますが、
http://code.google.com/intl/ja/apis/maps/documentation/reference.html#GTileLayer
透明度0のグレーのGPolygonをオーバーレーで配置しておくだけでよいような気がします。

[OHTSUKA Ko-hei]

おはようございます。

オーバーレイを使うのは、書かれた地図を上から消す形になるので、レイテンシが発生すると
見た目がしょぼくなりそうなので嫌だったのですが、実際に試してみると、それほど問題なさ
そうだったので、とりあえずはこれでやってみます。
ありがとうございました。

実際のコードイメージ：

function MaskMapType() {
}
MaskMapType.prototype.tileSize = new google.maps.Size(256,256);
MaskMapType.prototype.createTransparentTile = function(ownerDocument){
var div = ownerDocument.createElement('DIV');
div.style.width = this.tileSize.width + 'px';
div.style.height = this.tileSize.height + 'px';
return div;
}
MaskMapType.prototype.createBlackTile = function(ownerDocument){
var div = this.createTransparentTile(ownerDocument);
div.style.backgroundColor = "#000000";
return div;
}
MaskMapType.prototype.getTile = function(coord, zoom, ownerDocument) {
var max = Math.pow(2,zoom) - 1;
if (!( coord.x < 0 || coord.x > max || coord.y < 0 || coord.y > max
)) return this.createTransparentTile(ownerDocument);
return this.createBlackTile(ownerDocument);
};

var map = new google.maps.Map(div,mapOptions);
map.overlayMapTypes.insertAt(0, new MaskMapType());


2010年4月23日14:21 YON <yyr...@gmail.com>:

--
HTHTHTHTHTHTHTHTHTHTHTHTHTHTHTHTHTHTHTHT

株式会社ATR-Promotions ミュージアムメディア事業部
プロデューサ
大塚　恒平

〒619-0228「けいはんな学術学研都市」光台2-2-2
　TEL：0774-95-2636　FAX：0774-95-1191
Mail：koht...@atr-p.com

HTHTHTHTHTHTHTHTHTHTHTHTHTHTHTHTHTHTHTHT

[OHTSUKA Ko-hei]

おはようございます。

moveイベントというのは、V3ではなくなっているんでしょうか？
drag系しか見当たらなかったので、dragendでやってみました。
中央で判定するというのはちょっと思い込みがきつすぎて思いつきませんでした。
zoom毎に動かせる範囲が異なるはずなので、Borderで判断しないと、と思っていましたが、
考えてみれば結局setCenter等で動かすのだから、中央で判断するのが合理的ですね。

実際のコードイメージ：

var adjust = function(){
var zm = map.zoom;
var div = map.getDiv();
var powZm = Math.pow(2,zm);
var hW = ( div.clientWidth / 2 ) / powZm;
var hH = ( div.clientHeight / 2 ) / powZm;
var center = map.center;
var cp = map.getProjection().fromLatLngToPoint(center);
var lX = hW;
var lY = hH;
var mX = 256 - hW;
var mY = 256 - hH;

var flg;
var x = cp.x;
var y = cp.y;
if ( div.clientWidth > 256 * powZm ) {
if ( lX > cp.x || mX < cp.x ) {
flg = 1;
x = Math.round(128);
}
} else if ( lX > cp.x ) {
flg = 1;
x = hW;
} else if ( mX < cp.x ) {
flg = 1;
x = 256 - hW;
}
if ( div.clientHeight > 256 * powZm ) {
if ( lY > cp.y || mY < cp.y ) {
flg = 1;
y = Math.round(128);
}
} else if ( lY > cp.y ) {
flg = 1;
y = hH;
} else if ( mY < cp.y ) {
flg = 1;
y = 256 - hH;
}
if (flg) {
map.setCenter(map.getProjection().fromPointToLatLng(new
google.maps.Point(x,y)));
}
};
google.maps.event.addListener(map,"dragend",adjust);

2010年4月23日12:06 YON <yyr...@gmail.com>:

--
HTHTHTHTHTHTHTHTHTHTHTHTHTHTHTHTHTHTHTHT

株式会社ATR-Promotions ミュージアムメディア事業部
プロデューサ
大塚　恒平

〒619-0228「けいはんな学術学研都市」光台2-2-2
　TEL：0774-95-2636　FAX：0774-95-1191
Mail：koht...@atr-p.com

HTHTHTHTHTHTHTHTHTHTHTHTHTHTHTHTHTHTHTHT