Google Maps API を使用してカスタムのインタラクティブ マップを構築しようとしています。カスタム マップ タイルを作成し、ポップアップ情報ボックスを使用してカスタム マーカーを追加しました。ただし、マーカーが繰り返されるため、マップの境界を制限したいと考えました。私は厳密な境界を使用していくつかの成功を収めました...
var strictBounds = new google.maps.LatLngBounds(
new google.maps.LatLng(-10, -10),
new google.maps.LatLng(10, 10)
);
google.maps.event.addListener(map, 'drag', function()
{
if (strictBounds.contains(map.getCenter())) return;
// We're out of bounds - Move the map back within the bounds
var c = map.getCenter(),
x = c.lng(),
y = c.lat(),
maxX = strictBounds.getNorthEast().lng(),
maxY = strictBounds.getNorthEast().lat(),
minX = strictBounds.getSouthWest().lng(),
minY = strictBounds.getSouthWest().lat();
if (x < minX) x = minX;
if (x > maxX) x = maxX;
if (y < minY) y = minY;
if (y > maxY) y = maxY;
map.setCenter(new google.maps.LatLng(y, x));
});
ただし、問題は、デフォルトのレベル 2 で希望どおりに機能することですが、レベル 5 にズームすると、そのレベルでパンを制限する値は同じままです。低いズーム レベルでレベル 5 の LatLong 境界までパンできるようにしたいのですが、これを行う方法はありますか? たとえば、ズーム レベルが変更されたときに、コードでこれらの境界を増減させますか?
すべてが理にかなっていることを願って、
ありがとうございました。