From 0d8591bb9921330479577882f72462c5ebff7c6e Mon Sep 17 00:00:00 2001 From: William French Date: Tue, 7 Oct 2025 09:17:00 -0700 Subject: [PATCH 1/5] feat: Updates markers altitude sample to use the gmp-map element. Change-Id: Ic1facde6bad67017392c8203241e91f87d891c7b --- samples/advanced-markers-altitude/index.html | 9 ++++----- samples/advanced-markers-altitude/index.ts | 15 +++++++++------ 2 files changed, 13 insertions(+), 11 deletions(-) diff --git a/samples/advanced-markers-altitude/index.html b/samples/advanced-markers-altitude/index.html index 3b2831d4..abab242e 100644 --- a/samples/advanced-markers-altitude/index.html +++ b/samples/advanced-markers-altitude/index.html @@ -1,4 +1,4 @@ - + + + + diff --git a/samples/advanced-markers-altitude/index.ts b/samples/advanced-markers-altitude/index.ts index 8357eb2e..fd78a7fc 100644 --- a/samples/advanced-markers-altitude/index.ts +++ b/samples/advanced-markers-altitude/index.ts @@ -5,19 +5,21 @@ */ // [START maps_advanced_markers_altitude] -let map; +const mapElement = document.querySelector('gmp-map') as google.maps.MapElement; +let innerMap; + async function initMap() { // Request needed libraries. const { Map } = await google.maps.importLibrary("maps") as google.maps.MapsLibrary; const { AdvancedMarkerElement, PinElement } = await google.maps.importLibrary("marker") as google.maps.MarkerLibrary; - map = new Map(document.getElementById('map') as HTMLElement, { - center: {lat: 47.65196191658531, lng: -122.30716770065949}, - zoom: 19, + innerMap = mapElement.innerMap; + + innerMap.setOptions ({ tilt: 67.5, heading: 45, - mapId: '6ff586e93e18149f', }); + // [START maps_advanced_markers_altitude_marker] const pin = new PinElement({ background: '#4b2e83', @@ -27,11 +29,12 @@ async function initMap() { }); const markerView = new AdvancedMarkerElement({ - map, content: pin.element, // Set altitude to 20 meters above the ground. position: { lat: 47.65170843460547, lng: -122.30754, altitude: 20 } as google.maps.LatLngAltitudeLiteral, }); + + mapElement.append(markerView); // [END maps_advanced_markers_altitude_marker] } From 6be2274a4a650bfd446024144eef3d4f4a847a59 Mon Sep 17 00:00:00 2001 From: William French Date: Tue, 4 Nov 2025 07:36:49 -0800 Subject: [PATCH 2/5] Refactor innerMap options setting --- samples/advanced-markers-altitude/index.ts | 6 ++---- 1 file changed, 2 insertions(+), 4 deletions(-) diff --git a/samples/advanced-markers-altitude/index.ts b/samples/advanced-markers-altitude/index.ts index fd78a7fc..05e5655a 100644 --- a/samples/advanced-markers-altitude/index.ts +++ b/samples/advanced-markers-altitude/index.ts @@ -13,9 +13,7 @@ async function initMap() { const { Map } = await google.maps.importLibrary("maps") as google.maps.MapsLibrary; const { AdvancedMarkerElement, PinElement } = await google.maps.importLibrary("marker") as google.maps.MarkerLibrary; - innerMap = mapElement.innerMap; - - innerMap.setOptions ({ + mapElement.innerMap.setOptions ({ tilt: 67.5, heading: 45, }); @@ -39,4 +37,4 @@ async function initMap() { } initMap(); -// [END maps_advanced_markers_altitude] \ No newline at end of file +// [END maps_advanced_markers_altitude] From 844e6ea39c924bcaed4c1e6b819c58e48509b90e Mon Sep 17 00:00:00 2001 From: William French Date: Tue, 4 Nov 2025 09:50:05 -0800 Subject: [PATCH 3/5] Refactor to remove innerMap var --- samples/advanced-markers-altitude/index.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/samples/advanced-markers-altitude/index.ts b/samples/advanced-markers-altitude/index.ts index 05e5655a..73cdd0f8 100644 --- a/samples/advanced-markers-altitude/index.ts +++ b/samples/advanced-markers-altitude/index.ts @@ -6,7 +6,6 @@ // [START maps_advanced_markers_altitude] const mapElement = document.querySelector('gmp-map') as google.maps.MapElement; -let innerMap; async function initMap() { // Request needed libraries. From 37f380ddbf7a71cca8d56b2b94e2afae4f6630a4 Mon Sep 17 00:00:00 2001 From: William French Date: Tue, 4 Nov 2025 09:51:58 -0800 Subject: [PATCH 4/5] Update copyright year and marker variable name --- samples/advanced-markers-altitude/index.ts | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/samples/advanced-markers-altitude/index.ts b/samples/advanced-markers-altitude/index.ts index 73cdd0f8..56e72198 100644 --- a/samples/advanced-markers-altitude/index.ts +++ b/samples/advanced-markers-altitude/index.ts @@ -1,6 +1,6 @@ /** * @license - * Copyright 2019 Google LLC. All Rights Reserved. + * Copyright 2025 Google LLC. All Rights Reserved. * SPDX-License-Identifier: Apache-2.0 */ @@ -25,13 +25,13 @@ async function initMap() { scale: 2.0, }); - const markerView = new AdvancedMarkerElement({ + const marker = new AdvancedMarkerElement({ content: pin.element, // Set altitude to 20 meters above the ground. position: { lat: 47.65170843460547, lng: -122.30754, altitude: 20 } as google.maps.LatLngAltitudeLiteral, }); - mapElement.append(markerView); + mapElement.append(marker); // [END maps_advanced_markers_altitude_marker] } From c8cd4a9d5234c03184931d30131c5857a081fed9 Mon Sep 17 00:00:00 2001 From: William French Date: Tue, 4 Nov 2025 09:53:50 -0800 Subject: [PATCH 5/5] Update marker creation to append pin element --- samples/advanced-markers-altitude/index.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/samples/advanced-markers-altitude/index.ts b/samples/advanced-markers-altitude/index.ts index 56e72198..dbd7c80d 100644 --- a/samples/advanced-markers-altitude/index.ts +++ b/samples/advanced-markers-altitude/index.ts @@ -26,10 +26,10 @@ async function initMap() { }); const marker = new AdvancedMarkerElement({ - content: pin.element, // Set altitude to 20 meters above the ground. position: { lat: 47.65170843460547, lng: -122.30754, altitude: 20 } as google.maps.LatLngAltitudeLiteral, }); + marker.append(pin); mapElement.append(marker); // [END maps_advanced_markers_altitude_marker]