0

大陸のみを表示するためにズーム 1 または 2 を使用しようとすると、画面が何度も複製され、大陸が画面内で繰り返されます。（画面は3コマに分割）

画面上で制御して、大陸を 1 回だけ表示し、重複しないようにすることはできますか?

よろしく、

ヨッシー

4

2 に答える 2

1

あなたが説明していることは正常です。これは、Google マップが非常に低いズーム レベルを処理する方法です。また、すべての大陸を表示するために、世界規模のズームでマップを開始します。もう 1 つの要因は、ユーザーの画面解像度です。最初はズーム レベル 3 でマップを開始しましたが、画面解像度の設定が低い一部のユーザーは、マップが最初に読み込まれたときに、マップに配置されたすべてのものを表示できないことが判明しました。そのため、ズーム 2 から始めます。より高い画面解像度を使用するユーザーは、端で世界地図が重複して表示される可能性があることを理解しています。

于 2012-05-21T14:48:00.387 に答える
0

ハックを書いてください！ズーム 0 の例を次に示します (ページを表示するときは、1 回ズームアウトします)。

メカニズムは、ズームの変更をリッスンし、低ズームで 2 つの絶対位置の灰色の div (両側に 1 つ) を有効にして「重複」をカバーすることです。実際には固定幅のマップが必要です。また、ズーム 1 と 2 用に新しい div のペアが必要になります。

大きな欠点は、コントロールが div によってカバーされ、それらを中央に配置するのが見苦しいことです (試してみました)。マップの右半分だけを隠すこともできますが、効果も見栄えがよくありません。（こちらをご覧くださいhttp://jsbin.com/ijojip/3/edit#preview）

    google.maps.event.addListener(map, 'zoom_changed', function() {
      if(map.getZoom() == 0) {
        document.getElementById("leftcover").style.display = "block";
        document.getElementById("rightcover").style.display = "block";
      }
      else {
        document.getElementById("leftcover").style.display = "none";
        document.getElementById("rightcover").style.display = "none";
      }
    });

    #leftcover { position: absolute; height: 100%; background-color: #e5e3df; left: 0px; width: 128px; z-index: 2; display: none }
    #rightcover { position: absolute; height: 100%; background-color: #e5e3df; left: 384px; width: 128px; z-index: 2; display: none }
于 2012-05-22T15:53:00.563 に答える