Heim > Web-Frontend > js-Tutorial > Wie kann ich Google Maps V3 auf ein bestimmtes geografisches Gebiet und eine bestimmte Zoomstufe beschränken?

Wie kann ich Google Maps V3 auf ein bestimmtes geografisches Gebiet und eine bestimmte Zoomstufe beschränken?

Barbara Streisand
Freigeben: 2024-10-18 19:55:31
Original
1016 Leute haben es durchsucht

How to Limit Google Maps V3 to a Specific Geographic Area and Zoom Level?

Einschränken des sichtbaren Bereichs und der Zoomstufe in Google Maps V3

Benutzer können auf Szenarien stoßen, in denen es notwendig wird, Google Maps V3 auf bestimmte geografische Gebiete zu beschränken Grenzen und schränken die Zoomfunktionen ein. In diesem Artikel wird eine Lösung untersucht, um die Kartenanzeige auf ein bestimmtes Gebiet (z. B. ein Land) zu beschränken und gleichzeitig zu verhindern, dass Benutzer über dessen Grenzen hinaus navigieren. Darüber hinaus wird erläutert, wie Sie die Zoomstufe auf einen vordefinierten Bereich beschränken können.

Um dies zu erreichen, bietet Google Maps V3 die Optionen minZoom und maxZoom. Durch die Angabe dieser Parameter können Sie die für den Benutzer zulässigen minimalen und maximalen Zoomstufen festlegen.

Beispiel:

var map;
var opt = { minZoom: 6, maxZoom: 9 };
map = new google.maps.Map(document.getElementById('map-canvas'), opt);
Nach dem Login kopieren

Der obige Code stellt sicher, dass Benutzer nur die Zoomstufen festlegen können Zoomen Sie die Karte in den Stufen 6 bis 9 inklusive. Diese Lösung behebt jedoch nur die Einschränkung der Zoomstufe. Um den sichtbaren Bereich auf einen bestimmten Bereich zu beschränken, sind weitere Anpassungen erforderlich. Durch Anpassen der Kartenstile mithilfe von StyledMaps kann dieses Ziel erreicht werden.

Beispiel:

var map;
var styles = [
  {
    "elementType": "geometry",
    "stylers": [
      {
        "visibility": "off"
      }
    ]
  },
  {
    "featureType": "administrative.country",
    "elementType": "geometry.stroke",
    "stylers": [
      {
        "visibility": "on"
      }
    ]
  }
];

map = new google.maps.Map(document.getElementById('map-canvas'));
map.setOptions({
  styles: styles,
  minZoom: 6,
  maxZoom: 9
});
Nach dem Login kopieren

Mit diesem Code werden alle geografischen Merkmale außerhalb des angegebenen Landes unsichtbar gemacht, was eine effektive Einschränkung bewirkt den sichtbaren Kartenbereich für dieses Land. Außerdem wird die minimale und maximale Zoomstufe auf 6 bzw. 9 festgelegt.

Das obige ist der detaillierte Inhalt vonWie kann ich Google Maps V3 auf ein bestimmtes geografisches Gebiet und eine bestimmte Zoomstufe beschränken?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage