-
-
-
+
diff --git a/dist/samples/3d-places-autocomplete/docs/index.html b/dist/samples/3d-places-autocomplete/docs/index.html
index dbed561b..a1568da7 100644
--- a/dist/samples/3d-places-autocomplete/docs/index.html
+++ b/dist/samples/3d-places-autocomplete/docs/index.html
@@ -6,24 +6,23 @@
-->
-
-
-
Navigate to a place
-
-
-
-
+
diff --git a/dist/samples/3d-places-autocomplete/docs/index.js b/dist/samples/3d-places-autocomplete/docs/index.js
index 3c7f4388..cdc11f11 100644
--- a/dist/samples/3d-places-autocomplete/docs/index.js
+++ b/dist/samples/3d-places-autocomplete/docs/index.js
@@ -1,14 +1,14 @@
"use strict";
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
// @ts-nocheck
// [START maps_3d_places_autocomplete]
let map = null;
async function init() {
- const { Map3DElement } = await google.maps.importLibrary("maps3d");
+ const { Map3DElement } = await google.maps.importLibrary('maps3d');
map = new Map3DElement({
center: { lat: 0, lng: 0, altitude: 16000000 },
tilt: 0,
@@ -16,35 +16,41 @@ async function init() {
heading: 0,
roll: 0,
mode: 'HYBRID',
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
document.body.append(map);
initAutocomplete();
}
async function initAutocomplete() {
- const { PlaceAutocompleteElement } = await google.maps.importLibrary("places");
+ const { PlaceAutocompleteElement } = await google.maps.importLibrary('places');
const placeAutocomplete = new google.maps.places.PlaceAutocompleteElement();
placeAutocomplete.id = 'place-autocomplete-input';
const card = document.getElementById('pac-container');
card.appendChild(placeAutocomplete);
placeAutocomplete.addEventListener('gmp-select', async ({ placePrediction }) => {
const place = placePrediction.toPlace();
- await place.fetchFields({ fields: ['displayName', 'location', 'id'] });
+ await place.fetchFields({
+ fields: ['displayName', 'location', 'id'],
+ });
// If the place has a geometry, then present it on a map.
if (!place.location) {
- window.alert("No viewport for input: " + place.displayName);
+ window.alert('No viewport for input: ' + place.displayName);
return;
}
flyToPlace(place);
});
}
const flyToPlace = async (place) => {
- const { AltitudeMode, Polyline3DElement, Polygon3DElement, Marker3DElement } = await google.maps.importLibrary("maps3d");
+ const { AltitudeMode, Polyline3DElement, Polygon3DElement, Marker3DElement, } = await google.maps.importLibrary('maps3d');
const location = place.location;
// We need to find the elevation for the point so we place the marker at 50m above the elevation.
const elevation = await getElevationforPoint(location);
const marker = new Marker3DElement({
- position: { lat: location.lat(), lng: location.lng(), altitude: elevation + 50 },
+ position: {
+ lat: location.lat(),
+ lng: location.lng(),
+ altitude: elevation + 50,
+ },
altitudeMode: AltitudeMode.ABSOLUTE,
extruded: true,
label: place.displayName,
@@ -54,16 +60,20 @@ const flyToPlace = async (place) => {
// Fly to the marker.
map.flyCameraTo({
endCamera: {
- center: { lat: location.lat(), lng: location.lng(), altitude: elevation + 50 },
+ center: {
+ lat: location.lat(),
+ lng: location.lng(),
+ altitude: elevation + 50,
+ },
tilt: 65,
heading: 0,
- range: 1000
+ range: 1000,
},
durationMillis: 10000,
});
};
async function getElevationforPoint(location) {
- const { ElevationService } = await google.maps.importLibrary("elevation");
+ const { ElevationService } = await google.maps.importLibrary('elevation');
// Get place elevation using the ElevationService.
const elevatorService = new google.maps.ElevationService();
const elevationResponse = await elevatorService.getElevationForLocations({
diff --git a/dist/samples/3d-places-autocomplete/docs/index.ts b/dist/samples/3d-places-autocomplete/docs/index.ts
index 38842a15..6784e506 100644
--- a/dist/samples/3d-places-autocomplete/docs/index.ts
+++ b/dist/samples/3d-places-autocomplete/docs/index.ts
@@ -1,15 +1,15 @@
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
// @ts-nocheck
// [START maps_3d_places_autocomplete]
let map = null;
async function init() {
- const { Map3DElement } = await google.maps.importLibrary("maps3d");
+ const { Map3DElement } = await google.maps.importLibrary('maps3d');
map = new Map3DElement({
center: { lat: 0, lng: 0, altitude: 16000000 },
@@ -18,7 +18,7 @@ async function init() {
heading: 0,
roll: 0,
mode: 'HYBRID',
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
document.body.append(map);
@@ -27,27 +27,38 @@ async function init() {
}
async function initAutocomplete() {
- const { PlaceAutocompleteElement } = await google.maps.importLibrary("places")
+ const { PlaceAutocompleteElement } =
+ await google.maps.importLibrary('places');
const placeAutocomplete = new google.maps.places.PlaceAutocompleteElement();
placeAutocomplete.id = 'place-autocomplete-input';
const card = document.getElementById('pac-container');
card.appendChild(placeAutocomplete);
- placeAutocomplete.addEventListener('gmp-select', async ({ placePrediction }) => {
- const place = placePrediction.toPlace();
- await place.fetchFields({ fields: ['displayName', 'location', 'id'] });
- // If the place has a geometry, then present it on a map.
- if (!place.location) {
- window.alert("No viewport for input: " + place.displayName);
- return;
+ placeAutocomplete.addEventListener(
+ 'gmp-select',
+ async ({ placePrediction }) => {
+ const place = placePrediction.toPlace();
+ await place.fetchFields({
+ fields: ['displayName', 'location', 'id'],
+ });
+ // If the place has a geometry, then present it on a map.
+ if (!place.location) {
+ window.alert('No viewport for input: ' + place.displayName);
+ return;
+ }
+ flyToPlace(place);
}
- flyToPlace(place);
- });
+ );
}
const flyToPlace = async (place) => {
- const { AltitudeMode, Polyline3DElement, Polygon3DElement, Marker3DElement } = await google.maps.importLibrary("maps3d");
+ const {
+ AltitudeMode,
+ Polyline3DElement,
+ Polygon3DElement,
+ Marker3DElement,
+ } = await google.maps.importLibrary('maps3d');
const location = place.location;
@@ -55,7 +66,11 @@ const flyToPlace = async (place) => {
const elevation = await getElevationforPoint(location);
const marker = new Marker3DElement({
- position: { lat: location.lat(), lng: location.lng(), altitude: elevation + 50 },
+ position: {
+ lat: location.lat(),
+ lng: location.lng(),
+ altitude: elevation + 50,
+ },
altitudeMode: AltitudeMode.ABSOLUTE,
extruded: true,
label: place.displayName,
@@ -67,17 +82,21 @@ const flyToPlace = async (place) => {
// Fly to the marker.
map.flyCameraTo({
endCamera: {
- center: { lat: location.lat(), lng: location.lng(), altitude: elevation + 50 },
+ center: {
+ lat: location.lat(),
+ lng: location.lng(),
+ altitude: elevation + 50,
+ },
tilt: 65,
heading: 0,
- range: 1000
+ range: 1000,
},
durationMillis: 10000,
});
};
async function getElevationforPoint(location) {
- const { ElevationService } = await google.maps.importLibrary("elevation");
+ const { ElevationService } = await google.maps.importLibrary('elevation');
// Get place elevation using the ElevationService.
const elevatorService = new google.maps.ElevationService();
const elevationResponse = await elevatorService.getElevationForLocations({
diff --git a/dist/samples/3d-places-autocomplete/docs/style.css b/dist/samples/3d-places-autocomplete/docs/style.css
index 785b9f19..e1965f66 100644
--- a/dist/samples/3d-places-autocomplete/docs/style.css
+++ b/dist/samples/3d-places-autocomplete/docs/style.css
@@ -9,12 +9,12 @@
*/
html,
map {
- height: 100%;
+ height: 100%;
}
body {
- height: 100%;
- margin: 0;
- padding: 0;
+ height: 100%;
+ margin: 0;
+ padding: 0;
}
.pac-controls {
display: inline-block;
@@ -34,7 +34,10 @@ body {
box-shadow: 0 1px 4px -1px rgba(0, 0, 0, 0.3);
margin: 10px;
padding: 0 0.5em;
- font: 400 18px Roboto, Arial, sans-serif;
+ font:
+ 400 18px Roboto,
+ Arial,
+ sans-serif;
/* overflow: hidden; */
font-family: Roboto;
padding: 0;
diff --git a/dist/samples/3d-places-autocomplete/jsfiddle/demo.css b/dist/samples/3d-places-autocomplete/jsfiddle/demo.css
index df67a68b..edaed152 100644
--- a/dist/samples/3d-places-autocomplete/jsfiddle/demo.css
+++ b/dist/samples/3d-places-autocomplete/jsfiddle/demo.css
@@ -9,12 +9,12 @@
*/
html,
map {
- height: 100%;
+ height: 100%;
}
body {
- height: 100%;
- margin: 0;
- padding: 0;
+ height: 100%;
+ margin: 0;
+ padding: 0;
}
.pac-controls {
display: inline-block;
@@ -34,7 +34,10 @@ body {
box-shadow: 0 1px 4px -1px rgba(0, 0, 0, 0.3);
margin: 10px;
padding: 0 0.5em;
- font: 400 18px Roboto, Arial, sans-serif;
+ font:
+ 400 18px Roboto,
+ Arial,
+ sans-serif;
/* overflow: hidden; */
font-family: Roboto;
padding: 0;
diff --git a/dist/samples/3d-places-autocomplete/jsfiddle/demo.html b/dist/samples/3d-places-autocomplete/jsfiddle/demo.html
index b1f092b2..d8bf091b 100644
--- a/dist/samples/3d-places-autocomplete/jsfiddle/demo.html
+++ b/dist/samples/3d-places-autocomplete/jsfiddle/demo.html
@@ -6,24 +6,23 @@
-->
-
-
Map
+
+
Map
-
-
-
-
-
+
+
+
+
+
-
-
Navigate to a place
-
-
-
-
+
diff --git a/dist/samples/3d-places-autocomplete/jsfiddle/demo.js b/dist/samples/3d-places-autocomplete/jsfiddle/demo.js
index eeb9d51f..70375874 100644
--- a/dist/samples/3d-places-autocomplete/jsfiddle/demo.js
+++ b/dist/samples/3d-places-autocomplete/jsfiddle/demo.js
@@ -1,14 +1,14 @@
"use strict";
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
// @ts-nocheck
let map = null;
async function init() {
- const { Map3DElement } = await google.maps.importLibrary("maps3d");
+ const { Map3DElement } = await google.maps.importLibrary('maps3d');
map = new Map3DElement({
center: { lat: 0, lng: 0, altitude: 16000000 },
tilt: 0,
@@ -16,35 +16,41 @@ async function init() {
heading: 0,
roll: 0,
mode: 'HYBRID',
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
document.body.append(map);
initAutocomplete();
}
async function initAutocomplete() {
- const { PlaceAutocompleteElement } = await google.maps.importLibrary("places");
+ const { PlaceAutocompleteElement } = await google.maps.importLibrary('places');
const placeAutocomplete = new google.maps.places.PlaceAutocompleteElement();
placeAutocomplete.id = 'place-autocomplete-input';
const card = document.getElementById('pac-container');
card.appendChild(placeAutocomplete);
placeAutocomplete.addEventListener('gmp-select', async ({ placePrediction }) => {
const place = placePrediction.toPlace();
- await place.fetchFields({ fields: ['displayName', 'location', 'id'] });
+ await place.fetchFields({
+ fields: ['displayName', 'location', 'id'],
+ });
// If the place has a geometry, then present it on a map.
if (!place.location) {
- window.alert("No viewport for input: " + place.displayName);
+ window.alert('No viewport for input: ' + place.displayName);
return;
}
flyToPlace(place);
});
}
const flyToPlace = async (place) => {
- const { AltitudeMode, Polyline3DElement, Polygon3DElement, Marker3DElement } = await google.maps.importLibrary("maps3d");
+ const { AltitudeMode, Polyline3DElement, Polygon3DElement, Marker3DElement, } = await google.maps.importLibrary('maps3d');
const location = place.location;
// We need to find the elevation for the point so we place the marker at 50m above the elevation.
const elevation = await getElevationforPoint(location);
const marker = new Marker3DElement({
- position: { lat: location.lat(), lng: location.lng(), altitude: elevation + 50 },
+ position: {
+ lat: location.lat(),
+ lng: location.lng(),
+ altitude: elevation + 50,
+ },
altitudeMode: AltitudeMode.ABSOLUTE,
extruded: true,
label: place.displayName,
@@ -54,16 +60,20 @@ const flyToPlace = async (place) => {
// Fly to the marker.
map.flyCameraTo({
endCamera: {
- center: { lat: location.lat(), lng: location.lng(), altitude: elevation + 50 },
+ center: {
+ lat: location.lat(),
+ lng: location.lng(),
+ altitude: elevation + 50,
+ },
tilt: 65,
heading: 0,
- range: 1000
+ range: 1000,
},
durationMillis: 10000,
});
};
async function getElevationforPoint(location) {
- const { ElevationService } = await google.maps.importLibrary("elevation");
+ const { ElevationService } = await google.maps.importLibrary('elevation');
// Get place elevation using the ElevationService.
const elevatorService = new google.maps.ElevationService();
const elevationResponse = await elevatorService.getElevationForLocations({
diff --git a/dist/samples/3d-places/app/README.md b/dist/samples/3d-places/app/README.md
index 5b6820db..8e3454f9 100644
--- a/dist/samples/3d-places/app/README.md
+++ b/dist/samples/3d-places/app/README.md
@@ -32,4 +32,4 @@ From `samples/`:
## Feedback
For feedback related to this sample, please open a new issue on
-[GitHub](https://github.com/googlemaps-samples/js-api-samples/issues).
\ No newline at end of file
+[GitHub](https://github.com/googlemaps-samples/js-api-samples/issues).
diff --git a/dist/samples/3d-places/app/index.html b/dist/samples/3d-places/app/index.html
index aa12468e..816b9edf 100644
--- a/dist/samples/3d-places/app/index.html
+++ b/dist/samples/3d-places/app/index.html
@@ -6,26 +6,26 @@
-->
-
-
Map
+
+
Map
-
-
-
-
-
+
+
+
+
+
-
-
-
-
-
Click on a place to get details.
-
-
+
+
+
Click on a place to get details.
+
+
diff --git a/dist/samples/3d-places/app/index.ts b/dist/samples/3d-places/app/index.ts
index a950673d..5f6aeb8a 100644
--- a/dist/samples/3d-places/app/index.ts
+++ b/dist/samples/3d-places/app/index.ts
@@ -1,21 +1,22 @@
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
//@ts-nocheck
// [START maps_3d_places]
let map3DElement = null;
async function init() {
- const { Map3DElement } = await google.maps.importLibrary("maps3d");
- { }
+ const { Map3DElement } = await google.maps.importLibrary('maps3d');
+ {
+ }
map3DElement = new Map3DElement({
- center: { lat: 51.532, lng : -0.124, altitude: 30 },
+ center: { lat: 51.532, lng: -0.124, altitude: 30 },
range: 1400,
tilt: 64,
heading: -5,
mode: 'HYBRID',
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
document.body.append(map3DElement);
@@ -27,18 +28,20 @@ async function init() {
await place.fetchFields({ fields: ['*'] });
// Display place details.
- document.getElementById("placeName").innerHTML = "
Name : " + place.displayName;
- document.getElementById("placeId").innerHTML = "
Id : " + place.id;
- document.getElementById("placeType").innerHTML = "
Types :";
-
+ document.getElementById('placeName').innerHTML =
+ 'Name :
' + place.displayName;
+ document.getElementById('placeId').innerHTML =
+ 'Id :
' + place.id;
+ document.getElementById('placeType').innerHTML = 'Types :';
+
for (const type of place.types) {
- document.getElementById("placeType").innerHTML += "
" + type ;
+ document.getElementById('placeType').innerHTML +=
+ '
' + type;
}
- document.getElementById("details").style.display = "block";
+ document.getElementById('details').style.display = 'block';
}
});
-
}
-init();
+init();
// [END maps_3d_places]
diff --git a/dist/samples/3d-places/app/style.css b/dist/samples/3d-places/app/style.css
index 85bfe863..072544cb 100644
--- a/dist/samples/3d-places/app/style.css
+++ b/dist/samples/3d-places/app/style.css
@@ -12,7 +12,15 @@ body {
height: 100%;
margin: 0;
padding: 0;
- font-family: "Centra No2", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
+ font-family:
+ 'Centra No2',
+ -apple-system,
+ BlinkMacSystemFont,
+ 'Segoe UI',
+ Roboto,
+ 'Helvetica Neue',
+ Arial,
+ sans-serif;
font-size: 0.9em;
}
@@ -36,10 +44,10 @@ body {
overflow: hidden;
position: absolute;
top: 100px;
- left : 10px;
+ left: 10px;
padding: 10px;
z-index: 1000;
- display:none;
+ display: none;
color: white;
border-radius: 15px;
}
diff --git a/dist/samples/3d-places/dist/index.html b/dist/samples/3d-places/dist/index.html
index 1bd1bbd6..e2496ea0 100644
--- a/dist/samples/3d-places/dist/index.html
+++ b/dist/samples/3d-places/dist/index.html
@@ -6,26 +6,26 @@
-->
-
- Map
+
+ Map
-
-
-
-
-
+
+
+
+
+
-
-
-
-
-
Click on a place to get details.
-
+
Click on a place to get details.
+
-
Click on a place to get details.
-
+
Click on a place to get details.
+
" + place.displayName;
- document.getElementById("placeId").innerHTML = "Id :
" + place.id;
- document.getElementById("placeType").innerHTML = "Types :";
+ document.getElementById('placeName').innerHTML =
+ 'Name :
' + place.displayName;
+ document.getElementById('placeId').innerHTML =
+ 'Id :
' + place.id;
+ document.getElementById('placeType').innerHTML = 'Types :';
for (const type of place.types) {
- document.getElementById("placeType").innerHTML += "
" + type;
+ document.getElementById('placeType').innerHTML +=
+ '
' + type;
}
- document.getElementById("details").style.display = "block";
+ document.getElementById('details').style.display = 'block';
}
});
}
diff --git a/dist/samples/3d-places/docs/index.ts b/dist/samples/3d-places/docs/index.ts
index a950673d..5f6aeb8a 100644
--- a/dist/samples/3d-places/docs/index.ts
+++ b/dist/samples/3d-places/docs/index.ts
@@ -1,21 +1,22 @@
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
//@ts-nocheck
// [START maps_3d_places]
let map3DElement = null;
async function init() {
- const { Map3DElement } = await google.maps.importLibrary("maps3d");
- { }
+ const { Map3DElement } = await google.maps.importLibrary('maps3d');
+ {
+ }
map3DElement = new Map3DElement({
- center: { lat: 51.532, lng : -0.124, altitude: 30 },
+ center: { lat: 51.532, lng: -0.124, altitude: 30 },
range: 1400,
tilt: 64,
heading: -5,
mode: 'HYBRID',
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
document.body.append(map3DElement);
@@ -27,18 +28,20 @@ async function init() {
await place.fetchFields({ fields: ['*'] });
// Display place details.
- document.getElementById("placeName").innerHTML = "Name :
" + place.displayName;
- document.getElementById("placeId").innerHTML = "Id :
" + place.id;
- document.getElementById("placeType").innerHTML = "Types :";
-
+ document.getElementById('placeName').innerHTML =
+ 'Name :
' + place.displayName;
+ document.getElementById('placeId').innerHTML =
+ 'Id :
' + place.id;
+ document.getElementById('placeType').innerHTML = 'Types :';
+
for (const type of place.types) {
- document.getElementById("placeType").innerHTML += "
" + type ;
+ document.getElementById('placeType').innerHTML +=
+ '
' + type;
}
- document.getElementById("details").style.display = "block";
+ document.getElementById('details').style.display = 'block';
}
});
-
}
-init();
+init();
// [END maps_3d_places]
diff --git a/dist/samples/3d-places/docs/style.css b/dist/samples/3d-places/docs/style.css
index 85bfe863..072544cb 100644
--- a/dist/samples/3d-places/docs/style.css
+++ b/dist/samples/3d-places/docs/style.css
@@ -12,7 +12,15 @@ body {
height: 100%;
margin: 0;
padding: 0;
- font-family: "Centra No2", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
+ font-family:
+ 'Centra No2',
+ -apple-system,
+ BlinkMacSystemFont,
+ 'Segoe UI',
+ Roboto,
+ 'Helvetica Neue',
+ Arial,
+ sans-serif;
font-size: 0.9em;
}
@@ -36,10 +44,10 @@ body {
overflow: hidden;
position: absolute;
top: 100px;
- left : 10px;
+ left: 10px;
padding: 10px;
z-index: 1000;
- display:none;
+ display: none;
color: white;
border-radius: 15px;
}
diff --git a/dist/samples/3d-places/jsfiddle/demo.css b/dist/samples/3d-places/jsfiddle/demo.css
index c73eb258..c46f8847 100644
--- a/dist/samples/3d-places/jsfiddle/demo.css
+++ b/dist/samples/3d-places/jsfiddle/demo.css
@@ -12,7 +12,15 @@ body {
height: 100%;
margin: 0;
padding: 0;
- font-family: "Centra No2", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
+ font-family:
+ 'Centra No2',
+ -apple-system,
+ BlinkMacSystemFont,
+ 'Segoe UI',
+ Roboto,
+ 'Helvetica Neue',
+ Arial,
+ sans-serif;
font-size: 0.9em;
}
@@ -36,10 +44,10 @@ body {
overflow: hidden;
position: absolute;
top: 100px;
- left : 10px;
+ left: 10px;
padding: 10px;
z-index: 1000;
- display:none;
+ display: none;
color: white;
border-radius: 15px;
}
diff --git a/dist/samples/3d-places/jsfiddle/demo.html b/dist/samples/3d-places/jsfiddle/demo.html
index 4a753ecc..e469deaa 100644
--- a/dist/samples/3d-places/jsfiddle/demo.html
+++ b/dist/samples/3d-places/jsfiddle/demo.html
@@ -6,26 +6,26 @@
-->
-
- Map
+
+ Map
-
-
-
-
-
+
+
+
+
+
-
-
-
-
-
Click on a place to get details.
-
+
Click on a place to get details.
+
" + place.displayName;
- document.getElementById("placeId").innerHTML = "Id :
" + place.id;
- document.getElementById("placeType").innerHTML = "Types :";
+ document.getElementById('placeName').innerHTML =
+ 'Name :
' + place.displayName;
+ document.getElementById('placeId').innerHTML =
+ 'Id :
' + place.id;
+ document.getElementById('placeType').innerHTML = 'Types :';
for (const type of place.types) {
- document.getElementById("placeType").innerHTML += "
" + type;
+ document.getElementById('placeType').innerHTML +=
+ '
' + type;
}
- document.getElementById("details").style.display = "block";
+ document.getElementById('details').style.display = 'block';
}
});
}
diff --git a/dist/samples/3d-polygon-click-event/app/README.md b/dist/samples/3d-polygon-click-event/app/README.md
index 93ff691c..dfd7355b 100644
--- a/dist/samples/3d-polygon-click-event/app/README.md
+++ b/dist/samples/3d-polygon-click-event/app/README.md
@@ -32,4 +32,4 @@ From `samples/`:
## Feedback
For feedback related to this sample, please open a new issue on
-[GitHub](https://github.com/googlemaps-samples/js-api-samples/issues).
\ No newline at end of file
+[GitHub](https://github.com/googlemaps-samples/js-api-samples/issues).
diff --git a/dist/samples/3d-polygon-click-event/app/index.html b/dist/samples/3d-polygon-click-event/app/index.html
index e90740e1..8667d321 100644
--- a/dist/samples/3d-polygon-click-event/app/index.html
+++ b/dist/samples/3d-polygon-click-event/app/index.html
@@ -6,18 +6,18 @@
-->
-
- Map
+
+ Map
-
-
-
-
-
+
+
+
+
+
-
-
-
+
diff --git a/dist/samples/3d-polygon-click-event/app/index.ts b/dist/samples/3d-polygon-click-event/app/index.ts
index abb97cf3..543cb566 100644
--- a/dist/samples/3d-polygon-click-event/app/index.ts
+++ b/dist/samples/3d-polygon-click-event/app/index.ts
@@ -1,38 +1,41 @@
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
// @ts-nocheck
// [START maps_3d_polygon_click_event]
async function init() {
- const { Map3DElement, MapMode, Polygon3DInteractiveElement } = await google.maps.importLibrary("maps3d");
+ const { Map3DElement, MapMode, Polygon3DInteractiveElement } =
+ await google.maps.importLibrary('maps3d');
const map = new Map3DElement({
center: { lat: 40.6842, lng: -74.0019, altitude: 1000 },
heading: 340,
tilt: 70,
mode: MapMode.HYBRID,
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
document.body.append(map);
const polygonOptions = {
- strokeColor: "#0000ff80",
+ strokeColor: '#0000ff80',
strokeWidth: 8,
- fillColor: "#ff000080",
+ fillColor: '#ff000080',
drawsOccludedSegments: false,
- }
+ };
- const examplePolygon = new google.maps.maps3d.Polygon3DInteractiveElement(polygonOptions);
+ const examplePolygon = new google.maps.maps3d.Polygon3DInteractiveElement(
+ polygonOptions
+ );
examplePolygon.path = [
{ lat: 40.7144, lng: -74.0208 },
{ lat: 40.6993, lng: -74.019 },
{ lat: 40.7035, lng: -74.0004 },
- { lat: 40.7144, lng: -74.0208 }
+ { lat: 40.7144, lng: -74.0208 },
];
examplePolygon.addEventListener('gmp-click', (event) => {
@@ -55,7 +58,7 @@ function randomizeHexColor(originalHexColor) {
const g = Math.floor(Math.random() * 256);
const b = Math.floor(Math.random() * 256);
- console.log(r + " " + g + " " + b);
+ console.log(r + ' ' + g + ' ' + b);
// Convert decimal to 2-digit hex, padding with '0' if needed
const rHex = ('0' + r.toString(16)).slice(-2);
diff --git a/dist/samples/3d-polygon-click-event/app/style.css b/dist/samples/3d-polygon-click-event/app/style.css
index f0bba123..2a89f955 100644
--- a/dist/samples/3d-polygon-click-event/app/style.css
+++ b/dist/samples/3d-polygon-click-event/app/style.css
@@ -9,11 +9,11 @@
*/
html,
map {
- height: 100%;
+ height: 100%;
}
body {
- height: 100%;
- margin: 0;
- padding: 0;
+ height: 100%;
+ margin: 0;
+ padding: 0;
}
/* [END maps_3d_polygon_click_event] */
diff --git a/dist/samples/3d-polygon-click-event/dist/index.html b/dist/samples/3d-polygon-click-event/dist/index.html
index a5b45988..c40b55a8 100644
--- a/dist/samples/3d-polygon-click-event/dist/index.html
+++ b/dist/samples/3d-polygon-click-event/dist/index.html
@@ -6,18 +6,18 @@
-->
-
- Map
+
+ Map
-
-
-
-
-
+
+
+
+
+
-
-
-
+
diff --git a/dist/samples/3d-polygon-click-event/docs/index.html b/dist/samples/3d-polygon-click-event/docs/index.html
index e90740e1..8667d321 100644
--- a/dist/samples/3d-polygon-click-event/docs/index.html
+++ b/dist/samples/3d-polygon-click-event/docs/index.html
@@ -6,18 +6,18 @@
-->
-
- Map
+
+ Map
-
-
-
-
-
+
+
+
+
+
-
-
-
+
diff --git a/dist/samples/3d-polygon-click-event/docs/index.js b/dist/samples/3d-polygon-click-event/docs/index.js
index 5b272d49..a3027187 100644
--- a/dist/samples/3d-polygon-click-event/docs/index.js
+++ b/dist/samples/3d-polygon-click-event/docs/index.js
@@ -1,25 +1,25 @@
"use strict";
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
// @ts-nocheck
// [START maps_3d_polygon_click_event]
async function init() {
- const { Map3DElement, MapMode, Polygon3DInteractiveElement } = await google.maps.importLibrary("maps3d");
+ const { Map3DElement, MapMode, Polygon3DInteractiveElement } = await google.maps.importLibrary('maps3d');
const map = new Map3DElement({
center: { lat: 40.6842, lng: -74.0019, altitude: 1000 },
heading: 340,
tilt: 70,
mode: MapMode.HYBRID,
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
document.body.append(map);
const polygonOptions = {
- strokeColor: "#0000ff80",
+ strokeColor: '#0000ff80',
strokeWidth: 8,
- fillColor: "#ff000080",
+ fillColor: '#ff000080',
drawsOccludedSegments: false,
};
const examplePolygon = new google.maps.maps3d.Polygon3DInteractiveElement(polygonOptions);
@@ -27,7 +27,7 @@ async function init() {
{ lat: 40.7144, lng: -74.0208 },
{ lat: 40.6993, lng: -74.019 },
{ lat: 40.7035, lng: -74.0004 },
- { lat: 40.7144, lng: -74.0208 }
+ { lat: 40.7144, lng: -74.0208 },
];
examplePolygon.addEventListener('gmp-click', (event) => {
// change the color of the polygon stroke and fill colors to a random alternatives!
@@ -45,7 +45,7 @@ function randomizeHexColor(originalHexColor) {
const r = Math.floor(Math.random() * 256);
const g = Math.floor(Math.random() * 256);
const b = Math.floor(Math.random() * 256);
- console.log(r + " " + g + " " + b);
+ console.log(r + ' ' + g + ' ' + b);
// Convert decimal to 2-digit hex, padding with '0' if needed
const rHex = ('0' + r.toString(16)).slice(-2);
const gHex = ('0' + g.toString(16)).slice(-2);
diff --git a/dist/samples/3d-polygon-click-event/docs/index.ts b/dist/samples/3d-polygon-click-event/docs/index.ts
index abb97cf3..543cb566 100644
--- a/dist/samples/3d-polygon-click-event/docs/index.ts
+++ b/dist/samples/3d-polygon-click-event/docs/index.ts
@@ -1,38 +1,41 @@
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
// @ts-nocheck
// [START maps_3d_polygon_click_event]
async function init() {
- const { Map3DElement, MapMode, Polygon3DInteractiveElement } = await google.maps.importLibrary("maps3d");
+ const { Map3DElement, MapMode, Polygon3DInteractiveElement } =
+ await google.maps.importLibrary('maps3d');
const map = new Map3DElement({
center: { lat: 40.6842, lng: -74.0019, altitude: 1000 },
heading: 340,
tilt: 70,
mode: MapMode.HYBRID,
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
document.body.append(map);
const polygonOptions = {
- strokeColor: "#0000ff80",
+ strokeColor: '#0000ff80',
strokeWidth: 8,
- fillColor: "#ff000080",
+ fillColor: '#ff000080',
drawsOccludedSegments: false,
- }
+ };
- const examplePolygon = new google.maps.maps3d.Polygon3DInteractiveElement(polygonOptions);
+ const examplePolygon = new google.maps.maps3d.Polygon3DInteractiveElement(
+ polygonOptions
+ );
examplePolygon.path = [
{ lat: 40.7144, lng: -74.0208 },
{ lat: 40.6993, lng: -74.019 },
{ lat: 40.7035, lng: -74.0004 },
- { lat: 40.7144, lng: -74.0208 }
+ { lat: 40.7144, lng: -74.0208 },
];
examplePolygon.addEventListener('gmp-click', (event) => {
@@ -55,7 +58,7 @@ function randomizeHexColor(originalHexColor) {
const g = Math.floor(Math.random() * 256);
const b = Math.floor(Math.random() * 256);
- console.log(r + " " + g + " " + b);
+ console.log(r + ' ' + g + ' ' + b);
// Convert decimal to 2-digit hex, padding with '0' if needed
const rHex = ('0' + r.toString(16)).slice(-2);
diff --git a/dist/samples/3d-polygon-click-event/docs/style.css b/dist/samples/3d-polygon-click-event/docs/style.css
index f0bba123..2a89f955 100644
--- a/dist/samples/3d-polygon-click-event/docs/style.css
+++ b/dist/samples/3d-polygon-click-event/docs/style.css
@@ -9,11 +9,11 @@
*/
html,
map {
- height: 100%;
+ height: 100%;
}
body {
- height: 100%;
- margin: 0;
- padding: 0;
+ height: 100%;
+ margin: 0;
+ padding: 0;
}
/* [END maps_3d_polygon_click_event] */
diff --git a/dist/samples/3d-polygon-click-event/jsfiddle/demo.css b/dist/samples/3d-polygon-click-event/jsfiddle/demo.css
index a74f30bc..d6ec582a 100644
--- a/dist/samples/3d-polygon-click-event/jsfiddle/demo.css
+++ b/dist/samples/3d-polygon-click-event/jsfiddle/demo.css
@@ -9,11 +9,11 @@
*/
html,
map {
- height: 100%;
+ height: 100%;
}
body {
- height: 100%;
- margin: 0;
- padding: 0;
+ height: 100%;
+ margin: 0;
+ padding: 0;
}
diff --git a/dist/samples/3d-polygon-click-event/jsfiddle/demo.html b/dist/samples/3d-polygon-click-event/jsfiddle/demo.html
index f80f4564..9501b596 100644
--- a/dist/samples/3d-polygon-click-event/jsfiddle/demo.html
+++ b/dist/samples/3d-polygon-click-event/jsfiddle/demo.html
@@ -6,18 +6,18 @@
-->
-
- Map
+
+ Map
-
-
-
-
-
+
+
+
+
+
-
-
-
+
diff --git a/dist/samples/3d-polygon-click-event/jsfiddle/demo.js b/dist/samples/3d-polygon-click-event/jsfiddle/demo.js
index f7c97a2a..3a5cb1d4 100644
--- a/dist/samples/3d-polygon-click-event/jsfiddle/demo.js
+++ b/dist/samples/3d-polygon-click-event/jsfiddle/demo.js
@@ -1,25 +1,25 @@
"use strict";
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
// @ts-nocheck
async function init() {
- const { Map3DElement, MapMode, Polygon3DInteractiveElement } = await google.maps.importLibrary("maps3d");
+ const { Map3DElement, MapMode, Polygon3DInteractiveElement } = await google.maps.importLibrary('maps3d');
const map = new Map3DElement({
center: { lat: 40.6842, lng: -74.0019, altitude: 1000 },
heading: 340,
tilt: 70,
mode: MapMode.HYBRID,
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
document.body.append(map);
const polygonOptions = {
- strokeColor: "#0000ff80",
+ strokeColor: '#0000ff80',
strokeWidth: 8,
- fillColor: "#ff000080",
+ fillColor: '#ff000080',
drawsOccludedSegments: false,
};
const examplePolygon = new google.maps.maps3d.Polygon3DInteractiveElement(polygonOptions);
@@ -27,7 +27,7 @@ async function init() {
{ lat: 40.7144, lng: -74.0208 },
{ lat: 40.6993, lng: -74.019 },
{ lat: 40.7035, lng: -74.0004 },
- { lat: 40.7144, lng: -74.0208 }
+ { lat: 40.7144, lng: -74.0208 },
];
examplePolygon.addEventListener('gmp-click', (event) => {
// change the color of the polygon stroke and fill colors to a random alternatives!
@@ -45,7 +45,7 @@ function randomizeHexColor(originalHexColor) {
const r = Math.floor(Math.random() * 256);
const g = Math.floor(Math.random() * 256);
const b = Math.floor(Math.random() * 256);
- console.log(r + " " + g + " " + b);
+ console.log(r + ' ' + g + ' ' + b);
// Convert decimal to 2-digit hex, padding with '0' if needed
const rHex = ('0' + r.toString(16)).slice(-2);
const gHex = ('0' + g.toString(16)).slice(-2);
diff --git a/dist/samples/3d-polygon-extruded-hole/app/README.md b/dist/samples/3d-polygon-extruded-hole/app/README.md
index 99cdb928..3177115f 100644
--- a/dist/samples/3d-polygon-extruded-hole/app/README.md
+++ b/dist/samples/3d-polygon-extruded-hole/app/README.md
@@ -32,4 +32,4 @@ From `samples/`:
## Feedback
For feedback related to this sample, please open a new issue on
-[GitHub](https://github.com/googlemaps-samples/js-api-samples/issues).
\ No newline at end of file
+[GitHub](https://github.com/googlemaps-samples/js-api-samples/issues).
diff --git a/dist/samples/3d-polygon-extruded-hole/app/index.html b/dist/samples/3d-polygon-extruded-hole/app/index.html
index 72588bba..8f55fb55 100644
--- a/dist/samples/3d-polygon-extruded-hole/app/index.html
+++ b/dist/samples/3d-polygon-extruded-hole/app/index.html
@@ -6,18 +6,18 @@
-->
-
- Map
+
+ Map
-
-
-
-
-
+
+
+
+
+
-
-
-
+
diff --git a/dist/samples/3d-polygon-extruded-hole/app/index.ts b/dist/samples/3d-polygon-extruded-hole/app/index.ts
index 48f88ec7..17eb7385 100644
--- a/dist/samples/3d-polygon-extruded-hole/app/index.ts
+++ b/dist/samples/3d-polygon-extruded-hole/app/index.ts
@@ -1,45 +1,48 @@
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
// @ts-nocheck
// [START maps_3d_polygon_extruded_hole]
async function init() {
- const { Map3DElement, MapMode, AltitudeMode, Polygon3DElement } = await google.maps.importLibrary("maps3d");
+ const { Map3DElement, MapMode, AltitudeMode, Polygon3DElement } =
+ await google.maps.importLibrary('maps3d');
const map3DElement = new Map3DElement({
center: { lat: 40.6842, lng: -74.0019, altitude: 1000 },
heading: 340,
tilt: 70,
mode: MapMode.HYBRID,
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
const polygonOptions = {
- strokeColor: "#0000ff80",
+ strokeColor: '#0000ff80',
strokeWidth: 8,
- fillColor: "#ff000080",
+ fillColor: '#ff000080',
drawsOccludedSegments: false,
extruded: true,
- altitudeMode : AltitudeMode.RELATIVE_TO_GROUND
- }
+ altitudeMode: AltitudeMode.RELATIVE_TO_GROUND,
+ };
- const examplePolygon = new google.maps.maps3d.Polygon3DElement(polygonOptions);
+ const examplePolygon = new google.maps.maps3d.Polygon3DElement(
+ polygonOptions
+ );
examplePolygon.path = [
{ lat: 40.7144, lng: -74.0208, altitude: 200 },
{ lat: 40.6993, lng: -74.019, altitude: 200 },
- { lat: 40.7035, lng: -74.0004, altitude: 200 }
+ { lat: 40.7035, lng: -74.0004, altitude: 200 },
];
examplePolygon.innerPaths = [
[
{ lat: 40.71, lng: -74.0175, altitude: 200 },
{ lat: 40.703, lng: -74.0165, altitude: 200 },
- { lat: 40.7035, lng: -74.006, altitude: 200 }
- ]
+ { lat: 40.7035, lng: -74.006, altitude: 200 },
+ ],
];
map3DElement.append(examplePolygon);
diff --git a/dist/samples/3d-polygon-extruded-hole/app/style.css b/dist/samples/3d-polygon-extruded-hole/app/style.css
index 81dc8ef9..2fbbb162 100644
--- a/dist/samples/3d-polygon-extruded-hole/app/style.css
+++ b/dist/samples/3d-polygon-extruded-hole/app/style.css
@@ -9,11 +9,11 @@
*/
html,
map {
- height: 100%;
+ height: 100%;
}
body {
- height: 100%;
- margin: 0;
- padding: 0;
+ height: 100%;
+ margin: 0;
+ padding: 0;
}
/* [END maps_3d_polygon_extruded_hole] */
diff --git a/dist/samples/3d-polygon-extruded-hole/dist/index.html b/dist/samples/3d-polygon-extruded-hole/dist/index.html
index 39785580..7956c5ac 100644
--- a/dist/samples/3d-polygon-extruded-hole/dist/index.html
+++ b/dist/samples/3d-polygon-extruded-hole/dist/index.html
@@ -6,18 +6,18 @@
-->
-
- Map
+
+ Map
-
-
-
-
-
+
+
+
+
+
-
-
-
+
diff --git a/dist/samples/3d-polygon-extruded-hole/docs/index.html b/dist/samples/3d-polygon-extruded-hole/docs/index.html
index 72588bba..8f55fb55 100644
--- a/dist/samples/3d-polygon-extruded-hole/docs/index.html
+++ b/dist/samples/3d-polygon-extruded-hole/docs/index.html
@@ -6,18 +6,18 @@
-->
-
- Map
+
+ Map
-
-
-
-
-
+
+
+
+
+
-
-
-
+
diff --git a/dist/samples/3d-polygon-extruded-hole/docs/index.js b/dist/samples/3d-polygon-extruded-hole/docs/index.js
index 842255cd..1eef5e04 100644
--- a/dist/samples/3d-polygon-extruded-hole/docs/index.js
+++ b/dist/samples/3d-polygon-extruded-hole/docs/index.js
@@ -1,40 +1,40 @@
"use strict";
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
// @ts-nocheck
// [START maps_3d_polygon_extruded_hole]
async function init() {
- const { Map3DElement, MapMode, AltitudeMode, Polygon3DElement } = await google.maps.importLibrary("maps3d");
+ const { Map3DElement, MapMode, AltitudeMode, Polygon3DElement } = await google.maps.importLibrary('maps3d');
const map3DElement = new Map3DElement({
center: { lat: 40.6842, lng: -74.0019, altitude: 1000 },
heading: 340,
tilt: 70,
mode: MapMode.HYBRID,
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
const polygonOptions = {
- strokeColor: "#0000ff80",
+ strokeColor: '#0000ff80',
strokeWidth: 8,
- fillColor: "#ff000080",
+ fillColor: '#ff000080',
drawsOccludedSegments: false,
extruded: true,
- altitudeMode: AltitudeMode.RELATIVE_TO_GROUND
+ altitudeMode: AltitudeMode.RELATIVE_TO_GROUND,
};
const examplePolygon = new google.maps.maps3d.Polygon3DElement(polygonOptions);
examplePolygon.path = [
{ lat: 40.7144, lng: -74.0208, altitude: 200 },
{ lat: 40.6993, lng: -74.019, altitude: 200 },
- { lat: 40.7035, lng: -74.0004, altitude: 200 }
+ { lat: 40.7035, lng: -74.0004, altitude: 200 },
];
examplePolygon.innerPaths = [
[
{ lat: 40.71, lng: -74.0175, altitude: 200 },
{ lat: 40.703, lng: -74.0165, altitude: 200 },
- { lat: 40.7035, lng: -74.006, altitude: 200 }
- ]
+ { lat: 40.7035, lng: -74.006, altitude: 200 },
+ ],
];
map3DElement.append(examplePolygon);
document.body.append(map3DElement);
diff --git a/dist/samples/3d-polygon-extruded-hole/docs/index.ts b/dist/samples/3d-polygon-extruded-hole/docs/index.ts
index 48f88ec7..17eb7385 100644
--- a/dist/samples/3d-polygon-extruded-hole/docs/index.ts
+++ b/dist/samples/3d-polygon-extruded-hole/docs/index.ts
@@ -1,45 +1,48 @@
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
// @ts-nocheck
// [START maps_3d_polygon_extruded_hole]
async function init() {
- const { Map3DElement, MapMode, AltitudeMode, Polygon3DElement } = await google.maps.importLibrary("maps3d");
+ const { Map3DElement, MapMode, AltitudeMode, Polygon3DElement } =
+ await google.maps.importLibrary('maps3d');
const map3DElement = new Map3DElement({
center: { lat: 40.6842, lng: -74.0019, altitude: 1000 },
heading: 340,
tilt: 70,
mode: MapMode.HYBRID,
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
const polygonOptions = {
- strokeColor: "#0000ff80",
+ strokeColor: '#0000ff80',
strokeWidth: 8,
- fillColor: "#ff000080",
+ fillColor: '#ff000080',
drawsOccludedSegments: false,
extruded: true,
- altitudeMode : AltitudeMode.RELATIVE_TO_GROUND
- }
+ altitudeMode: AltitudeMode.RELATIVE_TO_GROUND,
+ };
- const examplePolygon = new google.maps.maps3d.Polygon3DElement(polygonOptions);
+ const examplePolygon = new google.maps.maps3d.Polygon3DElement(
+ polygonOptions
+ );
examplePolygon.path = [
{ lat: 40.7144, lng: -74.0208, altitude: 200 },
{ lat: 40.6993, lng: -74.019, altitude: 200 },
- { lat: 40.7035, lng: -74.0004, altitude: 200 }
+ { lat: 40.7035, lng: -74.0004, altitude: 200 },
];
examplePolygon.innerPaths = [
[
{ lat: 40.71, lng: -74.0175, altitude: 200 },
{ lat: 40.703, lng: -74.0165, altitude: 200 },
- { lat: 40.7035, lng: -74.006, altitude: 200 }
- ]
+ { lat: 40.7035, lng: -74.006, altitude: 200 },
+ ],
];
map3DElement.append(examplePolygon);
diff --git a/dist/samples/3d-polygon-extruded-hole/docs/style.css b/dist/samples/3d-polygon-extruded-hole/docs/style.css
index 81dc8ef9..2fbbb162 100644
--- a/dist/samples/3d-polygon-extruded-hole/docs/style.css
+++ b/dist/samples/3d-polygon-extruded-hole/docs/style.css
@@ -9,11 +9,11 @@
*/
html,
map {
- height: 100%;
+ height: 100%;
}
body {
- height: 100%;
- margin: 0;
- padding: 0;
+ height: 100%;
+ margin: 0;
+ padding: 0;
}
/* [END maps_3d_polygon_extruded_hole] */
diff --git a/dist/samples/3d-polygon-extruded-hole/jsfiddle/demo.css b/dist/samples/3d-polygon-extruded-hole/jsfiddle/demo.css
index a74f30bc..d6ec582a 100644
--- a/dist/samples/3d-polygon-extruded-hole/jsfiddle/demo.css
+++ b/dist/samples/3d-polygon-extruded-hole/jsfiddle/demo.css
@@ -9,11 +9,11 @@
*/
html,
map {
- height: 100%;
+ height: 100%;
}
body {
- height: 100%;
- margin: 0;
- padding: 0;
+ height: 100%;
+ margin: 0;
+ padding: 0;
}
diff --git a/dist/samples/3d-polygon-extruded-hole/jsfiddle/demo.html b/dist/samples/3d-polygon-extruded-hole/jsfiddle/demo.html
index f80f4564..9501b596 100644
--- a/dist/samples/3d-polygon-extruded-hole/jsfiddle/demo.html
+++ b/dist/samples/3d-polygon-extruded-hole/jsfiddle/demo.html
@@ -6,18 +6,18 @@
-->
-
- Map
+
+ Map
-
-
-
-
-
+
+
+
+
+
-
-
-
+
diff --git a/dist/samples/3d-polygon-extruded-hole/jsfiddle/demo.js b/dist/samples/3d-polygon-extruded-hole/jsfiddle/demo.js
index cb78941f..763187be 100644
--- a/dist/samples/3d-polygon-extruded-hole/jsfiddle/demo.js
+++ b/dist/samples/3d-polygon-extruded-hole/jsfiddle/demo.js
@@ -1,40 +1,40 @@
"use strict";
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
// @ts-nocheck
async function init() {
- const { Map3DElement, MapMode, AltitudeMode, Polygon3DElement } = await google.maps.importLibrary("maps3d");
+ const { Map3DElement, MapMode, AltitudeMode, Polygon3DElement } = await google.maps.importLibrary('maps3d');
const map3DElement = new Map3DElement({
center: { lat: 40.6842, lng: -74.0019, altitude: 1000 },
heading: 340,
tilt: 70,
mode: MapMode.HYBRID,
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
const polygonOptions = {
- strokeColor: "#0000ff80",
+ strokeColor: '#0000ff80',
strokeWidth: 8,
- fillColor: "#ff000080",
+ fillColor: '#ff000080',
drawsOccludedSegments: false,
extruded: true,
- altitudeMode: AltitudeMode.RELATIVE_TO_GROUND
+ altitudeMode: AltitudeMode.RELATIVE_TO_GROUND,
};
const examplePolygon = new google.maps.maps3d.Polygon3DElement(polygonOptions);
examplePolygon.path = [
{ lat: 40.7144, lng: -74.0208, altitude: 200 },
{ lat: 40.6993, lng: -74.019, altitude: 200 },
- { lat: 40.7035, lng: -74.0004, altitude: 200 }
+ { lat: 40.7035, lng: -74.0004, altitude: 200 },
];
examplePolygon.innerPaths = [
[
{ lat: 40.71, lng: -74.0175, altitude: 200 },
{ lat: 40.703, lng: -74.0165, altitude: 200 },
- { lat: 40.7035, lng: -74.006, altitude: 200 }
- ]
+ { lat: 40.7035, lng: -74.006, altitude: 200 },
+ ],
];
map3DElement.append(examplePolygon);
document.body.append(map3DElement);
diff --git a/dist/samples/3d-polygon/app/README.md b/dist/samples/3d-polygon/app/README.md
index 94c963f6..99f9407c 100644
--- a/dist/samples/3d-polygon/app/README.md
+++ b/dist/samples/3d-polygon/app/README.md
@@ -32,4 +32,4 @@ From `samples/`:
## Feedback
For feedback related to this sample, please open a new issue on
-[GitHub](https://github.com/googlemaps-samples/js-api-samples/issues).
\ No newline at end of file
+[GitHub](https://github.com/googlemaps-samples/js-api-samples/issues).
diff --git a/dist/samples/3d-polygon/app/index.html b/dist/samples/3d-polygon/app/index.html
index d516e7c0..ccbfe4ad 100644
--- a/dist/samples/3d-polygon/app/index.html
+++ b/dist/samples/3d-polygon/app/index.html
@@ -6,18 +6,18 @@
-->
-
- Map
+
+ Map
-
-
-
-
-
+
+
+
+
+
-
-
-
+
diff --git a/dist/samples/3d-polygon/app/index.ts b/dist/samples/3d-polygon/app/index.ts
index 93c5ff41..246f0e05 100644
--- a/dist/samples/3d-polygon/app/index.ts
+++ b/dist/samples/3d-polygon/app/index.ts
@@ -1,35 +1,38 @@
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
// @ts-nocheck
// [START maps_3d_polygon]
async function init() {
- const { Map3DElement, MapMode, Polygon3DElement } = await google.maps.importLibrary("maps3d");
-
+ const { Map3DElement, MapMode, Polygon3DElement } =
+ await google.maps.importLibrary('maps3d');
+
const map3DElement = new Map3DElement({
center: { lat: 40.6842, lng: -74.0019, altitude: 1000 },
heading: 340,
tilt: 70,
mode: MapMode.HYBRID,
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
const polygonOptions = {
- strokeColor: "#0000ff80",
+ strokeColor: '#0000ff80',
strokeWidth: 8,
- fillColor: "#ff000080",
+ fillColor: '#ff000080',
drawsOccludedSegments: false,
- }
+ };
- const examplePolygon = new google.maps.maps3d.Polygon3DElement(polygonOptions);
+ const examplePolygon = new google.maps.maps3d.Polygon3DElement(
+ polygonOptions
+ );
examplePolygon.path = [
{ lat: 40.7144, lng: -74.0208 },
{ lat: 40.6993, lng: -74.019 },
- { lat: 40.7035, lng: -74.0004 }
+ { lat: 40.7035, lng: -74.0004 },
];
map3DElement.append(examplePolygon);
diff --git a/dist/samples/3d-polygon/app/style.css b/dist/samples/3d-polygon/app/style.css
index 04901599..53f5c208 100644
--- a/dist/samples/3d-polygon/app/style.css
+++ b/dist/samples/3d-polygon/app/style.css
@@ -9,11 +9,11 @@
*/
html,
map {
- height: 100%;
+ height: 100%;
}
body {
- height: 100%;
- margin: 0;
- padding: 0;
+ height: 100%;
+ margin: 0;
+ padding: 0;
}
/* [END maps_3d_polygon] */
diff --git a/dist/samples/3d-polygon/dist/index.html b/dist/samples/3d-polygon/dist/index.html
index 9a5f7634..4be6b332 100644
--- a/dist/samples/3d-polygon/dist/index.html
+++ b/dist/samples/3d-polygon/dist/index.html
@@ -6,18 +6,18 @@
-->
-
- Map
+
+ Map
-
-
-
-
-
+
+
+
+
+
-
-
-
+
diff --git a/dist/samples/3d-polygon/docs/index.html b/dist/samples/3d-polygon/docs/index.html
index d516e7c0..ccbfe4ad 100644
--- a/dist/samples/3d-polygon/docs/index.html
+++ b/dist/samples/3d-polygon/docs/index.html
@@ -6,18 +6,18 @@
-->
-
- Map
+
+ Map
-
-
-
-
-
+
+
+
+
+
-
-
-
+
diff --git a/dist/samples/3d-polygon/docs/index.js b/dist/samples/3d-polygon/docs/index.js
index c0721bf2..18e0e720 100644
--- a/dist/samples/3d-polygon/docs/index.js
+++ b/dist/samples/3d-polygon/docs/index.js
@@ -1,31 +1,31 @@
"use strict";
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
// @ts-nocheck
// [START maps_3d_polygon]
async function init() {
- const { Map3DElement, MapMode, Polygon3DElement } = await google.maps.importLibrary("maps3d");
+ const { Map3DElement, MapMode, Polygon3DElement } = await google.maps.importLibrary('maps3d');
const map3DElement = new Map3DElement({
center: { lat: 40.6842, lng: -74.0019, altitude: 1000 },
heading: 340,
tilt: 70,
mode: MapMode.HYBRID,
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
const polygonOptions = {
- strokeColor: "#0000ff80",
+ strokeColor: '#0000ff80',
strokeWidth: 8,
- fillColor: "#ff000080",
+ fillColor: '#ff000080',
drawsOccludedSegments: false,
};
const examplePolygon = new google.maps.maps3d.Polygon3DElement(polygonOptions);
examplePolygon.path = [
{ lat: 40.7144, lng: -74.0208 },
{ lat: 40.6993, lng: -74.019 },
- { lat: 40.7035, lng: -74.0004 }
+ { lat: 40.7035, lng: -74.0004 },
];
map3DElement.append(examplePolygon);
document.body.append(map3DElement);
diff --git a/dist/samples/3d-polygon/docs/index.ts b/dist/samples/3d-polygon/docs/index.ts
index 93c5ff41..246f0e05 100644
--- a/dist/samples/3d-polygon/docs/index.ts
+++ b/dist/samples/3d-polygon/docs/index.ts
@@ -1,35 +1,38 @@
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
// @ts-nocheck
// [START maps_3d_polygon]
async function init() {
- const { Map3DElement, MapMode, Polygon3DElement } = await google.maps.importLibrary("maps3d");
-
+ const { Map3DElement, MapMode, Polygon3DElement } =
+ await google.maps.importLibrary('maps3d');
+
const map3DElement = new Map3DElement({
center: { lat: 40.6842, lng: -74.0019, altitude: 1000 },
heading: 340,
tilt: 70,
mode: MapMode.HYBRID,
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
const polygonOptions = {
- strokeColor: "#0000ff80",
+ strokeColor: '#0000ff80',
strokeWidth: 8,
- fillColor: "#ff000080",
+ fillColor: '#ff000080',
drawsOccludedSegments: false,
- }
+ };
- const examplePolygon = new google.maps.maps3d.Polygon3DElement(polygonOptions);
+ const examplePolygon = new google.maps.maps3d.Polygon3DElement(
+ polygonOptions
+ );
examplePolygon.path = [
{ lat: 40.7144, lng: -74.0208 },
{ lat: 40.6993, lng: -74.019 },
- { lat: 40.7035, lng: -74.0004 }
+ { lat: 40.7035, lng: -74.0004 },
];
map3DElement.append(examplePolygon);
diff --git a/dist/samples/3d-polygon/docs/style.css b/dist/samples/3d-polygon/docs/style.css
index 04901599..53f5c208 100644
--- a/dist/samples/3d-polygon/docs/style.css
+++ b/dist/samples/3d-polygon/docs/style.css
@@ -9,11 +9,11 @@
*/
html,
map {
- height: 100%;
+ height: 100%;
}
body {
- height: 100%;
- margin: 0;
- padding: 0;
+ height: 100%;
+ margin: 0;
+ padding: 0;
}
/* [END maps_3d_polygon] */
diff --git a/dist/samples/3d-polygon/jsfiddle/demo.css b/dist/samples/3d-polygon/jsfiddle/demo.css
index a74f30bc..d6ec582a 100644
--- a/dist/samples/3d-polygon/jsfiddle/demo.css
+++ b/dist/samples/3d-polygon/jsfiddle/demo.css
@@ -9,11 +9,11 @@
*/
html,
map {
- height: 100%;
+ height: 100%;
}
body {
- height: 100%;
- margin: 0;
- padding: 0;
+ height: 100%;
+ margin: 0;
+ padding: 0;
}
diff --git a/dist/samples/3d-polygon/jsfiddle/demo.html b/dist/samples/3d-polygon/jsfiddle/demo.html
index f80f4564..9501b596 100644
--- a/dist/samples/3d-polygon/jsfiddle/demo.html
+++ b/dist/samples/3d-polygon/jsfiddle/demo.html
@@ -6,18 +6,18 @@
-->
-
- Map
+
+ Map
-
-
-
-
-
+
+
+
+
+
-
-
-
+
diff --git a/dist/samples/3d-polygon/jsfiddle/demo.js b/dist/samples/3d-polygon/jsfiddle/demo.js
index 8b52595d..96488e51 100644
--- a/dist/samples/3d-polygon/jsfiddle/demo.js
+++ b/dist/samples/3d-polygon/jsfiddle/demo.js
@@ -1,31 +1,31 @@
"use strict";
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
// @ts-nocheck
async function init() {
- const { Map3DElement, MapMode, Polygon3DElement } = await google.maps.importLibrary("maps3d");
+ const { Map3DElement, MapMode, Polygon3DElement } = await google.maps.importLibrary('maps3d');
const map3DElement = new Map3DElement({
center: { lat: 40.6842, lng: -74.0019, altitude: 1000 },
heading: 340,
tilt: 70,
mode: MapMode.HYBRID,
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
const polygonOptions = {
- strokeColor: "#0000ff80",
+ strokeColor: '#0000ff80',
strokeWidth: 8,
- fillColor: "#ff000080",
+ fillColor: '#ff000080',
drawsOccludedSegments: false,
};
const examplePolygon = new google.maps.maps3d.Polygon3DElement(polygonOptions);
examplePolygon.path = [
{ lat: 40.7144, lng: -74.0208 },
{ lat: 40.6993, lng: -74.019 },
- { lat: 40.7035, lng: -74.0004 }
+ { lat: 40.7035, lng: -74.0004 },
];
map3DElement.append(examplePolygon);
document.body.append(map3DElement);
diff --git a/dist/samples/3d-polyline-click-event/app/README.md b/dist/samples/3d-polyline-click-event/app/README.md
index c8a3a2fa..61958501 100644
--- a/dist/samples/3d-polyline-click-event/app/README.md
+++ b/dist/samples/3d-polyline-click-event/app/README.md
@@ -32,4 +32,4 @@ From `samples/`:
## Feedback
For feedback related to this sample, please open a new issue on
-[GitHub](https://github.com/googlemaps-samples/js-api-samples/issues).
\ No newline at end of file
+[GitHub](https://github.com/googlemaps-samples/js-api-samples/issues).
diff --git a/dist/samples/3d-polyline-click-event/app/index.html b/dist/samples/3d-polyline-click-event/app/index.html
index 18e13fa8..251315e7 100644
--- a/dist/samples/3d-polyline-click-event/app/index.html
+++ b/dist/samples/3d-polyline-click-event/app/index.html
@@ -6,18 +6,18 @@
-->
-
- Map
+
+ Map
-
-
-
-
-
+
+
+
+
+
-
-
-
+
diff --git a/dist/samples/3d-polyline-click-event/app/index.ts b/dist/samples/3d-polyline-click-event/app/index.ts
index 2bedabe0..359ad519 100644
--- a/dist/samples/3d-polyline-click-event/app/index.ts
+++ b/dist/samples/3d-polyline-click-event/app/index.ts
@@ -1,19 +1,27 @@
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
// @ts-nocheck
// [START maps_3d_polyline_click_event]
let map;
async function init() {
- const { Map3DElement, MapMode, AltitudeMode, Polyline3DInteractiveElement } = await google.maps.importLibrary("maps3d");
+ const {
+ Map3DElement,
+ MapMode,
+ AltitudeMode,
+ Polyline3DInteractiveElement,
+ } = await google.maps.importLibrary('maps3d');
- map = new Map3DElement({
- center: { lat: 37.7927, lng : -122.4020, altitude: 65.93 }, range: 3362.87, tilt: 64.01 ,heading: 25.00,
+ map = new Map3DElement({
+ center: { lat: 37.7927, lng: -122.402, altitude: 65.93 },
+ range: 3362.87,
+ tilt: 64.01,
+ heading: 25.0,
mode: MapMode.SATELLITE,
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
document.body.append(map);
@@ -30,8 +38,8 @@ async function init() {
{ lat: 37.78861484290265, lng: -122.4019489189814 },
{ lat: 37.78618687561075, lng: -122.398969592545 },
{ lat: 37.7892310309145, lng: -122.3951458683092 },
- { lat: 37.7916358762409, lng: -122.3981969390652 }
- ],
+ { lat: 37.7916358762409, lng: -122.3981969390652 },
+ ],
strokeColor: 'blue',
outerColor: 'white',
strokeWidth: 10,
@@ -42,7 +50,8 @@ async function init() {
polyline.addEventListener('gmp-click', (event) => {
// Toggle whether the line draws occluded segments.
- event.target.drawsOccludedSegments = !event.target.drawsOccludedSegments;
+ event.target.drawsOccludedSegments =
+ !event.target.drawsOccludedSegments;
});
map.append(polyline);
diff --git a/dist/samples/3d-polyline-click-event/app/style.css b/dist/samples/3d-polyline-click-event/app/style.css
index f64defcf..92a3fb4e 100644
--- a/dist/samples/3d-polyline-click-event/app/style.css
+++ b/dist/samples/3d-polyline-click-event/app/style.css
@@ -9,11 +9,11 @@
*/
html,
map {
- height: 100%;
+ height: 100%;
}
body {
- height: 100%;
- margin: 0;
- padding: 0;
+ height: 100%;
+ margin: 0;
+ padding: 0;
}
/* [END maps_3d_polyline_click_event] */
diff --git a/dist/samples/3d-polyline-click-event/dist/index.html b/dist/samples/3d-polyline-click-event/dist/index.html
index cdfcf33e..5ddd328e 100644
--- a/dist/samples/3d-polyline-click-event/dist/index.html
+++ b/dist/samples/3d-polyline-click-event/dist/index.html
@@ -6,18 +6,18 @@
-->
-
- Map
+
+ Map
-
-
-
-
-
+
+
+
+
+
-
-
-
+
diff --git a/dist/samples/3d-polyline-click-event/docs/index.html b/dist/samples/3d-polyline-click-event/docs/index.html
index 18e13fa8..251315e7 100644
--- a/dist/samples/3d-polyline-click-event/docs/index.html
+++ b/dist/samples/3d-polyline-click-event/docs/index.html
@@ -6,18 +6,18 @@
-->
-
- Map
+
+ Map
-
-
-
-
-
+
+
+
+
+
-
-
-
+
diff --git a/dist/samples/3d-polyline-click-event/docs/index.js b/dist/samples/3d-polyline-click-event/docs/index.js
index 32d0249b..c3e804ba 100644
--- a/dist/samples/3d-polyline-click-event/docs/index.js
+++ b/dist/samples/3d-polyline-click-event/docs/index.js
@@ -1,18 +1,21 @@
"use strict";
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
// @ts-nocheck
// [START maps_3d_polyline_click_event]
let map;
async function init() {
- const { Map3DElement, MapMode, AltitudeMode, Polyline3DInteractiveElement } = await google.maps.importLibrary("maps3d");
+ const { Map3DElement, MapMode, AltitudeMode, Polyline3DInteractiveElement, } = await google.maps.importLibrary('maps3d');
map = new Map3DElement({
- center: { lat: 37.7927, lng: -122.4020, altitude: 65.93 }, range: 3362.87, tilt: 64.01, heading: 25.00,
+ center: { lat: 37.7927, lng: -122.402, altitude: 65.93 },
+ range: 3362.87,
+ tilt: 64.01,
+ heading: 25.0,
mode: MapMode.SATELLITE,
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
document.body.append(map);
const polyline = new Polyline3DInteractiveElement({
@@ -27,7 +30,7 @@ async function init() {
{ lat: 37.78861484290265, lng: -122.4019489189814 },
{ lat: 37.78618687561075, lng: -122.398969592545 },
{ lat: 37.7892310309145, lng: -122.3951458683092 },
- { lat: 37.7916358762409, lng: -122.3981969390652 }
+ { lat: 37.7916358762409, lng: -122.3981969390652 },
],
strokeColor: 'blue',
outerColor: 'white',
@@ -38,7 +41,8 @@ async function init() {
});
polyline.addEventListener('gmp-click', (event) => {
// Toggle whether the line draws occluded segments.
- event.target.drawsOccludedSegments = !event.target.drawsOccludedSegments;
+ event.target.drawsOccludedSegments =
+ !event.target.drawsOccludedSegments;
});
map.append(polyline);
}
diff --git a/dist/samples/3d-polyline-click-event/docs/index.ts b/dist/samples/3d-polyline-click-event/docs/index.ts
index 2bedabe0..359ad519 100644
--- a/dist/samples/3d-polyline-click-event/docs/index.ts
+++ b/dist/samples/3d-polyline-click-event/docs/index.ts
@@ -1,19 +1,27 @@
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
// @ts-nocheck
// [START maps_3d_polyline_click_event]
let map;
async function init() {
- const { Map3DElement, MapMode, AltitudeMode, Polyline3DInteractiveElement } = await google.maps.importLibrary("maps3d");
+ const {
+ Map3DElement,
+ MapMode,
+ AltitudeMode,
+ Polyline3DInteractiveElement,
+ } = await google.maps.importLibrary('maps3d');
- map = new Map3DElement({
- center: { lat: 37.7927, lng : -122.4020, altitude: 65.93 }, range: 3362.87, tilt: 64.01 ,heading: 25.00,
+ map = new Map3DElement({
+ center: { lat: 37.7927, lng: -122.402, altitude: 65.93 },
+ range: 3362.87,
+ tilt: 64.01,
+ heading: 25.0,
mode: MapMode.SATELLITE,
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
document.body.append(map);
@@ -30,8 +38,8 @@ async function init() {
{ lat: 37.78861484290265, lng: -122.4019489189814 },
{ lat: 37.78618687561075, lng: -122.398969592545 },
{ lat: 37.7892310309145, lng: -122.3951458683092 },
- { lat: 37.7916358762409, lng: -122.3981969390652 }
- ],
+ { lat: 37.7916358762409, lng: -122.3981969390652 },
+ ],
strokeColor: 'blue',
outerColor: 'white',
strokeWidth: 10,
@@ -42,7 +50,8 @@ async function init() {
polyline.addEventListener('gmp-click', (event) => {
// Toggle whether the line draws occluded segments.
- event.target.drawsOccludedSegments = !event.target.drawsOccludedSegments;
+ event.target.drawsOccludedSegments =
+ !event.target.drawsOccludedSegments;
});
map.append(polyline);
diff --git a/dist/samples/3d-polyline-click-event/docs/style.css b/dist/samples/3d-polyline-click-event/docs/style.css
index f64defcf..92a3fb4e 100644
--- a/dist/samples/3d-polyline-click-event/docs/style.css
+++ b/dist/samples/3d-polyline-click-event/docs/style.css
@@ -9,11 +9,11 @@
*/
html,
map {
- height: 100%;
+ height: 100%;
}
body {
- height: 100%;
- margin: 0;
- padding: 0;
+ height: 100%;
+ margin: 0;
+ padding: 0;
}
/* [END maps_3d_polyline_click_event] */
diff --git a/dist/samples/3d-polyline-click-event/jsfiddle/demo.css b/dist/samples/3d-polyline-click-event/jsfiddle/demo.css
index a74f30bc..d6ec582a 100644
--- a/dist/samples/3d-polyline-click-event/jsfiddle/demo.css
+++ b/dist/samples/3d-polyline-click-event/jsfiddle/demo.css
@@ -9,11 +9,11 @@
*/
html,
map {
- height: 100%;
+ height: 100%;
}
body {
- height: 100%;
- margin: 0;
- padding: 0;
+ height: 100%;
+ margin: 0;
+ padding: 0;
}
diff --git a/dist/samples/3d-polyline-click-event/jsfiddle/demo.html b/dist/samples/3d-polyline-click-event/jsfiddle/demo.html
index f80f4564..9501b596 100644
--- a/dist/samples/3d-polyline-click-event/jsfiddle/demo.html
+++ b/dist/samples/3d-polyline-click-event/jsfiddle/demo.html
@@ -6,18 +6,18 @@
-->
-
- Map
+
+ Map
-
-
-
-
-
+
+
+
+
+
-
-
-
+
diff --git a/dist/samples/3d-polyline-click-event/jsfiddle/demo.js b/dist/samples/3d-polyline-click-event/jsfiddle/demo.js
index 177badd1..9324c352 100644
--- a/dist/samples/3d-polyline-click-event/jsfiddle/demo.js
+++ b/dist/samples/3d-polyline-click-event/jsfiddle/demo.js
@@ -1,18 +1,21 @@
"use strict";
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
// @ts-nocheck
let map;
async function init() {
- const { Map3DElement, MapMode, AltitudeMode, Polyline3DInteractiveElement } = await google.maps.importLibrary("maps3d");
+ const { Map3DElement, MapMode, AltitudeMode, Polyline3DInteractiveElement, } = await google.maps.importLibrary('maps3d');
map = new Map3DElement({
- center: { lat: 37.7927, lng: -122.4020, altitude: 65.93 }, range: 3362.87, tilt: 64.01, heading: 25.00,
+ center: { lat: 37.7927, lng: -122.402, altitude: 65.93 },
+ range: 3362.87,
+ tilt: 64.01,
+ heading: 25.0,
mode: MapMode.SATELLITE,
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
document.body.append(map);
const polyline = new Polyline3DInteractiveElement({
@@ -27,7 +30,7 @@ async function init() {
{ lat: 37.78861484290265, lng: -122.4019489189814 },
{ lat: 37.78618687561075, lng: -122.398969592545 },
{ lat: 37.7892310309145, lng: -122.3951458683092 },
- { lat: 37.7916358762409, lng: -122.3981969390652 }
+ { lat: 37.7916358762409, lng: -122.3981969390652 },
],
strokeColor: 'blue',
outerColor: 'white',
@@ -38,7 +41,8 @@ async function init() {
});
polyline.addEventListener('gmp-click', (event) => {
// Toggle whether the line draws occluded segments.
- event.target.drawsOccludedSegments = !event.target.drawsOccludedSegments;
+ event.target.drawsOccludedSegments =
+ !event.target.drawsOccludedSegments;
});
map.append(polyline);
}
diff --git a/dist/samples/3d-polyline-extruded/app/README.md b/dist/samples/3d-polyline-extruded/app/README.md
index 6811516b..bdb5e57a 100644
--- a/dist/samples/3d-polyline-extruded/app/README.md
+++ b/dist/samples/3d-polyline-extruded/app/README.md
@@ -32,4 +32,4 @@ From `samples/`:
## Feedback
For feedback related to this sample, please open a new issue on
-[GitHub](https://github.com/googlemaps-samples/js-api-samples/issues).
\ No newline at end of file
+[GitHub](https://github.com/googlemaps-samples/js-api-samples/issues).
diff --git a/dist/samples/3d-polyline-extruded/app/index.html b/dist/samples/3d-polyline-extruded/app/index.html
index f8faa0a5..b4e5bd68 100644
--- a/dist/samples/3d-polyline-extruded/app/index.html
+++ b/dist/samples/3d-polyline-extruded/app/index.html
@@ -6,18 +6,18 @@
-->
-
- Map
+
+ Map
-
-
-
-
-
+
+
+
+
+
-
-
-
+
diff --git a/dist/samples/3d-polyline-extruded/app/index.ts b/dist/samples/3d-polyline-extruded/app/index.ts
index e11c6fc8..bb5c0277 100644
--- a/dist/samples/3d-polyline-extruded/app/index.ts
+++ b/dist/samples/3d-polyline-extruded/app/index.ts
@@ -1,19 +1,23 @@
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
// @ts-nocheck
// [START maps_3d_polyline_extruded]
let map;
async function init() {
- const { Map3DElement, MapMode, AltitudeMode, Polyline3DElement } = await google.maps.importLibrary("maps3d");
+ const { Map3DElement, MapMode, AltitudeMode, Polyline3DElement } =
+ await google.maps.importLibrary('maps3d');
map = new Map3DElement({
- center: { lat: 37.7927, lng: -122.4020, altitude: 65.93 }, range: 3362.87, tilt: 64.01, heading: 25.00,
+ center: { lat: 37.7927, lng: -122.402, altitude: 65.93 },
+ range: 3362.87,
+ tilt: 64.01,
+ heading: 25.0,
mode: MapMode.SATELLITE,
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
document.body.append(map);
@@ -30,12 +34,12 @@ async function init() {
{ lat: 37.78861484290265, lng: -122.4019489189814, altitude: 100 },
{ lat: 37.78618687561075, lng: -122.398969592545, altitude: 100 },
{ lat: 37.7892310309145, lng: -122.3951458683092, altitude: 100 },
- { lat: 37.7916358762409, lng: -122.3981969390652, altitude: 100 }
+ { lat: 37.7916358762409, lng: -122.3981969390652, altitude: 100 },
],
strokeColor: '#0000FF80',
strokeWidth: 10,
altitudeMode: AltitudeMode.RELATIVE_TO_GROUND, // Place it on the ground (as it has no altitude it will just be at ground height).
- extruded: true
+ extruded: true,
});
map.append(polyline);
diff --git a/dist/samples/3d-polyline-extruded/app/style.css b/dist/samples/3d-polyline-extruded/app/style.css
index 5b6968df..d3cc2546 100644
--- a/dist/samples/3d-polyline-extruded/app/style.css
+++ b/dist/samples/3d-polyline-extruded/app/style.css
@@ -9,11 +9,11 @@
*/
html,
map {
- height: 100%;
+ height: 100%;
}
body {
- height: 100%;
- margin: 0;
- padding: 0;
+ height: 100%;
+ margin: 0;
+ padding: 0;
}
/* [END maps_3d_polyline_extruded] */
diff --git a/dist/samples/3d-polyline-extruded/dist/index.html b/dist/samples/3d-polyline-extruded/dist/index.html
index a0ca72f8..11db2088 100644
--- a/dist/samples/3d-polyline-extruded/dist/index.html
+++ b/dist/samples/3d-polyline-extruded/dist/index.html
@@ -6,18 +6,18 @@
-->
-
- Map
+
+ Map
-
-
-
-
-
+
+
+
+
+
-
-
-
+
diff --git a/dist/samples/3d-polyline-extruded/docs/index.html b/dist/samples/3d-polyline-extruded/docs/index.html
index f8faa0a5..b4e5bd68 100644
--- a/dist/samples/3d-polyline-extruded/docs/index.html
+++ b/dist/samples/3d-polyline-extruded/docs/index.html
@@ -6,18 +6,18 @@
-->
-
- Map
+
+ Map
-
-
-
-
-
+
+
+
+
+
-
-
-
+
diff --git a/dist/samples/3d-polyline-extruded/docs/index.js b/dist/samples/3d-polyline-extruded/docs/index.js
index c9e4cc5e..dabc2876 100644
--- a/dist/samples/3d-polyline-extruded/docs/index.js
+++ b/dist/samples/3d-polyline-extruded/docs/index.js
@@ -1,18 +1,21 @@
"use strict";
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
// @ts-nocheck
// [START maps_3d_polyline_extruded]
let map;
async function init() {
- const { Map3DElement, MapMode, AltitudeMode, Polyline3DElement } = await google.maps.importLibrary("maps3d");
+ const { Map3DElement, MapMode, AltitudeMode, Polyline3DElement } = await google.maps.importLibrary('maps3d');
map = new Map3DElement({
- center: { lat: 37.7927, lng: -122.4020, altitude: 65.93 }, range: 3362.87, tilt: 64.01, heading: 25.00,
+ center: { lat: 37.7927, lng: -122.402, altitude: 65.93 },
+ range: 3362.87,
+ tilt: 64.01,
+ heading: 25.0,
mode: MapMode.SATELLITE,
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
document.body.append(map);
const polyline = new Polyline3DElement({
@@ -27,12 +30,12 @@ async function init() {
{ lat: 37.78861484290265, lng: -122.4019489189814, altitude: 100 },
{ lat: 37.78618687561075, lng: -122.398969592545, altitude: 100 },
{ lat: 37.7892310309145, lng: -122.3951458683092, altitude: 100 },
- { lat: 37.7916358762409, lng: -122.3981969390652, altitude: 100 }
+ { lat: 37.7916358762409, lng: -122.3981969390652, altitude: 100 },
],
strokeColor: '#0000FF80',
strokeWidth: 10,
altitudeMode: AltitudeMode.RELATIVE_TO_GROUND, // Place it on the ground (as it has no altitude it will just be at ground height).
- extruded: true
+ extruded: true,
});
map.append(polyline);
}
diff --git a/dist/samples/3d-polyline-extruded/docs/index.ts b/dist/samples/3d-polyline-extruded/docs/index.ts
index e11c6fc8..bb5c0277 100644
--- a/dist/samples/3d-polyline-extruded/docs/index.ts
+++ b/dist/samples/3d-polyline-extruded/docs/index.ts
@@ -1,19 +1,23 @@
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
// @ts-nocheck
// [START maps_3d_polyline_extruded]
let map;
async function init() {
- const { Map3DElement, MapMode, AltitudeMode, Polyline3DElement } = await google.maps.importLibrary("maps3d");
+ const { Map3DElement, MapMode, AltitudeMode, Polyline3DElement } =
+ await google.maps.importLibrary('maps3d');
map = new Map3DElement({
- center: { lat: 37.7927, lng: -122.4020, altitude: 65.93 }, range: 3362.87, tilt: 64.01, heading: 25.00,
+ center: { lat: 37.7927, lng: -122.402, altitude: 65.93 },
+ range: 3362.87,
+ tilt: 64.01,
+ heading: 25.0,
mode: MapMode.SATELLITE,
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
document.body.append(map);
@@ -30,12 +34,12 @@ async function init() {
{ lat: 37.78861484290265, lng: -122.4019489189814, altitude: 100 },
{ lat: 37.78618687561075, lng: -122.398969592545, altitude: 100 },
{ lat: 37.7892310309145, lng: -122.3951458683092, altitude: 100 },
- { lat: 37.7916358762409, lng: -122.3981969390652, altitude: 100 }
+ { lat: 37.7916358762409, lng: -122.3981969390652, altitude: 100 },
],
strokeColor: '#0000FF80',
strokeWidth: 10,
altitudeMode: AltitudeMode.RELATIVE_TO_GROUND, // Place it on the ground (as it has no altitude it will just be at ground height).
- extruded: true
+ extruded: true,
});
map.append(polyline);
diff --git a/dist/samples/3d-polyline-extruded/docs/style.css b/dist/samples/3d-polyline-extruded/docs/style.css
index 5b6968df..d3cc2546 100644
--- a/dist/samples/3d-polyline-extruded/docs/style.css
+++ b/dist/samples/3d-polyline-extruded/docs/style.css
@@ -9,11 +9,11 @@
*/
html,
map {
- height: 100%;
+ height: 100%;
}
body {
- height: 100%;
- margin: 0;
- padding: 0;
+ height: 100%;
+ margin: 0;
+ padding: 0;
}
/* [END maps_3d_polyline_extruded] */
diff --git a/dist/samples/3d-polyline-extruded/jsfiddle/demo.css b/dist/samples/3d-polyline-extruded/jsfiddle/demo.css
index a74f30bc..d6ec582a 100644
--- a/dist/samples/3d-polyline-extruded/jsfiddle/demo.css
+++ b/dist/samples/3d-polyline-extruded/jsfiddle/demo.css
@@ -9,11 +9,11 @@
*/
html,
map {
- height: 100%;
+ height: 100%;
}
body {
- height: 100%;
- margin: 0;
- padding: 0;
+ height: 100%;
+ margin: 0;
+ padding: 0;
}
diff --git a/dist/samples/3d-polyline-extruded/jsfiddle/demo.html b/dist/samples/3d-polyline-extruded/jsfiddle/demo.html
index f80f4564..9501b596 100644
--- a/dist/samples/3d-polyline-extruded/jsfiddle/demo.html
+++ b/dist/samples/3d-polyline-extruded/jsfiddle/demo.html
@@ -6,18 +6,18 @@
-->
-
- Map
+
+ Map
-
-
-
-
-
+
+
+
+
+
-
-
-
+
diff --git a/dist/samples/3d-polyline-extruded/jsfiddle/demo.js b/dist/samples/3d-polyline-extruded/jsfiddle/demo.js
index 93831888..040c2797 100644
--- a/dist/samples/3d-polyline-extruded/jsfiddle/demo.js
+++ b/dist/samples/3d-polyline-extruded/jsfiddle/demo.js
@@ -1,18 +1,21 @@
"use strict";
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
// @ts-nocheck
let map;
async function init() {
- const { Map3DElement, MapMode, AltitudeMode, Polyline3DElement } = await google.maps.importLibrary("maps3d");
+ const { Map3DElement, MapMode, AltitudeMode, Polyline3DElement } = await google.maps.importLibrary('maps3d');
map = new Map3DElement({
- center: { lat: 37.7927, lng: -122.4020, altitude: 65.93 }, range: 3362.87, tilt: 64.01, heading: 25.00,
+ center: { lat: 37.7927, lng: -122.402, altitude: 65.93 },
+ range: 3362.87,
+ tilt: 64.01,
+ heading: 25.0,
mode: MapMode.SATELLITE,
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
document.body.append(map);
const polyline = new Polyline3DElement({
@@ -27,12 +30,12 @@ async function init() {
{ lat: 37.78861484290265, lng: -122.4019489189814, altitude: 100 },
{ lat: 37.78618687561075, lng: -122.398969592545, altitude: 100 },
{ lat: 37.7892310309145, lng: -122.3951458683092, altitude: 100 },
- { lat: 37.7916358762409, lng: -122.3981969390652, altitude: 100 }
+ { lat: 37.7916358762409, lng: -122.3981969390652, altitude: 100 },
],
strokeColor: '#0000FF80',
strokeWidth: 10,
altitudeMode: AltitudeMode.RELATIVE_TO_GROUND, // Place it on the ground (as it has no altitude it will just be at ground height).
- extruded: true
+ extruded: true,
});
map.append(polyline);
}
diff --git a/dist/samples/3d-polyline/app/README.md b/dist/samples/3d-polyline/app/README.md
index 17e1a067..685b6b77 100644
--- a/dist/samples/3d-polyline/app/README.md
+++ b/dist/samples/3d-polyline/app/README.md
@@ -32,4 +32,4 @@ From `samples/`:
## Feedback
For feedback related to this sample, please open a new issue on
-[GitHub](https://github.com/googlemaps-samples/js-api-samples/issues).
\ No newline at end of file
+[GitHub](https://github.com/googlemaps-samples/js-api-samples/issues).
diff --git a/dist/samples/3d-polyline/app/index.html b/dist/samples/3d-polyline/app/index.html
index 58b994b3..50955609 100644
--- a/dist/samples/3d-polyline/app/index.html
+++ b/dist/samples/3d-polyline/app/index.html
@@ -6,18 +6,18 @@
-->
-
- Map
+
+ Map
-
-
-
-
-
+
+
+
+
+
-
-
-
+
diff --git a/dist/samples/3d-polyline/app/index.ts b/dist/samples/3d-polyline/app/index.ts
index aeeba069..0a712c63 100644
--- a/dist/samples/3d-polyline/app/index.ts
+++ b/dist/samples/3d-polyline/app/index.ts
@@ -1,19 +1,23 @@
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
// @ts-nocheck
// [START maps_3d_polyline]
let map;
async function init() {
- const { Map3DElement, MapMode, AltitudeMode, Polyline3DElement } = await google.maps.importLibrary("maps3d");
+ const { Map3DElement, MapMode, AltitudeMode, Polyline3DElement } =
+ await google.maps.importLibrary('maps3d');
- map = new Map3DElement({
- center: { lat: 37.7927, lng : -122.4020, altitude: 65.93 }, range: 3362.87, tilt: 64.01 ,heading: 25.00,
+ map = new Map3DElement({
+ center: { lat: 37.7927, lng: -122.402, altitude: 65.93 },
+ range: 3362.87,
+ tilt: 64.01,
+ heading: 25.0,
mode: MapMode.SATELLITE,
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
document.body.append(map);
@@ -30,8 +34,8 @@ async function init() {
{ lat: 37.78861484290265, lng: -122.4019489189814 },
{ lat: 37.78618687561075, lng: -122.398969592545 },
{ lat: 37.7892310309145, lng: -122.3951458683092 },
- { lat: 37.7916358762409, lng: -122.3981969390652 }
- ],
+ { lat: 37.7916358762409, lng: -122.3981969390652 },
+ ],
strokeColor: 'blue',
outerColor: 'white',
strokeWidth: 10,
diff --git a/dist/samples/3d-polyline/app/style.css b/dist/samples/3d-polyline/app/style.css
index cd5e3276..47f5a48f 100644
--- a/dist/samples/3d-polyline/app/style.css
+++ b/dist/samples/3d-polyline/app/style.css
@@ -9,11 +9,11 @@
*/
html,
map {
- height: 100%;
+ height: 100%;
}
body {
- height: 100%;
- margin: 0;
- padding: 0;
+ height: 100%;
+ margin: 0;
+ padding: 0;
}
/* [END maps_3d_polyline] */
diff --git a/dist/samples/3d-polyline/dist/index.html b/dist/samples/3d-polyline/dist/index.html
index e7f197da..6ca485e3 100644
--- a/dist/samples/3d-polyline/dist/index.html
+++ b/dist/samples/3d-polyline/dist/index.html
@@ -6,18 +6,18 @@
-->
-
- Map
+
+ Map
-
-
-
-
-
+
+
+
+
+
-
-
-
+
diff --git a/dist/samples/3d-polyline/docs/index.html b/dist/samples/3d-polyline/docs/index.html
index 58b994b3..50955609 100644
--- a/dist/samples/3d-polyline/docs/index.html
+++ b/dist/samples/3d-polyline/docs/index.html
@@ -6,18 +6,18 @@
-->
-
- Map
+
+ Map
-
-
-
-
-
+
+
+
+
+
-
-
-
+
diff --git a/dist/samples/3d-polyline/docs/index.js b/dist/samples/3d-polyline/docs/index.js
index 8c78779a..e726635c 100644
--- a/dist/samples/3d-polyline/docs/index.js
+++ b/dist/samples/3d-polyline/docs/index.js
@@ -1,18 +1,21 @@
"use strict";
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
// @ts-nocheck
// [START maps_3d_polyline]
let map;
async function init() {
- const { Map3DElement, MapMode, AltitudeMode, Polyline3DElement } = await google.maps.importLibrary("maps3d");
+ const { Map3DElement, MapMode, AltitudeMode, Polyline3DElement } = await google.maps.importLibrary('maps3d');
map = new Map3DElement({
- center: { lat: 37.7927, lng: -122.4020, altitude: 65.93 }, range: 3362.87, tilt: 64.01, heading: 25.00,
+ center: { lat: 37.7927, lng: -122.402, altitude: 65.93 },
+ range: 3362.87,
+ tilt: 64.01,
+ heading: 25.0,
mode: MapMode.SATELLITE,
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
document.body.append(map);
const polyline = new Polyline3DElement({
@@ -27,7 +30,7 @@ async function init() {
{ lat: 37.78861484290265, lng: -122.4019489189814 },
{ lat: 37.78618687561075, lng: -122.398969592545 },
{ lat: 37.7892310309145, lng: -122.3951458683092 },
- { lat: 37.7916358762409, lng: -122.3981969390652 }
+ { lat: 37.7916358762409, lng: -122.3981969390652 },
],
strokeColor: 'blue',
outerColor: 'white',
diff --git a/dist/samples/3d-polyline/docs/index.ts b/dist/samples/3d-polyline/docs/index.ts
index aeeba069..0a712c63 100644
--- a/dist/samples/3d-polyline/docs/index.ts
+++ b/dist/samples/3d-polyline/docs/index.ts
@@ -1,19 +1,23 @@
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
// @ts-nocheck
// [START maps_3d_polyline]
let map;
async function init() {
- const { Map3DElement, MapMode, AltitudeMode, Polyline3DElement } = await google.maps.importLibrary("maps3d");
+ const { Map3DElement, MapMode, AltitudeMode, Polyline3DElement } =
+ await google.maps.importLibrary('maps3d');
- map = new Map3DElement({
- center: { lat: 37.7927, lng : -122.4020, altitude: 65.93 }, range: 3362.87, tilt: 64.01 ,heading: 25.00,
+ map = new Map3DElement({
+ center: { lat: 37.7927, lng: -122.402, altitude: 65.93 },
+ range: 3362.87,
+ tilt: 64.01,
+ heading: 25.0,
mode: MapMode.SATELLITE,
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
document.body.append(map);
@@ -30,8 +34,8 @@ async function init() {
{ lat: 37.78861484290265, lng: -122.4019489189814 },
{ lat: 37.78618687561075, lng: -122.398969592545 },
{ lat: 37.7892310309145, lng: -122.3951458683092 },
- { lat: 37.7916358762409, lng: -122.3981969390652 }
- ],
+ { lat: 37.7916358762409, lng: -122.3981969390652 },
+ ],
strokeColor: 'blue',
outerColor: 'white',
strokeWidth: 10,
diff --git a/dist/samples/3d-polyline/docs/style.css b/dist/samples/3d-polyline/docs/style.css
index cd5e3276..47f5a48f 100644
--- a/dist/samples/3d-polyline/docs/style.css
+++ b/dist/samples/3d-polyline/docs/style.css
@@ -9,11 +9,11 @@
*/
html,
map {
- height: 100%;
+ height: 100%;
}
body {
- height: 100%;
- margin: 0;
- padding: 0;
+ height: 100%;
+ margin: 0;
+ padding: 0;
}
/* [END maps_3d_polyline] */
diff --git a/dist/samples/3d-polyline/jsfiddle/demo.css b/dist/samples/3d-polyline/jsfiddle/demo.css
index a74f30bc..d6ec582a 100644
--- a/dist/samples/3d-polyline/jsfiddle/demo.css
+++ b/dist/samples/3d-polyline/jsfiddle/demo.css
@@ -9,11 +9,11 @@
*/
html,
map {
- height: 100%;
+ height: 100%;
}
body {
- height: 100%;
- margin: 0;
- padding: 0;
+ height: 100%;
+ margin: 0;
+ padding: 0;
}
diff --git a/dist/samples/3d-polyline/jsfiddle/demo.html b/dist/samples/3d-polyline/jsfiddle/demo.html
index f80f4564..9501b596 100644
--- a/dist/samples/3d-polyline/jsfiddle/demo.html
+++ b/dist/samples/3d-polyline/jsfiddle/demo.html
@@ -6,18 +6,18 @@
-->
-
- Map
+
+ Map
-
-
-
-
-
+
+
+
+
+
-
-
-
+
diff --git a/dist/samples/3d-polyline/jsfiddle/demo.js b/dist/samples/3d-polyline/jsfiddle/demo.js
index 785b084e..36e89cdd 100644
--- a/dist/samples/3d-polyline/jsfiddle/demo.js
+++ b/dist/samples/3d-polyline/jsfiddle/demo.js
@@ -1,18 +1,21 @@
"use strict";
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
// @ts-nocheck
let map;
async function init() {
- const { Map3DElement, MapMode, AltitudeMode, Polyline3DElement } = await google.maps.importLibrary("maps3d");
+ const { Map3DElement, MapMode, AltitudeMode, Polyline3DElement } = await google.maps.importLibrary('maps3d');
map = new Map3DElement({
- center: { lat: 37.7927, lng: -122.4020, altitude: 65.93 }, range: 3362.87, tilt: 64.01, heading: 25.00,
+ center: { lat: 37.7927, lng: -122.402, altitude: 65.93 },
+ range: 3362.87,
+ tilt: 64.01,
+ heading: 25.0,
mode: MapMode.SATELLITE,
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
document.body.append(map);
const polyline = new Polyline3DElement({
@@ -27,7 +30,7 @@ async function init() {
{ lat: 37.78861484290265, lng: -122.4019489189814 },
{ lat: 37.78618687561075, lng: -122.398969592545 },
{ lat: 37.7892310309145, lng: -122.3951458683092 },
- { lat: 37.7916358762409, lng: -122.3981969390652 }
+ { lat: 37.7916358762409, lng: -122.3981969390652 },
],
strokeColor: 'blue',
outerColor: 'white',
diff --git a/dist/samples/3d-popover-location/app/README.md b/dist/samples/3d-popover-location/app/README.md
index 36ae4137..218d1c95 100644
--- a/dist/samples/3d-popover-location/app/README.md
+++ b/dist/samples/3d-popover-location/app/README.md
@@ -32,4 +32,4 @@ From `samples/`:
## Feedback
For feedback related to this sample, please open a new issue on
-[GitHub](https://github.com/googlemaps-samples/js-api-samples/issues).
\ No newline at end of file
+[GitHub](https://github.com/googlemaps-samples/js-api-samples/issues).
diff --git a/dist/samples/3d-popover-location/app/index.html b/dist/samples/3d-popover-location/app/index.html
index 994c96d1..c1fd2d24 100644
--- a/dist/samples/3d-popover-location/app/index.html
+++ b/dist/samples/3d-popover-location/app/index.html
@@ -6,18 +6,18 @@
-->
-
- Map
+
+ Map
-
-
-
-
-
+
+
+
+
+
-
-
-
+
-
\ No newline at end of file
+
diff --git a/dist/samples/3d-popover-location/app/index.ts b/dist/samples/3d-popover-location/app/index.ts
index 51cbd489..d11f41da 100644
--- a/dist/samples/3d-popover-location/app/index.ts
+++ b/dist/samples/3d-popover-location/app/index.ts
@@ -1,32 +1,35 @@
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
// @ts-nocheck
// [START maps_3d_popover_location]
async function init() {
-const { AltitudeMode, Map3DElement, MapMode, PopoverElement } = await google.maps.importLibrary("maps3d");
+ const { AltitudeMode, Map3DElement, MapMode, PopoverElement } =
+ await google.maps.importLibrary('maps3d');
-const map = new Map3DElement({
- center: { lat: 37.8204, lng : -122.4783, altitude: 0.407 }, range: 4000, tilt: 74 ,heading: 38,
- mode: MapMode.HYBRID,
- gestureHandling: "COOPERATIVE"
-});
+ const map = new Map3DElement({
+ center: { lat: 37.8204, lng: -122.4783, altitude: 0.407 },
+ range: 4000,
+ tilt: 74,
+ heading: 38,
+ mode: MapMode.HYBRID,
+ gestureHandling: 'COOPERATIVE',
+ });
-const popover = new PopoverElement({
- altitudeMode: AltitudeMode.ABSOLUTE,
- open: true,
- positionAnchor: { lat: 37.819852, lng: -122.478549, altitude: 150 },
-});
+ const popover = new PopoverElement({
+ altitudeMode: AltitudeMode.ABSOLUTE,
+ open: true,
+ positionAnchor: { lat: 37.819852, lng: -122.478549, altitude: 150 },
+ });
-popover.append('Golden Gate Bridge');
+ popover.append('Golden Gate Bridge');
-map.append(popover);
-
-document.body.append(map);
+ map.append(popover);
+ document.body.append(map);
}
init();
diff --git a/dist/samples/3d-popover-location/app/style.css b/dist/samples/3d-popover-location/app/style.css
index 0e4ebafb..894fb328 100644
--- a/dist/samples/3d-popover-location/app/style.css
+++ b/dist/samples/3d-popover-location/app/style.css
@@ -14,6 +14,6 @@ body {
padding: 0;
}
map {
- height: 100%;
+ height: 100%;
}
/* [END maps_3d_popover_location] */
diff --git a/dist/samples/3d-popover-location/dist/index.html b/dist/samples/3d-popover-location/dist/index.html
index 586887eb..866056ef 100644
--- a/dist/samples/3d-popover-location/dist/index.html
+++ b/dist/samples/3d-popover-location/dist/index.html
@@ -6,18 +6,18 @@
-->
-
- Map
+
+ Map
-
-
-
-
-
+
+
+
+
+
-
-
-
+
-
\ No newline at end of file
+
diff --git a/dist/samples/3d-popover-location/docs/index.html b/dist/samples/3d-popover-location/docs/index.html
index 994c96d1..c1fd2d24 100644
--- a/dist/samples/3d-popover-location/docs/index.html
+++ b/dist/samples/3d-popover-location/docs/index.html
@@ -6,18 +6,18 @@
-->
-
- Map
+
+ Map
-
-
-
-
-
+
+
+
+
+
-
-
-
+
-
\ No newline at end of file
+
diff --git a/dist/samples/3d-popover-location/docs/index.js b/dist/samples/3d-popover-location/docs/index.js
index 0111b9a8..e0a594a1 100644
--- a/dist/samples/3d-popover-location/docs/index.js
+++ b/dist/samples/3d-popover-location/docs/index.js
@@ -1,17 +1,20 @@
"use strict";
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
// @ts-nocheck
// [START maps_3d_popover_location]
async function init() {
- const { AltitudeMode, Map3DElement, MapMode, PopoverElement } = await google.maps.importLibrary("maps3d");
+ const { AltitudeMode, Map3DElement, MapMode, PopoverElement } = await google.maps.importLibrary('maps3d');
const map = new Map3DElement({
- center: { lat: 37.8204, lng: -122.4783, altitude: 0.407 }, range: 4000, tilt: 74, heading: 38,
+ center: { lat: 37.8204, lng: -122.4783, altitude: 0.407 },
+ range: 4000,
+ tilt: 74,
+ heading: 38,
mode: MapMode.HYBRID,
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
const popover = new PopoverElement({
altitudeMode: AltitudeMode.ABSOLUTE,
diff --git a/dist/samples/3d-popover-location/docs/index.ts b/dist/samples/3d-popover-location/docs/index.ts
index 51cbd489..d11f41da 100644
--- a/dist/samples/3d-popover-location/docs/index.ts
+++ b/dist/samples/3d-popover-location/docs/index.ts
@@ -1,32 +1,35 @@
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
// @ts-nocheck
// [START maps_3d_popover_location]
async function init() {
-const { AltitudeMode, Map3DElement, MapMode, PopoverElement } = await google.maps.importLibrary("maps3d");
+ const { AltitudeMode, Map3DElement, MapMode, PopoverElement } =
+ await google.maps.importLibrary('maps3d');
-const map = new Map3DElement({
- center: { lat: 37.8204, lng : -122.4783, altitude: 0.407 }, range: 4000, tilt: 74 ,heading: 38,
- mode: MapMode.HYBRID,
- gestureHandling: "COOPERATIVE"
-});
+ const map = new Map3DElement({
+ center: { lat: 37.8204, lng: -122.4783, altitude: 0.407 },
+ range: 4000,
+ tilt: 74,
+ heading: 38,
+ mode: MapMode.HYBRID,
+ gestureHandling: 'COOPERATIVE',
+ });
-const popover = new PopoverElement({
- altitudeMode: AltitudeMode.ABSOLUTE,
- open: true,
- positionAnchor: { lat: 37.819852, lng: -122.478549, altitude: 150 },
-});
+ const popover = new PopoverElement({
+ altitudeMode: AltitudeMode.ABSOLUTE,
+ open: true,
+ positionAnchor: { lat: 37.819852, lng: -122.478549, altitude: 150 },
+ });
-popover.append('Golden Gate Bridge');
+ popover.append('Golden Gate Bridge');
-map.append(popover);
-
-document.body.append(map);
+ map.append(popover);
+ document.body.append(map);
}
init();
diff --git a/dist/samples/3d-popover-location/docs/style.css b/dist/samples/3d-popover-location/docs/style.css
index 0e4ebafb..894fb328 100644
--- a/dist/samples/3d-popover-location/docs/style.css
+++ b/dist/samples/3d-popover-location/docs/style.css
@@ -14,6 +14,6 @@ body {
padding: 0;
}
map {
- height: 100%;
+ height: 100%;
}
/* [END maps_3d_popover_location] */
diff --git a/dist/samples/3d-popover-location/jsfiddle/demo.css b/dist/samples/3d-popover-location/jsfiddle/demo.css
index 0be67c08..bf49901d 100644
--- a/dist/samples/3d-popover-location/jsfiddle/demo.css
+++ b/dist/samples/3d-popover-location/jsfiddle/demo.css
@@ -14,6 +14,6 @@ body {
padding: 0;
}
map {
- height: 100%;
+ height: 100%;
}
diff --git a/dist/samples/3d-popover-location/jsfiddle/demo.html b/dist/samples/3d-popover-location/jsfiddle/demo.html
index 587eabf5..9501b596 100644
--- a/dist/samples/3d-popover-location/jsfiddle/demo.html
+++ b/dist/samples/3d-popover-location/jsfiddle/demo.html
@@ -6,17 +6,18 @@
-->
-
- Map
+
+ Map
-
-
-
-
-
+
+
+
+
+
-
-
-
+
+
diff --git a/dist/samples/3d-popover-location/jsfiddle/demo.js b/dist/samples/3d-popover-location/jsfiddle/demo.js
index 228c99ae..e03f617d 100644
--- a/dist/samples/3d-popover-location/jsfiddle/demo.js
+++ b/dist/samples/3d-popover-location/jsfiddle/demo.js
@@ -1,17 +1,20 @@
"use strict";
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
// @ts-nocheck
async function init() {
- const { AltitudeMode, Map3DElement, MapMode, PopoverElement } = await google.maps.importLibrary("maps3d");
+ const { AltitudeMode, Map3DElement, MapMode, PopoverElement } = await google.maps.importLibrary('maps3d');
const map = new Map3DElement({
- center: { lat: 37.8204, lng: -122.4783, altitude: 0.407 }, range: 4000, tilt: 74, heading: 38,
+ center: { lat: 37.8204, lng: -122.4783, altitude: 0.407 },
+ range: 4000,
+ tilt: 74,
+ heading: 38,
mode: MapMode.HYBRID,
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
const popover = new PopoverElement({
altitudeMode: AltitudeMode.ABSOLUTE,
diff --git a/dist/samples/3d-popover-marker/app/README.md b/dist/samples/3d-popover-marker/app/README.md
index d113a5d7..01d817f9 100644
--- a/dist/samples/3d-popover-marker/app/README.md
+++ b/dist/samples/3d-popover-marker/app/README.md
@@ -32,4 +32,4 @@ From `samples/`:
## Feedback
For feedback related to this sample, please open a new issue on
-[GitHub](https://github.com/googlemaps-samples/js-api-samples/issues).
\ No newline at end of file
+[GitHub](https://github.com/googlemaps-samples/js-api-samples/issues).
diff --git a/dist/samples/3d-popover-marker/app/index.html b/dist/samples/3d-popover-marker/app/index.html
index 0f962f6d..ec542671 100644
--- a/dist/samples/3d-popover-marker/app/index.html
+++ b/dist/samples/3d-popover-marker/app/index.html
@@ -6,18 +6,18 @@
-->
-
- Map
+
+ Map
-
-
-
-
-
+
+
+
+
+
-
-
-
+
-
\ No newline at end of file
+
diff --git a/dist/samples/3d-popover-marker/app/index.ts b/dist/samples/3d-popover-marker/app/index.ts
index fb16eb54..2b5735db 100644
--- a/dist/samples/3d-popover-marker/app/index.ts
+++ b/dist/samples/3d-popover-marker/app/index.ts
@@ -1,24 +1,33 @@
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
// @ts-nocheck
// [START maps_3d_popover_marker]
async function init() {
- const { AltitudeMode, Map3DElement, Marker3DInteractiveElement, MapMode, PopoverElement } = await google.maps.importLibrary("maps3d");
+ const {
+ AltitudeMode,
+ Map3DElement,
+ Marker3DInteractiveElement,
+ MapMode,
+ PopoverElement,
+ } = await google.maps.importLibrary('maps3d');
const map = new Map3DElement({
- center: { lat: 37.8204, lng: -122.4783, altitude: 0.407 }, range: 4000, tilt: 74, heading: 38,
+ center: { lat: 37.8204, lng: -122.4783, altitude: 0.407 },
+ range: 4000,
+ tilt: 74,
+ heading: 38,
mode: MapMode.HYBRID,
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
// Popovers can only be added to interactive Markers
const interactiveMarker = new Marker3DInteractiveElement({
altitudeMode: AltitudeMode.ABSOLUTE,
- position: { lat: 37.819852, lng: -122.478549, altitude: 100 }
+ position: { lat: 37.819852, lng: -122.478549, altitude: 100 },
});
const popover = new PopoverElement({
@@ -37,7 +46,6 @@ async function init() {
map.append(popover);
document.body.append(map);
-
}
init();
diff --git a/dist/samples/3d-popover-marker/app/style.css b/dist/samples/3d-popover-marker/app/style.css
index 18fccad3..59461c24 100644
--- a/dist/samples/3d-popover-marker/app/style.css
+++ b/dist/samples/3d-popover-marker/app/style.css
@@ -9,7 +9,7 @@
*/
html,
map {
- height: 100%;
+ height: 100%;
}
body {
height: 100%;
diff --git a/dist/samples/3d-popover-marker/dist/index.html b/dist/samples/3d-popover-marker/dist/index.html
index 8273f692..f25abe23 100644
--- a/dist/samples/3d-popover-marker/dist/index.html
+++ b/dist/samples/3d-popover-marker/dist/index.html
@@ -6,18 +6,18 @@
-->
-
- Map
+
+ Map
-
-
-
-
-
+
+
+
+
+
-
-
-
+
-
\ No newline at end of file
+
diff --git a/dist/samples/3d-popover-marker/docs/index.html b/dist/samples/3d-popover-marker/docs/index.html
index 0f962f6d..ec542671 100644
--- a/dist/samples/3d-popover-marker/docs/index.html
+++ b/dist/samples/3d-popover-marker/docs/index.html
@@ -6,18 +6,18 @@
-->
-
- Map
+
+ Map
-
-
-
-
-
+
+
+
+
+
-
-
-
+
-
\ No newline at end of file
+
diff --git a/dist/samples/3d-popover-marker/docs/index.js b/dist/samples/3d-popover-marker/docs/index.js
index b8805269..bcb1f257 100644
--- a/dist/samples/3d-popover-marker/docs/index.js
+++ b/dist/samples/3d-popover-marker/docs/index.js
@@ -1,22 +1,25 @@
"use strict";
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
// @ts-nocheck
// [START maps_3d_popover_marker]
async function init() {
- const { AltitudeMode, Map3DElement, Marker3DInteractiveElement, MapMode, PopoverElement } = await google.maps.importLibrary("maps3d");
+ const { AltitudeMode, Map3DElement, Marker3DInteractiveElement, MapMode, PopoverElement, } = await google.maps.importLibrary('maps3d');
const map = new Map3DElement({
- center: { lat: 37.8204, lng: -122.4783, altitude: 0.407 }, range: 4000, tilt: 74, heading: 38,
+ center: { lat: 37.8204, lng: -122.4783, altitude: 0.407 },
+ range: 4000,
+ tilt: 74,
+ heading: 38,
mode: MapMode.HYBRID,
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
// Popovers can only be added to interactive Markers
const interactiveMarker = new Marker3DInteractiveElement({
altitudeMode: AltitudeMode.ABSOLUTE,
- position: { lat: 37.819852, lng: -122.478549, altitude: 100 }
+ position: { lat: 37.819852, lng: -122.478549, altitude: 100 },
});
const popover = new PopoverElement({
open: false,
diff --git a/dist/samples/3d-popover-marker/docs/index.ts b/dist/samples/3d-popover-marker/docs/index.ts
index fb16eb54..2b5735db 100644
--- a/dist/samples/3d-popover-marker/docs/index.ts
+++ b/dist/samples/3d-popover-marker/docs/index.ts
@@ -1,24 +1,33 @@
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
// @ts-nocheck
// [START maps_3d_popover_marker]
async function init() {
- const { AltitudeMode, Map3DElement, Marker3DInteractiveElement, MapMode, PopoverElement } = await google.maps.importLibrary("maps3d");
+ const {
+ AltitudeMode,
+ Map3DElement,
+ Marker3DInteractiveElement,
+ MapMode,
+ PopoverElement,
+ } = await google.maps.importLibrary('maps3d');
const map = new Map3DElement({
- center: { lat: 37.8204, lng: -122.4783, altitude: 0.407 }, range: 4000, tilt: 74, heading: 38,
+ center: { lat: 37.8204, lng: -122.4783, altitude: 0.407 },
+ range: 4000,
+ tilt: 74,
+ heading: 38,
mode: MapMode.HYBRID,
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
// Popovers can only be added to interactive Markers
const interactiveMarker = new Marker3DInteractiveElement({
altitudeMode: AltitudeMode.ABSOLUTE,
- position: { lat: 37.819852, lng: -122.478549, altitude: 100 }
+ position: { lat: 37.819852, lng: -122.478549, altitude: 100 },
});
const popover = new PopoverElement({
@@ -37,7 +46,6 @@ async function init() {
map.append(popover);
document.body.append(map);
-
}
init();
diff --git a/dist/samples/3d-popover-marker/docs/style.css b/dist/samples/3d-popover-marker/docs/style.css
index 18fccad3..59461c24 100644
--- a/dist/samples/3d-popover-marker/docs/style.css
+++ b/dist/samples/3d-popover-marker/docs/style.css
@@ -9,7 +9,7 @@
*/
html,
map {
- height: 100%;
+ height: 100%;
}
body {
height: 100%;
diff --git a/dist/samples/3d-popover-marker/jsfiddle/demo.css b/dist/samples/3d-popover-marker/jsfiddle/demo.css
index 0f518779..d6ec582a 100644
--- a/dist/samples/3d-popover-marker/jsfiddle/demo.css
+++ b/dist/samples/3d-popover-marker/jsfiddle/demo.css
@@ -9,7 +9,7 @@
*/
html,
map {
- height: 100%;
+ height: 100%;
}
body {
height: 100%;
diff --git a/dist/samples/3d-popover-marker/jsfiddle/demo.html b/dist/samples/3d-popover-marker/jsfiddle/demo.html
index 587eabf5..9501b596 100644
--- a/dist/samples/3d-popover-marker/jsfiddle/demo.html
+++ b/dist/samples/3d-popover-marker/jsfiddle/demo.html
@@ -6,17 +6,18 @@
-->
-
- Map
+
+ Map
-
-
-
-
-
+
+
+
+
+
-
-
-
+
+
diff --git a/dist/samples/3d-popover-marker/jsfiddle/demo.js b/dist/samples/3d-popover-marker/jsfiddle/demo.js
index eabd515c..b92eac84 100644
--- a/dist/samples/3d-popover-marker/jsfiddle/demo.js
+++ b/dist/samples/3d-popover-marker/jsfiddle/demo.js
@@ -1,22 +1,25 @@
"use strict";
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
// @ts-nocheck
async function init() {
- const { AltitudeMode, Map3DElement, Marker3DInteractiveElement, MapMode, PopoverElement } = await google.maps.importLibrary("maps3d");
+ const { AltitudeMode, Map3DElement, Marker3DInteractiveElement, MapMode, PopoverElement, } = await google.maps.importLibrary('maps3d');
const map = new Map3DElement({
- center: { lat: 37.8204, lng: -122.4783, altitude: 0.407 }, range: 4000, tilt: 74, heading: 38,
+ center: { lat: 37.8204, lng: -122.4783, altitude: 0.407 },
+ range: 4000,
+ tilt: 74,
+ heading: 38,
mode: MapMode.HYBRID,
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
// Popovers can only be added to interactive Markers
const interactiveMarker = new Marker3DInteractiveElement({
altitudeMode: AltitudeMode.ABSOLUTE,
- position: { lat: 37.819852, lng: -122.478549, altitude: 100 }
+ position: { lat: 37.819852, lng: -122.478549, altitude: 100 },
});
const popover = new PopoverElement({
open: false,
diff --git a/dist/samples/3d-simple-map-declarative/app/README.md b/dist/samples/3d-simple-map-declarative/app/README.md
index 62904810..5c63badc 100644
--- a/dist/samples/3d-simple-map-declarative/app/README.md
+++ b/dist/samples/3d-simple-map-declarative/app/README.md
@@ -1,7 +1,10 @@
# Google Maps JavaScript Sample
-This sample is generated from @googlemaps/js-samples located at
-https://github.com/googlemaps-samples/js-api-samples.
+## 3d-simple-map-declarative
+
+The 3d-simple-map-declarative sample demonstrates how to create a simple 3D map using a declarative approach.
+
+Follow these instructions to set up and run 3d-simple-map-declarative sample on your local computer.
## Setup
@@ -19,7 +22,7 @@ First `cd` to the folder for the sample to run, then:
From `samples/`:
-`$npm run build --workspace=sample-name/`
+`$npm run build --workspace=3d-simple-map-declarative/`
### Build all of the examples.
@@ -30,4 +33,3 @@ From `samples/`:
For feedback related to this sample, please open a new issue on
[GitHub](https://github.com/googlemaps-samples/js-api-samples/issues).
-
diff --git a/dist/samples/3d-simple-map-declarative/app/index.html b/dist/samples/3d-simple-map-declarative/app/index.html
index bf89cc27..ff85888b 100644
--- a/dist/samples/3d-simple-map-declarative/app/index.html
+++ b/dist/samples/3d-simple-map-declarative/app/index.html
@@ -6,15 +6,19 @@
-->
-
- Map
-
-
-
-
+
+ Map
+
+
+
+
-
-
+
+
diff --git a/dist/samples/3d-simple-map-declarative/app/index.ts b/dist/samples/3d-simple-map-declarative/app/index.ts
index ce09c184..aa62c7ce 100644
--- a/dist/samples/3d-simple-map-declarative/app/index.ts
+++ b/dist/samples/3d-simple-map-declarative/app/index.ts
@@ -1,8 +1,8 @@
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
// @ts-nocheck
// [START maps_3d_simple_map_declarative]
diff --git a/dist/samples/3d-simple-map-declarative/dist/assets/index-BgMuHnVn.css b/dist/samples/3d-simple-map-declarative/dist/assets/index-BgMuHnVn.css
new file mode 100644
index 00000000..76ca6d7b
--- /dev/null
+++ b/dist/samples/3d-simple-map-declarative/dist/assets/index-BgMuHnVn.css
@@ -0,0 +1 @@
+html,gmp-map-3d{height:100%}html,body{height:100%;margin:0;padding:0}
diff --git a/dist/samples/3d-simple-map-declarative/dist/assets/index-BlXa5a9u.css b/dist/samples/3d-simple-map-declarative/dist/assets/index-BlXa5a9u.css
deleted file mode 100644
index ccf50775..00000000
--- a/dist/samples/3d-simple-map-declarative/dist/assets/index-BlXa5a9u.css
+++ /dev/null
@@ -1,5 +0,0 @@
-/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/html,gmp-map-3d{height:100%}html,body{height:100%;margin:0;padding:0}
diff --git a/dist/samples/3d-simple-map-declarative/dist/index.html b/dist/samples/3d-simple-map-declarative/dist/index.html
index 57ff2088..578882ad 100644
--- a/dist/samples/3d-simple-map-declarative/dist/index.html
+++ b/dist/samples/3d-simple-map-declarative/dist/index.html
@@ -6,15 +6,19 @@
-->
-
- Map
-
-
-
-
+
+ Map
+
+
+
+
-
-
+
+
diff --git a/dist/samples/3d-simple-map-declarative/docs/index.html b/dist/samples/3d-simple-map-declarative/docs/index.html
index bf89cc27..ff85888b 100644
--- a/dist/samples/3d-simple-map-declarative/docs/index.html
+++ b/dist/samples/3d-simple-map-declarative/docs/index.html
@@ -6,15 +6,19 @@
-->
-
- Map
-
-
-
-
+
+ Map
+
+
+
+
-
-
+
+
diff --git a/dist/samples/3d-simple-map-declarative/docs/index.js b/dist/samples/3d-simple-map-declarative/docs/index.js
index e3502401..49363e6f 100644
--- a/dist/samples/3d-simple-map-declarative/docs/index.js
+++ b/dist/samples/3d-simple-map-declarative/docs/index.js
@@ -1,9 +1,9 @@
"use strict";
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
// @ts-nocheck
// [START maps_3d_simple_map_declarative]
// [END maps_3d_simple_map_declarative]
diff --git a/dist/samples/3d-simple-map-declarative/docs/index.ts b/dist/samples/3d-simple-map-declarative/docs/index.ts
index ce09c184..aa62c7ce 100644
--- a/dist/samples/3d-simple-map-declarative/docs/index.ts
+++ b/dist/samples/3d-simple-map-declarative/docs/index.ts
@@ -1,8 +1,8 @@
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
// @ts-nocheck
// [START maps_3d_simple_map_declarative]
diff --git a/dist/samples/3d-simple-map-declarative/jsfiddle/demo.html b/dist/samples/3d-simple-map-declarative/jsfiddle/demo.html
index cb26e9cc..4271224a 100644
--- a/dist/samples/3d-simple-map-declarative/jsfiddle/demo.html
+++ b/dist/samples/3d-simple-map-declarative/jsfiddle/demo.html
@@ -6,15 +6,19 @@
-->
-
- Map
-
-
-
-
+
+ Map
+
+
+
+
-
-
+
+
diff --git a/dist/samples/3d-simple-map-declarative/jsfiddle/demo.js b/dist/samples/3d-simple-map-declarative/jsfiddle/demo.js
index b2e755f0..4130b7d4 100644
--- a/dist/samples/3d-simple-map-declarative/jsfiddle/demo.js
+++ b/dist/samples/3d-simple-map-declarative/jsfiddle/demo.js
@@ -1,9 +1,9 @@
"use strict";
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
// @ts-nocheck
diff --git a/dist/samples/3d-simple-map/app/README.md b/dist/samples/3d-simple-map/app/README.md
index c263bc72..8c4400f9 100644
--- a/dist/samples/3d-simple-map/app/README.md
+++ b/dist/samples/3d-simple-map/app/README.md
@@ -32,4 +32,4 @@ From `samples/`:
## Feedback
For feedback related to this sample, please open a new issue on
-[GitHub](https://github.com/googlemaps-samples/js-api-samples/issues).
\ No newline at end of file
+[GitHub](https://github.com/googlemaps-samples/js-api-samples/issues).
diff --git a/dist/samples/3d-simple-map/app/index.html b/dist/samples/3d-simple-map/app/index.html
index a287f03b..24ab4306 100644
--- a/dist/samples/3d-simple-map/app/index.html
+++ b/dist/samples/3d-simple-map/app/index.html
@@ -6,17 +6,16 @@
-->
-
- Simple Map
+
+ Simple Map
-
-
-
-
-
-
-
+
+
+
+
-
+
diff --git a/dist/samples/3d-simple-map/app/index.ts b/dist/samples/3d-simple-map/app/index.ts
index 43d8d35b..4cee1831 100644
--- a/dist/samples/3d-simple-map/app/index.ts
+++ b/dist/samples/3d-simple-map/app/index.ts
@@ -1,19 +1,19 @@
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
//@ts-nocheck
// [START maps_3d_simple_map]
async function initMap() {
- const { Map3DElement } = await google.maps.importLibrary("maps3d");
+ const { Map3DElement } = await google.maps.importLibrary('maps3d');
const map = new Map3DElement({
center: { lat: 37.7704, lng: -122.3985, altitude: 500 },
tilt: 67.5,
mode: 'HYBRID',
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
document.body.append(map);
diff --git a/dist/samples/3d-simple-map/app/style.css b/dist/samples/3d-simple-map/app/style.css
index 7624a816..db29d516 100644
--- a/dist/samples/3d-simple-map/app/style.css
+++ b/dist/samples/3d-simple-map/app/style.css
@@ -8,7 +8,7 @@
* that contains the map.
*/
#gmp-map-3d {
- height: 100%;
+ height: 100%;
}
html,
body {
diff --git a/dist/samples/3d-simple-map/dist/index.html b/dist/samples/3d-simple-map/dist/index.html
index 3cdc566b..5a1b82f2 100644
--- a/dist/samples/3d-simple-map/dist/index.html
+++ b/dist/samples/3d-simple-map/dist/index.html
@@ -6,17 +6,16 @@
-->
-
- Simple Map
+
+ Simple Map
-
-
-
-
-
-
-
+
+
+
+
+
-
+
diff --git a/dist/samples/3d-simple-map/docs/index.html b/dist/samples/3d-simple-map/docs/index.html
index a287f03b..24ab4306 100644
--- a/dist/samples/3d-simple-map/docs/index.html
+++ b/dist/samples/3d-simple-map/docs/index.html
@@ -6,17 +6,16 @@
-->
-
- Simple Map
+
+ Simple Map
-
-
-
-
-
-
-
+
+
+
+
-
+
diff --git a/dist/samples/3d-simple-map/docs/index.js b/dist/samples/3d-simple-map/docs/index.js
index c58884b2..c108e45d 100644
--- a/dist/samples/3d-simple-map/docs/index.js
+++ b/dist/samples/3d-simple-map/docs/index.js
@@ -1,18 +1,18 @@
"use strict";
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
//@ts-nocheck
// [START maps_3d_simple_map]
async function initMap() {
- const { Map3DElement } = await google.maps.importLibrary("maps3d");
+ const { Map3DElement } = await google.maps.importLibrary('maps3d');
const map = new Map3DElement({
center: { lat: 37.7704, lng: -122.3985, altitude: 500 },
tilt: 67.5,
mode: 'HYBRID',
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
document.body.append(map);
}
diff --git a/dist/samples/3d-simple-map/docs/index.ts b/dist/samples/3d-simple-map/docs/index.ts
index 43d8d35b..4cee1831 100644
--- a/dist/samples/3d-simple-map/docs/index.ts
+++ b/dist/samples/3d-simple-map/docs/index.ts
@@ -1,19 +1,19 @@
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
//@ts-nocheck
// [START maps_3d_simple_map]
async function initMap() {
- const { Map3DElement } = await google.maps.importLibrary("maps3d");
+ const { Map3DElement } = await google.maps.importLibrary('maps3d');
const map = new Map3DElement({
center: { lat: 37.7704, lng: -122.3985, altitude: 500 },
tilt: 67.5,
mode: 'HYBRID',
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
document.body.append(map);
diff --git a/dist/samples/3d-simple-map/docs/style.css b/dist/samples/3d-simple-map/docs/style.css
index 7624a816..db29d516 100644
--- a/dist/samples/3d-simple-map/docs/style.css
+++ b/dist/samples/3d-simple-map/docs/style.css
@@ -8,7 +8,7 @@
* that contains the map.
*/
#gmp-map-3d {
- height: 100%;
+ height: 100%;
}
html,
body {
diff --git a/dist/samples/3d-simple-map/jsfiddle/demo.css b/dist/samples/3d-simple-map/jsfiddle/demo.css
index 76f40072..c50e5fa5 100644
--- a/dist/samples/3d-simple-map/jsfiddle/demo.css
+++ b/dist/samples/3d-simple-map/jsfiddle/demo.css
@@ -8,7 +8,7 @@
* that contains the map.
*/
#gmp-map-3d {
- height: 100%;
+ height: 100%;
}
html,
body {
diff --git a/dist/samples/3d-simple-map/jsfiddle/demo.html b/dist/samples/3d-simple-map/jsfiddle/demo.html
index a4cb9771..340dfb2b 100644
--- a/dist/samples/3d-simple-map/jsfiddle/demo.html
+++ b/dist/samples/3d-simple-map/jsfiddle/demo.html
@@ -6,17 +6,16 @@
-->
-
- Simple Map
+
+ Simple Map
-
-
-
-
-
-
-
+
+
+
+
-
+
diff --git a/dist/samples/3d-simple-map/jsfiddle/demo.js b/dist/samples/3d-simple-map/jsfiddle/demo.js
index 958839f4..2e462af5 100644
--- a/dist/samples/3d-simple-map/jsfiddle/demo.js
+++ b/dist/samples/3d-simple-map/jsfiddle/demo.js
@@ -1,18 +1,18 @@
"use strict";
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
//@ts-nocheck
async function initMap() {
- const { Map3DElement } = await google.maps.importLibrary("maps3d");
+ const { Map3DElement } = await google.maps.importLibrary('maps3d');
const map = new Map3DElement({
center: { lat: 37.7704, lng: -122.3985, altitude: 500 },
tilt: 67.5,
mode: 'HYBRID',
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
document.body.append(map);
}
diff --git a/dist/samples/3d-simple-marker/app/README.md b/dist/samples/3d-simple-marker/app/README.md
index 478b4325..26037767 100644
--- a/dist/samples/3d-simple-marker/app/README.md
+++ b/dist/samples/3d-simple-marker/app/README.md
@@ -32,4 +32,4 @@ From `samples/`:
## Feedback
For feedback related to this sample, please open a new issue on
-[GitHub](https://github.com/googlemaps-samples/js-api-samples/issues).
\ No newline at end of file
+[GitHub](https://github.com/googlemaps-samples/js-api-samples/issues).
diff --git a/dist/samples/3d-simple-marker/app/index.html b/dist/samples/3d-simple-marker/app/index.html
index e376a305..11b584f5 100644
--- a/dist/samples/3d-simple-marker/app/index.html
+++ b/dist/samples/3d-simple-marker/app/index.html
@@ -6,18 +6,18 @@
-->
-
- Map
+
+ Map
-
-
-
-
-
+
+
+
+
+
-
-
-
+
diff --git a/dist/samples/3d-simple-marker/app/index.ts b/dist/samples/3d-simple-marker/app/index.ts
index 954e5225..00dd07e4 100644
--- a/dist/samples/3d-simple-marker/app/index.ts
+++ b/dist/samples/3d-simple-marker/app/index.ts
@@ -1,27 +1,28 @@
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
//@ts-nocheck
// [START maps_3d_simple_marker]
async function init() {
// Make sure the Marker3DElement is included.
- const { Map3DElement, Marker3DElement } = await google.maps.importLibrary("maps3d");
+ const { Map3DElement, Marker3DElement } =
+ await google.maps.importLibrary('maps3d');
const map = new Map3DElement({
center: { lat: 37.4239163, lng: -122.0947209, altitude: 0 },
tilt: 67.5,
range: 1000,
mode: 'SATELLITE',
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
-
+
const marker = new Marker3DElement({
position: { lat: 37.4239163, lng: -122.0947209, altitude: 50 }, // (Required) Marker must have a lat / lng, but doesn't need an altitude.
- altitudeMode : "ABSOLUTE", // (Optional) Treated as CLAMP_TO_GROUND if omitted.
- extruded : true, // (Optional) Draws line from ground to the bottom of the marker.
- label : "Basic Marker" // (Optional) Add a label to the marker.
+ altitudeMode: 'ABSOLUTE', // (Optional) Treated as CLAMP_TO_GROUND if omitted.
+ extruded: true, // (Optional) Draws line from ground to the bottom of the marker.
+ label: 'Basic Marker', // (Optional) Add a label to the marker.
});
map.append(marker); // The marker must be appended to the map.
diff --git a/dist/samples/3d-simple-marker/dist/index.html b/dist/samples/3d-simple-marker/dist/index.html
index 2829ebbf..18a04725 100644
--- a/dist/samples/3d-simple-marker/dist/index.html
+++ b/dist/samples/3d-simple-marker/dist/index.html
@@ -6,18 +6,18 @@
-->
-
- Map
+
+ Map
-
-
-
-
-
+
+
+
+
+
-
-
-
+
diff --git a/dist/samples/3d-simple-marker/docs/index.html b/dist/samples/3d-simple-marker/docs/index.html
index e376a305..11b584f5 100644
--- a/dist/samples/3d-simple-marker/docs/index.html
+++ b/dist/samples/3d-simple-marker/docs/index.html
@@ -6,18 +6,18 @@
-->
-
- Map
+
+ Map
-
-
-
-
-
+
+
+
+
+
-
-
-
+
diff --git a/dist/samples/3d-simple-marker/docs/index.js b/dist/samples/3d-simple-marker/docs/index.js
index 87e850ef..3c79484f 100644
--- a/dist/samples/3d-simple-marker/docs/index.js
+++ b/dist/samples/3d-simple-marker/docs/index.js
@@ -1,26 +1,26 @@
"use strict";
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
//@ts-nocheck
// [START maps_3d_simple_marker]
async function init() {
// Make sure the Marker3DElement is included.
- const { Map3DElement, Marker3DElement } = await google.maps.importLibrary("maps3d");
+ const { Map3DElement, Marker3DElement } = await google.maps.importLibrary('maps3d');
const map = new Map3DElement({
center: { lat: 37.4239163, lng: -122.0947209, altitude: 0 },
tilt: 67.5,
range: 1000,
mode: 'SATELLITE',
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
const marker = new Marker3DElement({
position: { lat: 37.4239163, lng: -122.0947209, altitude: 50 }, // (Required) Marker must have a lat / lng, but doesn't need an altitude.
- altitudeMode: "ABSOLUTE", // (Optional) Treated as CLAMP_TO_GROUND if omitted.
+ altitudeMode: 'ABSOLUTE', // (Optional) Treated as CLAMP_TO_GROUND if omitted.
extruded: true, // (Optional) Draws line from ground to the bottom of the marker.
- label: "Basic Marker" // (Optional) Add a label to the marker.
+ label: 'Basic Marker', // (Optional) Add a label to the marker.
});
map.append(marker); // The marker must be appended to the map.
document.body.append(map);
diff --git a/dist/samples/3d-simple-marker/docs/index.ts b/dist/samples/3d-simple-marker/docs/index.ts
index 954e5225..00dd07e4 100644
--- a/dist/samples/3d-simple-marker/docs/index.ts
+++ b/dist/samples/3d-simple-marker/docs/index.ts
@@ -1,27 +1,28 @@
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
//@ts-nocheck
// [START maps_3d_simple_marker]
async function init() {
// Make sure the Marker3DElement is included.
- const { Map3DElement, Marker3DElement } = await google.maps.importLibrary("maps3d");
+ const { Map3DElement, Marker3DElement } =
+ await google.maps.importLibrary('maps3d');
const map = new Map3DElement({
center: { lat: 37.4239163, lng: -122.0947209, altitude: 0 },
tilt: 67.5,
range: 1000,
mode: 'SATELLITE',
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
-
+
const marker = new Marker3DElement({
position: { lat: 37.4239163, lng: -122.0947209, altitude: 50 }, // (Required) Marker must have a lat / lng, but doesn't need an altitude.
- altitudeMode : "ABSOLUTE", // (Optional) Treated as CLAMP_TO_GROUND if omitted.
- extruded : true, // (Optional) Draws line from ground to the bottom of the marker.
- label : "Basic Marker" // (Optional) Add a label to the marker.
+ altitudeMode: 'ABSOLUTE', // (Optional) Treated as CLAMP_TO_GROUND if omitted.
+ extruded: true, // (Optional) Draws line from ground to the bottom of the marker.
+ label: 'Basic Marker', // (Optional) Add a label to the marker.
});
map.append(marker); // The marker must be appended to the map.
diff --git a/dist/samples/3d-simple-marker/jsfiddle/demo.html b/dist/samples/3d-simple-marker/jsfiddle/demo.html
index f80f4564..9501b596 100644
--- a/dist/samples/3d-simple-marker/jsfiddle/demo.html
+++ b/dist/samples/3d-simple-marker/jsfiddle/demo.html
@@ -6,18 +6,18 @@
-->
-
- Map
+
+ Map
-
-
-
-
-
+
+
+
+
+
-
-
-
+
diff --git a/dist/samples/3d-simple-marker/jsfiddle/demo.js b/dist/samples/3d-simple-marker/jsfiddle/demo.js
index a163609d..383ec897 100644
--- a/dist/samples/3d-simple-marker/jsfiddle/demo.js
+++ b/dist/samples/3d-simple-marker/jsfiddle/demo.js
@@ -1,26 +1,26 @@
"use strict";
/*
-* @license
-* Copyright 2025 Google LLC. All Rights Reserved.
-* SPDX-License-Identifier: Apache-2.0
-*/
+ * @license
+ * Copyright 2025 Google LLC. All Rights Reserved.
+ * SPDX-License-Identifier: Apache-2.0
+ */
//@ts-nocheck
async function init() {
// Make sure the Marker3DElement is included.
- const { Map3DElement, Marker3DElement } = await google.maps.importLibrary("maps3d");
+ const { Map3DElement, Marker3DElement } = await google.maps.importLibrary('maps3d');
const map = new Map3DElement({
center: { lat: 37.4239163, lng: -122.0947209, altitude: 0 },
tilt: 67.5,
range: 1000,
mode: 'SATELLITE',
- gestureHandling: "COOPERATIVE"
+ gestureHandling: 'COOPERATIVE',
});
const marker = new Marker3DElement({
position: { lat: 37.4239163, lng: -122.0947209, altitude: 50 }, // (Required) Marker must have a lat / lng, but doesn't need an altitude.
- altitudeMode: "ABSOLUTE", // (Optional) Treated as CLAMP_TO_GROUND if omitted.
+ altitudeMode: 'ABSOLUTE', // (Optional) Treated as CLAMP_TO_GROUND if omitted.
extruded: true, // (Optional) Draws line from ground to the bottom of the marker.
- label: "Basic Marker" // (Optional) Add a label to the marker.
+ label: 'Basic Marker', // (Optional) Add a label to the marker.
});
map.append(marker); // The marker must be appended to the map.
document.body.append(map);
diff --git a/dist/samples/add-map/app/README.md b/dist/samples/add-map/app/README.md
index 62904810..0cc7f993 100644
--- a/dist/samples/add-map/app/README.md
+++ b/dist/samples/add-map/app/README.md
@@ -1,7 +1,10 @@
# Google Maps JavaScript Sample
-This sample is generated from @googlemaps/js-samples located at
-https://github.com/googlemaps-samples/js-api-samples.
+## add-map
+
+The add-map sample demonstrates how to add a Google Map to a web page.
+
+Follow these instructions to set up and run add-map sample on your local computer.
## Setup
@@ -19,7 +22,7 @@ First `cd` to the folder for the sample to run, then:
From `samples/`:
-`$npm run build --workspace=sample-name/`
+`$npm run build --workspace=add-map/`
### Build all of the examples.
@@ -30,4 +33,3 @@ From `samples/`:
For feedback related to this sample, please open a new issue on
[GitHub](https://github.com/googlemaps-samples/js-api-samples/issues).
-
diff --git a/dist/samples/add-map/app/index.html b/dist/samples/add-map/app/index.html
index 42dcc87a..ed796147 100644
--- a/dist/samples/add-map/app/index.html
+++ b/dist/samples/add-map/app/index.html
@@ -1,4 +1,4 @@
-
+
-
- Add a Map
+
+ Add a Map
-
-
-
-
+
+
-
-
-
-
-
-
-
-
My Google Maps Demo
-
-
-
-
-
+
+
+
+
+
+
+
+
My Google Maps Demo
+
+
+
+
+
diff --git a/dist/samples/add-map/app/index.ts b/dist/samples/add-map/app/index.ts
index 02104702..e3aa9f56 100644
--- a/dist/samples/add-map/app/index.ts
+++ b/dist/samples/add-map/app/index.ts
@@ -6,38 +6,40 @@
// [START maps_add_map]
async function initMap(): Promise {
- // [START maps_add_map_instantiate_map]
- // [START maps_add_map_libraries]
- // Request the needed libraries.
- const [{ Map }, { AdvancedMarkerElement }] = await Promise.all([
- google.maps.importLibrary("maps") as Promise,
- google.maps.importLibrary("marker") as Promise,
- ]);
- // [END maps_add_map_libraries]
- // [START maps_add_map_innermap]
- // Get the gmp-map element.
- const mapElement = document.querySelector(
- "gmp-map"
- ) as google.maps.MapElement;
+ // [START maps_add_map_instantiate_map]
+ // [START maps_add_map_libraries]
+ // Request the needed libraries.
+ const [{ Map }, { AdvancedMarkerElement }] = await Promise.all([
+ google.maps.importLibrary('maps') as Promise,
+ google.maps.importLibrary(
+ 'marker'
+ ) as Promise,
+ ]);
+ // [END maps_add_map_libraries]
+ // [START maps_add_map_innermap]
+ // Get the gmp-map element.
+ const mapElement = document.querySelector(
+ 'gmp-map'
+ ) as google.maps.MapElement;
- // Get the inner map.
- const innerMap = mapElement.innerMap;
+ // Get the inner map.
+ const innerMap = mapElement.innerMap;
- // Set map options.
- innerMap.setOptions({
- mapTypeControl: false,
- });
- // [END maps_add_map_innermap]
- // [END maps_add_map_instantiate_map]
+ // Set map options.
+ innerMap.setOptions({
+ mapTypeControl: false,
+ });
+ // [END maps_add_map_innermap]
+ // [END maps_add_map_instantiate_map]
- // [START maps_add_map_instantiate_marker]
- // Add a marker positioned at the map center (Uluru).
- const marker = new AdvancedMarkerElement({
- map: innerMap,
- position: mapElement.center,
- title: "Uluru/Ayers Rock",
- });
- // [END maps_add_map_instantiate_marker]
+ // [START maps_add_map_instantiate_marker]
+ // Add a marker positioned at the map center (Uluru).
+ const marker = new AdvancedMarkerElement({
+ map: innerMap,
+ position: mapElement.center,
+ title: 'Uluru/Ayers Rock',
+ });
+ // [END maps_add_map_instantiate_marker]
}
initMap();
// [END maps_add_map]
diff --git a/dist/samples/add-map/app/style.css b/dist/samples/add-map/app/style.css
index 1821f877..c0f37cb4 100644
--- a/dist/samples/add-map/app/style.css
+++ b/dist/samples/add-map/app/style.css
@@ -9,7 +9,7 @@
* that contains the map.
*/
gmp-map {
- height: 100%;
+ height: 100%;
}
/*
@@ -17,15 +17,15 @@ gmp-map {
*/
html,
body {
- height: 100%;
- margin: 0;
- padding: 0;
+ height: 100%;
+ margin: 0;
+ padding: 0;
}
/* [END maps_add_map] */
#controls h3 {
- font-size: 1.5em;
- background-color: white;
- margin: 8px;
- padding: 2px;
+ font-size: 1.5em;
+ background-color: white;
+ margin: 8px;
+ padding: 2px;
}
diff --git a/dist/samples/add-map/dist/assets/index-BJeCMP20.css b/dist/samples/add-map/dist/assets/index-BJeCMP20.css
deleted file mode 100644
index 45148522..00000000
--- a/dist/samples/add-map/dist/assets/index-BJeCMP20.css
+++ /dev/null
@@ -1,5 +0,0 @@
-/*
- * @license
- * Copyright 2025 Google LLC. All Rights Reserved.
- * SPDX-License-Identifier: Apache-2.0
- */gmp-map{height:100%}html,body{height:100%;margin:0;padding:0}#controls h3{font-size:1.5em;background-color:#fff;margin:8px;padding:2px}
diff --git a/dist/samples/add-map/dist/assets/index-RaMcGHQe.js b/dist/samples/add-map/dist/assets/index-ChJRVLSO.js
similarity index 63%
rename from dist/samples/add-map/dist/assets/index-RaMcGHQe.js
rename to dist/samples/add-map/dist/assets/index-ChJRVLSO.js
index 82f4aeb8..641d4f02 100644
--- a/dist/samples/add-map/dist/assets/index-RaMcGHQe.js
+++ b/dist/samples/add-map/dist/assets/index-ChJRVLSO.js
@@ -1,5 +1 @@
-(function(){const t=document.createElement("link").relList;if(t&&t.supports&&t.supports("modulepreload"))return;for(const e of document.querySelectorAll('link[rel="modulepreload"]'))o(e);new MutationObserver(e=>{for(const r of e)if(r.type==="childList")for(const i of r.addedNodes)i.tagName==="LINK"&&i.rel==="modulepreload"&&o(i)}).observe(document,{childList:!0,subtree:!0});function n(e){const r={};return e.integrity&&(r.integrity=e.integrity),e.referrerPolicy&&(r.referrerPolicy=e.referrerPolicy),e.crossOrigin==="use-credentials"?r.credentials="include":e.crossOrigin==="anonymous"?r.credentials="omit":r.credentials="same-origin",r}function o(e){if(e.ep)return;e.ep=!0;const r=n(e);fetch(e.href,r)}})();/*
- * @license
- * Copyright 2025 Google LLC. All Rights Reserved.
- * SPDX-License-Identifier: Apache-2.0
- */async function c(){const[{Map:s},{AdvancedMarkerElement:t}]=await Promise.all([google.maps.importLibrary("maps"),google.maps.importLibrary("marker")]),n=document.querySelector("gmp-map"),o=n.innerMap;o.setOptions({mapTypeControl:!1}),new t({map:o,position:n.center,title:"Uluru/Ayers Rock"})}c();
+(function(){const t=document.createElement("link").relList;if(t&&t.supports&&t.supports("modulepreload"))return;for(const e of document.querySelectorAll('link[rel="modulepreload"]'))o(e);new MutationObserver(e=>{for(const r of e)if(r.type==="childList")for(const i of r.addedNodes)i.tagName==="LINK"&&i.rel==="modulepreload"&&o(i)}).observe(document,{childList:!0,subtree:!0});function n(e){const r={};return e.integrity&&(r.integrity=e.integrity),e.referrerPolicy&&(r.referrerPolicy=e.referrerPolicy),e.crossOrigin==="use-credentials"?r.credentials="include":e.crossOrigin==="anonymous"?r.credentials="omit":r.credentials="same-origin",r}function o(e){if(e.ep)return;e.ep=!0;const r=n(e);fetch(e.href,r)}})();async function c(){const[{Map:s},{AdvancedMarkerElement:t}]=await Promise.all([google.maps.importLibrary("maps"),google.maps.importLibrary("marker")]),n=document.querySelector("gmp-map"),o=n.innerMap;o.setOptions({mapTypeControl:!1}),new t({map:o,position:n.center,title:"Uluru/Ayers Rock"})}c();
diff --git a/dist/samples/add-map/dist/assets/index-Du4tBtk_.css b/dist/samples/add-map/dist/assets/index-Du4tBtk_.css
new file mode 100644
index 00000000..60d2517c
--- /dev/null
+++ b/dist/samples/add-map/dist/assets/index-Du4tBtk_.css
@@ -0,0 +1 @@
+gmp-map{height:100%}html,body{height:100%;margin:0;padding:0}#controls h3{font-size:1.5em;background-color:#fff;margin:8px;padding:2px}
diff --git a/dist/samples/add-map/dist/index.html b/dist/samples/add-map/dist/index.html
index 7acc1653..b9b1fe69 100644
--- a/dist/samples/add-map/dist/index.html
+++ b/dist/samples/add-map/dist/index.html
@@ -1,4 +1,4 @@
-
+
-
- Add a Map
+
+ Add a Map
-
-
-
-
-
-
-
-
-
-
-
-
My Google Maps Demo
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
My Google Maps Demo
+
+
+
+
+
diff --git a/dist/samples/add-map/docs/index.html b/dist/samples/add-map/docs/index.html
index 42dcc87a..ed796147 100644
--- a/dist/samples/add-map/docs/index.html
+++ b/dist/samples/add-map/docs/index.html
@@ -1,4 +1,4 @@
-
+
-
- Add a Map
+
+ Add a Map
-
-
-
-
+
+
-
-
-
-
-
-
-
-
My Google Maps Demo
-
-
-
-
-
+
+
+
+
+
+
+
+
My Google Maps Demo
+
+
+
+
+
diff --git a/dist/samples/add-map/docs/index.js b/dist/samples/add-map/docs/index.js
index b961bc50..ea7b668c 100644
--- a/dist/samples/add-map/docs/index.js
+++ b/dist/samples/add-map/docs/index.js
@@ -10,13 +10,13 @@ async function initMap() {
// [START maps_add_map_libraries]
// Request the needed libraries.
const [{ Map }, { AdvancedMarkerElement }] = await Promise.all([
- google.maps.importLibrary("maps"),
- google.maps.importLibrary("marker"),
+ google.maps.importLibrary('maps'),
+ google.maps.importLibrary('marker'),
]);
// [END maps_add_map_libraries]
// [START maps_add_map_innermap]
// Get the gmp-map element.
- const mapElement = document.querySelector("gmp-map");
+ const mapElement = document.querySelector('gmp-map');
// Get the inner map.
const innerMap = mapElement.innerMap;
// Set map options.
@@ -30,7 +30,7 @@ async function initMap() {
const marker = new AdvancedMarkerElement({
map: innerMap,
position: mapElement.center,
- title: "Uluru/Ayers Rock",
+ title: 'Uluru/Ayers Rock',
});
// [END maps_add_map_instantiate_marker]
}
diff --git a/dist/samples/add-map/docs/index.ts b/dist/samples/add-map/docs/index.ts
index 02104702..e3aa9f56 100644
--- a/dist/samples/add-map/docs/index.ts
+++ b/dist/samples/add-map/docs/index.ts
@@ -6,38 +6,40 @@
// [START maps_add_map]
async function initMap(): Promise {
- // [START maps_add_map_instantiate_map]
- // [START maps_add_map_libraries]
- // Request the needed libraries.
- const [{ Map }, { AdvancedMarkerElement }] = await Promise.all([
- google.maps.importLibrary("maps") as Promise,
- google.maps.importLibrary("marker") as Promise,
- ]);
- // [END maps_add_map_libraries]
- // [START maps_add_map_innermap]
- // Get the gmp-map element.
- const mapElement = document.querySelector(
- "gmp-map"
- ) as google.maps.MapElement;
+ // [START maps_add_map_instantiate_map]
+ // [START maps_add_map_libraries]
+ // Request the needed libraries.
+ const [{ Map }, { AdvancedMarkerElement }] = await Promise.all([
+ google.maps.importLibrary('maps') as Promise,
+ google.maps.importLibrary(
+ 'marker'
+ ) as Promise,
+ ]);
+ // [END maps_add_map_libraries]
+ // [START maps_add_map_innermap]
+ // Get the gmp-map element.
+ const mapElement = document.querySelector(
+ 'gmp-map'
+ ) as google.maps.MapElement;
- // Get the inner map.
- const innerMap = mapElement.innerMap;
+ // Get the inner map.
+ const innerMap = mapElement.innerMap;
- // Set map options.
- innerMap.setOptions({
- mapTypeControl: false,
- });
- // [END maps_add_map_innermap]
- // [END maps_add_map_instantiate_map]
+ // Set map options.
+ innerMap.setOptions({
+ mapTypeControl: false,
+ });
+ // [END maps_add_map_innermap]
+ // [END maps_add_map_instantiate_map]
- // [START maps_add_map_instantiate_marker]
- // Add a marker positioned at the map center (Uluru).
- const marker = new AdvancedMarkerElement({
- map: innerMap,
- position: mapElement.center,
- title: "Uluru/Ayers Rock",
- });
- // [END maps_add_map_instantiate_marker]
+ // [START maps_add_map_instantiate_marker]
+ // Add a marker positioned at the map center (Uluru).
+ const marker = new AdvancedMarkerElement({
+ map: innerMap,
+ position: mapElement.center,
+ title: 'Uluru/Ayers Rock',
+ });
+ // [END maps_add_map_instantiate_marker]
}
initMap();
// [END maps_add_map]
diff --git a/dist/samples/add-map/docs/style.css b/dist/samples/add-map/docs/style.css
index 1821f877..c0f37cb4 100644
--- a/dist/samples/add-map/docs/style.css
+++ b/dist/samples/add-map/docs/style.css
@@ -9,7 +9,7 @@
* that contains the map.
*/
gmp-map {
- height: 100%;
+ height: 100%;
}
/*
@@ -17,15 +17,15 @@ gmp-map {
*/
html,
body {
- height: 100%;
- margin: 0;
- padding: 0;
+ height: 100%;
+ margin: 0;
+ padding: 0;
}
/* [END maps_add_map] */
#controls h3 {
- font-size: 1.5em;
- background-color: white;
- margin: 8px;
- padding: 2px;
+ font-size: 1.5em;
+ background-color: white;
+ margin: 8px;
+ padding: 2px;
}
diff --git a/dist/samples/add-map/jsfiddle/demo.css b/dist/samples/add-map/jsfiddle/demo.css
index aaf8b4e5..c8ebf146 100644
--- a/dist/samples/add-map/jsfiddle/demo.css
+++ b/dist/samples/add-map/jsfiddle/demo.css
@@ -9,7 +9,7 @@
* that contains the map.
*/
gmp-map {
- height: 100%;
+ height: 100%;
}
/*
@@ -17,15 +17,15 @@ gmp-map {
*/
html,
body {
- height: 100%;
- margin: 0;
- padding: 0;
+ height: 100%;
+ margin: 0;
+ padding: 0;
}
#controls h3 {
- font-size: 1.5em;
- background-color: white;
- margin: 8px;
- padding: 2px;
+ font-size: 1.5em;
+ background-color: white;
+ margin: 8px;
+ padding: 2px;
}
diff --git a/dist/samples/add-map/jsfiddle/demo.html b/dist/samples/add-map/jsfiddle/demo.html
index b6f64e47..b7f1eaec 100644
--- a/dist/samples/add-map/jsfiddle/demo.html
+++ b/dist/samples/add-map/jsfiddle/demo.html
@@ -1,4 +1,4 @@
-
+
-
- Add a Map
+
+ Add a Map
-
-
-
-
+
+
-
-
-
-
-
-
-
-
My Google Maps Demo
-
-
-
-
-
+
+
+
+
+
+
+
+
My Google Maps Demo
+
+
+
+
+
diff --git a/dist/samples/add-map/jsfiddle/demo.js b/dist/samples/add-map/jsfiddle/demo.js
index b653c399..19f61643 100644
--- a/dist/samples/add-map/jsfiddle/demo.js
+++ b/dist/samples/add-map/jsfiddle/demo.js
@@ -10,13 +10,13 @@ async function initMap() {
// Request the needed libraries.
const [{ Map }, { AdvancedMarkerElement }] = await Promise.all([
- google.maps.importLibrary("maps"),
- google.maps.importLibrary("marker"),
+ google.maps.importLibrary('maps'),
+ google.maps.importLibrary('marker'),
]);
// Get the gmp-map element.
- const mapElement = document.querySelector("gmp-map");
+ const mapElement = document.querySelector('gmp-map');
// Get the inner map.
const innerMap = mapElement.innerMap;
// Set map options.
@@ -30,7 +30,7 @@ async function initMap() {
const marker = new AdvancedMarkerElement({
map: innerMap,
position: mapElement.center,
- title: "Uluru/Ayers Rock",
+ title: 'Uluru/Ayers Rock',
});
}
diff --git a/dist/samples/address-validation/app/README.md b/dist/samples/address-validation/app/README.md
index be15c0d7..1f919487 100644
--- a/dist/samples/address-validation/app/README.md
+++ b/dist/samples/address-validation/app/README.md
@@ -1,7 +1,10 @@
# Google Maps JavaScript Sample
-This sample is generated from @googlemaps/js-samples located at
-https://github.com/googlemaps-samples/js-api-samples.
+## address-validation
+
+The address-validation sample demonstrates how to use the Address Validation API.
+
+Follow these instructions to set up and run address-validation sample on your local computer.
## Setup
@@ -19,7 +22,7 @@ First `cd` to the folder for the sample to run, then:
From `samples/`:
-`$npm run build --workspace=sample-name/`
+`$npm run build --workspace=address-validation/`
### Build all of the examples.
diff --git a/dist/samples/address-validation/app/index.html b/dist/samples/address-validation/app/index.html
index 366386db..53f29c98 100644
--- a/dist/samples/address-validation/app/index.html
+++ b/dist/samples/address-validation/app/index.html
@@ -4,132 +4,177 @@
Copyright 2025 Google LLC. All Rights Reserved.
SPDX-License-Identifier: Apache-2.0
-->
-
+
-
- Address Validation
+
+ Address Validation
-
-
-
-
-
-