Karte und Kamera steuern

Es kann sinnvoll sein, den Schwenk der Kamera oder die maximale Höhe zu steuern oder Breiten- und Längengradgrenzen zu erstellen, die die Bewegung eines Nutzers auf einer Karte einschränken. Sie können dazu die Kameraeinschränkungen verwenden.

Das folgende Beispiel zeigt eine Karte, auf der Standortgrenzen festgelegt sind, um die Kamerabewegung zu begrenzen:

Kartengrenzen einschränken

Sie können die geografischen Grenzen der Kamera einschränken, indem Sie die Option bounds festlegen.

Im folgenden Codebeispiel wird das Einschränken der Kartengrenzen veranschaulicht:

async function init() {
  const { Map3DElement, MapMode } = await google.maps.importLibrary("maps3d");

  const map = new Map3DElement({
    center: { lat: 37.7704, lng: -122.3985, altitude: 500 },
    tilt: 67.5,
    mode: MapMode.HYBRID,
    bounds: {south: 37, west: -123, north: 38, east: -121}
  });

init();
}

Kamera einschränken

Du kannst die Bewegung der Kamera einschränken, indem du eine der folgenden Optionen festlegst:

  • maxAltitude
  • minAltitude
  • maxHeading
  • minHeading
  • maxTilt
  • minTilt

Das folgende Codebeispiel zeigt, wie die Kamera eingeschränkt wird:

async function init() {
  const { Map3DElement, MapMode } = await google.maps.importLibrary("maps3d");

  const map = new Map3DElement({
    center: { lat: 37.7704, lng: -122.3985, altitude: 500 },
    tilt: 67.5,
    mode: MapMode.HYBRID,
    minAltitude: 1,
    maxAltitude: 1000,
    minTilt: 35,
    maxTilt: 55
  });

 document.body.append(map);
}

init();

Karten- und Kameragrenzen einschränken

Sie können gleichzeitig sowohl Karten- als auch Kameragrenzen einschränken. Im folgenden Codebeispiel wird gezeigt, wie Karten- und Kameragrenzen eingeschränkt werden:

async function init() {
  const { Map3DElement, MapMode } = await google.maps.importLibrary("maps3d");

  const map = new Map3DElement({
    center: { lat: 37.7704, lng: -122.3985, altitude: 500 },
    tilt: 67.5,
    mode: MapMode.HYBRID,
    minAltitude: 1,
    maxAltitude: 1000,
    minTilt: 35,
    maxTilt: 55,
    bounds: {south: 37, west: -123, north: 38, east: -121}
  });

 document.body.append(map);
}

init();