Skip to content

Commit 0bd08b5

Browse files
Update dist folder [skip ci] (#747)
1 parent 84d269a commit 0bd08b5

File tree

11 files changed

+151
-129
lines changed

11 files changed

+151
-129
lines changed

dist/samples/place-class/app/index.html

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -11,13 +11,13 @@
1111

1212
<link rel="stylesheet" type="text/css" href="./style.css" />
1313
<script type="module" src="./index.js"></script>
14-
</head>
15-
<body>
16-
<div id="map"></div>
17-
1814
<!-- prettier-ignore -->
1915
<script>(g=>{var h,a,k,p="The Google Maps JavaScript API",c="google",l="importLibrary",q="__ib__",m=document,b=window;b=b[c]||(b[c]={});var d=b.maps||(b.maps={}),r=new Set,e=new URLSearchParams,u=()=>h||(h=new Promise(async(f,n)=>{await (a=m.createElement("script"));e.set("libraries",[...r]+"");for(k in g)e.set(k.replace(/[A-Z]/g,t=>"_"+t[0].toLowerCase()),g[k]);e.set("callback",c+".maps."+q);a.src=`https://maps.${c}apis.com/maps/api/js?`+e;d[q]=f;a.onerror=()=>h=n(Error(p+" could not load."));a.nonce=m.querySelector("script[nonce]")?.nonce||"";m.head.append(a)}));d[l]?console.warn(p+" only loads once. Ignoring:",g):d[l]=(f,...n)=>r.add(f)&&u().then(()=>d[l](f,...n))})
2016
({key: "AIzaSyA6myHzS10YXdcazAFalmXvDkrYCp5cLc8", v: "weekly"});</script>
17+
</head>
18+
<body>
19+
<gmp-map center="32.7360353,-117.1509849" zoom="14" map-id="DEMO_MAP_ID"><!-- Map id is required for Advanced Markers. -->
20+
</gmp-map>
2121
</body>
2222
</html>
2323
<!-- [END maps_place_class] -->

dist/samples/place-class/app/index.ts

Lines changed: 33 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -5,20 +5,15 @@
55
*/
66

77
// [START maps_place_class]
8-
let map: google.maps.Map;
9-
let centerCoordinates = { lat: 37.4161493, lng: -122.0812166 };
8+
const mapElement = document.querySelector('gmp-map') as google.maps.MapElement;
9+
let innerMap;
10+
let infoWindow;
1011

1112
async function initMap() {
12-
const { Map } = await google.maps.importLibrary("maps") as google.maps.MapsLibrary;
13-
14-
map = new Map(document.getElementById('map') as HTMLElement, {
15-
center: centerCoordinates,
16-
zoom: 14,
17-
// [START_EXCLUDE]
18-
mapId: '4504f8b37365c3d0',
19-
// [END_EXCLUDE]
20-
});
13+
const { Map, InfoWindow } = await google.maps.importLibrary("maps") as google.maps.MapsLibrary;
2114

15+
innerMap = mapElement.innerMap;
16+
infoWindow = new InfoWindow();
2217
getPlaceDetails();
2318
}
2419

@@ -28,25 +23,43 @@ async function getPlaceDetails() {
2823
const { AdvancedMarkerElement } = await google.maps.importLibrary("marker") as google.maps.MarkerLibrary;
2924
// Use place ID to create a new Place instance.
3025
const place = new Place({
31-
id: 'ChIJN5Nz71W3j4ARhx5bwpTQEGg',
32-
requestedLanguage: 'en', // optional
26+
id: 'ChIJyYB_SZVU2YARR-I1Jjf08F0', // San Diego Zoo
3327
});
3428

3529
// Call fetchFields, passing the desired data fields.
36-
await place.fetchFields({ fields: ['displayName', 'formattedAddress', 'location'] });
37-
38-
// Log the result
39-
console.log(place.displayName);
40-
console.log(place.formattedAddress);
30+
await place.fetchFields({ fields: ['displayName', 'formattedAddress', 'location', 'googleMapsURI'] });
4131

4232
// Add an Advanced Marker
4333
const marker = new AdvancedMarkerElement({
44-
map,
34+
map: innerMap,
4535
position: place.location,
4636
title: place.displayName,
4737
});
38+
39+
// Assemble the info window content.
40+
const content = document.createElement('div');
41+
const address = document.createElement('div');
42+
const placeId = document.createElement('div');
43+
address.textContent = place.formattedAddress || '';
44+
placeId.textContent = place.id;
45+
content.append(placeId, address);
46+
47+
if (place.googleMapsURI) {
48+
const link = document.createElement('a');
49+
link.href = place.googleMapsURI;
50+
link.target = '_blank';
51+
link.textContent = 'View Details on Google Maps';
52+
content.appendChild(link);
53+
}
54+
55+
// Display an info window.
56+
infoWindow.setHeaderContent(place.displayName);
57+
infoWindow.setContent(content);
58+
infoWindow.open({
59+
anchor: marker,
60+
});
4861
}
4962
// [END maps_place_class_fetchfields]
5063

5164
initMap();
52-
// [END maps_place_class]
65+
// [END maps_place_class]

dist/samples/place-class/dist/assets/index-CKDVXzRh.js

Lines changed: 5 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

dist/samples/place-class/dist/assets/index-CLgMNE7p.js

Lines changed: 0 additions & 5 deletions
This file was deleted.

dist/samples/place-class/dist/index.html

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -9,15 +9,15 @@
99
<head>
1010
<title>Place Class</title>
1111

12-
<script type="module" crossorigin src="./assets/index-CLgMNE7p.js"></script>
13-
<link rel="stylesheet" crossorigin href="./assets/index-DW_Ml_OD.css">
14-
</head>
15-
<body>
16-
<div id="map"></div>
17-
1812
<!-- prettier-ignore -->
1913
<script>(g=>{var h,a,k,p="The Google Maps JavaScript API",c="google",l="importLibrary",q="__ib__",m=document,b=window;b=b[c]||(b[c]={});var d=b.maps||(b.maps={}),r=new Set,e=new URLSearchParams,u=()=>h||(h=new Promise(async(f,n)=>{await (a=m.createElement("script"));e.set("libraries",[...r]+"");for(k in g)e.set(k.replace(/[A-Z]/g,t=>"_"+t[0].toLowerCase()),g[k]);e.set("callback",c+".maps."+q);a.src=`https://maps.${c}apis.com/maps/api/js?`+e;d[q]=f;a.onerror=()=>h=n(Error(p+" could not load."));a.nonce=m.querySelector("script[nonce]")?.nonce||"";m.head.append(a)}));d[l]?console.warn(p+" only loads once. Ignoring:",g):d[l]=(f,...n)=>r.add(f)&&u().then(()=>d[l](f,...n))})
2014
({key: "AIzaSyA6myHzS10YXdcazAFalmXvDkrYCp5cLc8", v: "weekly"});</script>
15+
<script type="module" crossorigin src="./assets/index-CKDVXzRh.js"></script>
16+
<link rel="stylesheet" crossorigin href="./assets/index-DW_Ml_OD.css">
17+
</head>
18+
<body>
19+
<gmp-map center="32.7360353,-117.1509849" zoom="14" map-id="DEMO_MAP_ID"><!-- Map id is required for Advanced Markers. -->
20+
</gmp-map>
2121
</body>
2222
</html>
2323
<!-- [END maps_place_class] -->

dist/samples/place-class/docs/index.html

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -11,13 +11,13 @@
1111

1212
<link rel="stylesheet" type="text/css" href="./style.css" />
1313
<script type="module" src="./index.js"></script>
14-
</head>
15-
<body>
16-
<div id="map"></div>
17-
1814
<!-- prettier-ignore -->
1915
<script>(g=>{var h,a,k,p="The Google Maps JavaScript API",c="google",l="importLibrary",q="__ib__",m=document,b=window;b=b[c]||(b[c]={});var d=b.maps||(b.maps={}),r=new Set,e=new URLSearchParams,u=()=>h||(h=new Promise(async(f,n)=>{await (a=m.createElement("script"));e.set("libraries",[...r]+"");for(k in g)e.set(k.replace(/[A-Z]/g,t=>"_"+t[0].toLowerCase()),g[k]);e.set("callback",c+".maps."+q);a.src=`https://maps.${c}apis.com/maps/api/js?`+e;d[q]=f;a.onerror=()=>h=n(Error(p+" could not load."));a.nonce=m.querySelector("script[nonce]")?.nonce||"";m.head.append(a)}));d[l]?console.warn(p+" only loads once. Ignoring:",g):d[l]=(f,...n)=>r.add(f)&&u().then(()=>d[l](f,...n))})
2016
({key: "AIzaSyA6myHzS10YXdcazAFalmXvDkrYCp5cLc8", v: "weekly"});</script>
17+
</head>
18+
<body>
19+
<gmp-map center="32.7360353,-117.1509849" zoom="14" map-id="DEMO_MAP_ID"><!-- Map id is required for Advanced Markers. -->
20+
</gmp-map>
2121
</body>
2222
</html>
2323
<!-- [END maps_place_class] -->

dist/samples/place-class/docs/index.js

Lines changed: 29 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -5,17 +5,13 @@
55
* SPDX-License-Identifier: Apache-2.0
66
*/
77
// [START maps_place_class]
8-
let map;
9-
let centerCoordinates = { lat: 37.4161493, lng: -122.0812166 };
8+
const mapElement = document.querySelector('gmp-map');
9+
let innerMap;
10+
let infoWindow;
1011
async function initMap() {
11-
const { Map } = await google.maps.importLibrary("maps");
12-
map = new Map(document.getElementById('map'), {
13-
center: centerCoordinates,
14-
zoom: 14,
15-
// [START_EXCLUDE]
16-
mapId: '4504f8b37365c3d0',
17-
// [END_EXCLUDE]
18-
});
12+
const { Map, InfoWindow } = await google.maps.importLibrary("maps");
13+
innerMap = mapElement.innerMap;
14+
infoWindow = new InfoWindow();
1915
getPlaceDetails();
2016
}
2117
// [START maps_place_class_fetchfields]
@@ -24,20 +20,36 @@ async function getPlaceDetails() {
2420
const { AdvancedMarkerElement } = await google.maps.importLibrary("marker");
2521
// Use place ID to create a new Place instance.
2622
const place = new Place({
27-
id: 'ChIJN5Nz71W3j4ARhx5bwpTQEGg',
28-
requestedLanguage: 'en', // optional
23+
id: 'ChIJyYB_SZVU2YARR-I1Jjf08F0', // San Diego Zoo
2924
});
3025
// Call fetchFields, passing the desired data fields.
31-
await place.fetchFields({ fields: ['displayName', 'formattedAddress', 'location'] });
32-
// Log the result
33-
console.log(place.displayName);
34-
console.log(place.formattedAddress);
26+
await place.fetchFields({ fields: ['displayName', 'formattedAddress', 'location', 'googleMapsURI'] });
3527
// Add an Advanced Marker
3628
const marker = new AdvancedMarkerElement({
37-
map,
29+
map: innerMap,
3830
position: place.location,
3931
title: place.displayName,
4032
});
33+
// Assemble the info window content.
34+
const content = document.createElement('div');
35+
const address = document.createElement('div');
36+
const placeId = document.createElement('div');
37+
address.textContent = place.formattedAddress || '';
38+
placeId.textContent = place.id;
39+
content.append(placeId, address);
40+
if (place.googleMapsURI) {
41+
const link = document.createElement('a');
42+
link.href = place.googleMapsURI;
43+
link.target = '_blank';
44+
link.textContent = 'View Details on Google Maps';
45+
content.appendChild(link);
46+
}
47+
// Display an info window.
48+
infoWindow.setHeaderContent(place.displayName);
49+
infoWindow.setContent(content);
50+
infoWindow.open({
51+
anchor: marker,
52+
});
4153
}
4254
// [END maps_place_class_fetchfields]
4355
initMap();

dist/samples/place-class/docs/index.ts

Lines changed: 33 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -5,20 +5,15 @@
55
*/
66

77
// [START maps_place_class]
8-
let map: google.maps.Map;
9-
let centerCoordinates = { lat: 37.4161493, lng: -122.0812166 };
8+
const mapElement = document.querySelector('gmp-map') as google.maps.MapElement;
9+
let innerMap;
10+
let infoWindow;
1011

1112
async function initMap() {
12-
const { Map } = await google.maps.importLibrary("maps") as google.maps.MapsLibrary;
13-
14-
map = new Map(document.getElementById('map') as HTMLElement, {
15-
center: centerCoordinates,
16-
zoom: 14,
17-
// [START_EXCLUDE]
18-
mapId: '4504f8b37365c3d0',
19-
// [END_EXCLUDE]
20-
});
13+
const { Map, InfoWindow } = await google.maps.importLibrary("maps") as google.maps.MapsLibrary;
2114

15+
innerMap = mapElement.innerMap;
16+
infoWindow = new InfoWindow();
2217
getPlaceDetails();
2318
}
2419

@@ -28,25 +23,43 @@ async function getPlaceDetails() {
2823
const { AdvancedMarkerElement } = await google.maps.importLibrary("marker") as google.maps.MarkerLibrary;
2924
// Use place ID to create a new Place instance.
3025
const place = new Place({
31-
id: 'ChIJN5Nz71W3j4ARhx5bwpTQEGg',
32-
requestedLanguage: 'en', // optional
26+
id: 'ChIJyYB_SZVU2YARR-I1Jjf08F0', // San Diego Zoo
3327
});
3428

3529
// Call fetchFields, passing the desired data fields.
36-
await place.fetchFields({ fields: ['displayName', 'formattedAddress', 'location'] });
37-
38-
// Log the result
39-
console.log(place.displayName);
40-
console.log(place.formattedAddress);
30+
await place.fetchFields({ fields: ['displayName', 'formattedAddress', 'location', 'googleMapsURI'] });
4131

4232
// Add an Advanced Marker
4333
const marker = new AdvancedMarkerElement({
44-
map,
34+
map: innerMap,
4535
position: place.location,
4636
title: place.displayName,
4737
});
38+
39+
// Assemble the info window content.
40+
const content = document.createElement('div');
41+
const address = document.createElement('div');
42+
const placeId = document.createElement('div');
43+
address.textContent = place.formattedAddress || '';
44+
placeId.textContent = place.id;
45+
content.append(placeId, address);
46+
47+
if (place.googleMapsURI) {
48+
const link = document.createElement('a');
49+
link.href = place.googleMapsURI;
50+
link.target = '_blank';
51+
link.textContent = 'View Details on Google Maps';
52+
content.appendChild(link);
53+
}
54+
55+
// Display an info window.
56+
infoWindow.setHeaderContent(place.displayName);
57+
infoWindow.setContent(content);
58+
infoWindow.open({
59+
anchor: marker,
60+
});
4861
}
4962
// [END maps_place_class_fetchfields]
5063

5164
initMap();
52-
// [END maps_place_class]
65+
// [END maps_place_class]

dist/samples/place-class/jsfiddle/demo.html

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -11,13 +11,13 @@
1111

1212
<link rel="stylesheet" type="text/css" href="./style.css" />
1313
<script type="module" src="./index.js"></script>
14-
</head>
15-
<body>
16-
<div id="map"></div>
17-
1814
<!-- prettier-ignore -->
1915
<script>(g=>{var h,a,k,p="The Google Maps JavaScript API",c="google",l="importLibrary",q="__ib__",m=document,b=window;b=b[c]||(b[c]={});var d=b.maps||(b.maps={}),r=new Set,e=new URLSearchParams,u=()=>h||(h=new Promise(async(f,n)=>{await (a=m.createElement("script"));e.set("libraries",[...r]+"");for(k in g)e.set(k.replace(/[A-Z]/g,t=>"_"+t[0].toLowerCase()),g[k]);e.set("callback",c+".maps."+q);a.src=`https://maps.${c}apis.com/maps/api/js?`+e;d[q]=f;a.onerror=()=>h=n(Error(p+" could not load."));a.nonce=m.querySelector("script[nonce]")?.nonce||"";m.head.append(a)}));d[l]?console.warn(p+" only loads once. Ignoring:",g):d[l]=(f,...n)=>r.add(f)&&u().then(()=>d[l](f,...n))})
2016
({key: "AIzaSyA6myHzS10YXdcazAFalmXvDkrYCp5cLc8", v: "weekly"});</script>
17+
</head>
18+
<body>
19+
<gmp-map center="32.7360353,-117.1509849" zoom="14" map-id="DEMO_MAP_ID"><!-- Map id is required for Advanced Markers. -->
20+
</gmp-map>
2121
</body>
2222
</html>
2323

dist/samples/place-class/jsfiddle/demo.js

Lines changed: 29 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -5,17 +5,13 @@
55
* SPDX-License-Identifier: Apache-2.0
66
*/
77

8-
let map;
9-
let centerCoordinates = { lat: 37.4161493, lng: -122.0812166 };
8+
const mapElement = document.querySelector('gmp-map');
9+
let innerMap;
10+
let infoWindow;
1011
async function initMap() {
11-
const { Map } = await google.maps.importLibrary("maps");
12-
map = new Map(document.getElementById('map'), {
13-
center: centerCoordinates,
14-
zoom: 14,
15-
16-
mapId: '4504f8b37365c3d0',
17-
18-
});
12+
const { Map, InfoWindow } = await google.maps.importLibrary("maps");
13+
innerMap = mapElement.innerMap;
14+
infoWindow = new InfoWindow();
1915
getPlaceDetails();
2016
}
2117

@@ -24,20 +20,36 @@ async function getPlaceDetails() {
2420
const { AdvancedMarkerElement } = await google.maps.importLibrary("marker");
2521
// Use place ID to create a new Place instance.
2622
const place = new Place({
27-
id: 'ChIJN5Nz71W3j4ARhx5bwpTQEGg',
28-
requestedLanguage: 'en', // optional
23+
id: 'ChIJyYB_SZVU2YARR-I1Jjf08F0', // San Diego Zoo
2924
});
3025
// Call fetchFields, passing the desired data fields.
31-
await place.fetchFields({ fields: ['displayName', 'formattedAddress', 'location'] });
32-
// Log the result
33-
console.log(place.displayName);
34-
console.log(place.formattedAddress);
26+
await place.fetchFields({ fields: ['displayName', 'formattedAddress', 'location', 'googleMapsURI'] });
3527
// Add an Advanced Marker
3628
const marker = new AdvancedMarkerElement({
37-
map,
29+
map: innerMap,
3830
position: place.location,
3931
title: place.displayName,
4032
});
33+
// Assemble the info window content.
34+
const content = document.createElement('div');
35+
const address = document.createElement('div');
36+
const placeId = document.createElement('div');
37+
address.textContent = place.formattedAddress || '';
38+
placeId.textContent = place.id;
39+
content.append(placeId, address);
40+
if (place.googleMapsURI) {
41+
const link = document.createElement('a');
42+
link.href = place.googleMapsURI;
43+
link.target = '_blank';
44+
link.textContent = 'View Details on Google Maps';
45+
content.appendChild(link);
46+
}
47+
// Display an info window.
48+
infoWindow.setHeaderContent(place.displayName);
49+
infoWindow.setContent(content);
50+
infoWindow.open({
51+
anchor: marker,
52+
});
4153
}
4254

4355
initMap();

0 commit comments

Comments
 (0)