diff --git a/dist/index.html b/dist/index.html index 54a4c17e..9a47c295 100644 --- a/dist/index.html +++ b/dist/index.html @@ -48,6 +48,7 @@

Maps JSAPI Samples

  • deckgl-kml
  • deckgl-kml-updated
  • deckgl-polygon
  • +
  • layer-data-simple
  • map-drawing-terradraw
  • map-simple
  • place-autocomplete-basic-map
  • diff --git a/dist/samples/layer-data-simple/app/.eslintsrc.json b/dist/samples/layer-data-simple/app/.eslintsrc.json new file mode 100644 index 00000000..4c44dab0 --- /dev/null +++ b/dist/samples/layer-data-simple/app/.eslintsrc.json @@ -0,0 +1,13 @@ +{ + "extends": [ + "plugin:@typescript-eslint/recommended" + ], + "parser": "@typescript-eslint/parser", + "rules": { + "@typescript-eslint/ban-ts-comment": 0, + "@typescript-eslint/no-this-alias": 1, + "@typescript-eslint/no-empty-function": 1, + "@typescript-eslint/explicit-module-boundary-types": 1, + "@typescript-eslint/no-unused-vars": 1 + } +} diff --git a/dist/samples/layer-data-simple/app/README.md b/dist/samples/layer-data-simple/app/README.md new file mode 100644 index 00000000..ced55187 --- /dev/null +++ b/dist/samples/layer-data-simple/app/README.md @@ -0,0 +1,40 @@ +# Google Maps JavaScript Sample + +This sample is generated from @googlemaps/js-samples located at +https://github.com/googlemaps-samples/js-api-samples. + +## Setup + +### Before starting run: + +`npm i` + +### Run an example on a local web server + +`cd samples/layer-data-simple` +`npm start` + +### Build an individual example + +`cd samples/layer-data-simple` +`npm run build` + +From 'samples': + +`npm run build --workspace=layer-data-simple/` + +### Build all of the examples. + +From 'samples': + +`npm run build-all` + +### Run lint to check for problems + +`cd samples/layer-data-simple` +`npx eslint index.ts` + +## Feedback + +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/layer-data-simple/app/index.html b/dist/samples/layer-data-simple/app/index.html new file mode 100644 index 00000000..284e4c84 --- /dev/null +++ b/dist/samples/layer-data-simple/app/index.html @@ -0,0 +1,24 @@ + + + + + + Data Layer: Simple + + + + + + + + + + + + + diff --git a/dist/samples/layer-data-simple/app/index.ts b/dist/samples/layer-data-simple/app/index.ts new file mode 100644 index 00000000..3cfc7c3b --- /dev/null +++ b/dist/samples/layer-data-simple/app/index.ts @@ -0,0 +1,23 @@ +/** + * @license + * Copyright 2019 Google LLC. All Rights Reserved. + * SPDX-License-Identifier: Apache-2.0 + */ + +// [START maps_layer_data_simple] +async function initMap() { + (await google.maps.importLibrary("maps")) as google.maps.MapsLibrary; + + const mapElement = document.querySelector( + "gmp-map" + ) as google.maps.MapElement; + + let innerMap = mapElement.innerMap; + + google.maps.event.addListenerOnce(innerMap, "idle", () => { + innerMap.data.loadGeoJson("google.json"); + }); +} + +initMap(); +// [END maps_layer_data_simple] diff --git a/dist/samples/layer-data-simple/app/package.json b/dist/samples/layer-data-simple/app/package.json new file mode 100644 index 00000000..e29c81d4 --- /dev/null +++ b/dist/samples/layer-data-simple/app/package.json @@ -0,0 +1,12 @@ +{ + "name": "@js-api-samples/layer-data-simple", + "version": "1.0.0", + "scripts": { + "build": "tsc && bash ../jsfiddle.sh layer-data-simple && bash ../app.sh layer-data-simple && bash ../docs.sh layer-data-simple && npm run build:vite --workspace=. && bash ../dist.sh layer-data-simple", + "test": "tsc && npm run build:vite --workspace=.", + "start": "tsc && vite build --base './' && vite", + "build:vite": "vite build --base './'", + "preview": "vite preview" + }, + "dependencies": {} +} diff --git a/dist/samples/layer-data-simple/app/style.css b/dist/samples/layer-data-simple/app/style.css new file mode 100644 index 00000000..21f573cf --- /dev/null +++ b/dist/samples/layer-data-simple/app/style.css @@ -0,0 +1,25 @@ +/** + * @license + * Copyright 2019 Google LLC. All Rights Reserved. + * SPDX-License-Identifier: Apache-2.0 + */ +/* [START maps_layer_data_simple] */ +/* + * Always set the map height explicitly to define the size of the div element + * that contains the map. + */ +#map { + height: 100%; +} + +/* + * Optional: Makes the sample page fill the window. + */ +html, +body { + height: 100%; + margin: 0; + padding: 0; +} + +/* [END maps_layer_data_simple] */ diff --git a/dist/samples/layer-data-simple/app/tsconfig.json b/dist/samples/layer-data-simple/app/tsconfig.json new file mode 100644 index 00000000..791137f2 --- /dev/null +++ b/dist/samples/layer-data-simple/app/tsconfig.json @@ -0,0 +1,11 @@ +{ + "compilerOptions": { + "module": "esnext", + "target": "esnext", + "strict": true, + "noImplicitAny": false, + "lib": ["es2015", "esnext", "es6", "dom", "dom.iterable"], + "moduleResolution": "Node", + "jsx": "preserve" + } +} diff --git a/dist/samples/layer-data-simple/dist/assets/index-DW_Ml_OD.css b/dist/samples/layer-data-simple/dist/assets/index-DW_Ml_OD.css new file mode 100644 index 00000000..672cb7cc --- /dev/null +++ b/dist/samples/layer-data-simple/dist/assets/index-DW_Ml_OD.css @@ -0,0 +1,5 @@ +/** + * @license + * Copyright 2019 Google LLC. All Rights Reserved. + * SPDX-License-Identifier: Apache-2.0 + */#map{height:100%}html,body{height:100%;margin:0;padding:0} diff --git a/dist/samples/layer-data-simple/dist/assets/index-Eb2hSPIw.js b/dist/samples/layer-data-simple/dist/assets/index-Eb2hSPIw.js new file mode 100644 index 00000000..e6021a8c --- /dev/null +++ b/dist/samples/layer-data-simple/dist/assets/index-Eb2hSPIw.js @@ -0,0 +1,5 @@ +(function(){const r=document.createElement("link").relList;if(r&&r.supports&&r.supports("modulepreload"))return;for(const e of document.querySelectorAll('link[rel="modulepreload"]'))n(e);new MutationObserver(e=>{for(const t of e)if(t.type==="childList")for(const o of t.addedNodes)o.tagName==="LINK"&&o.rel==="modulepreload"&&n(o)}).observe(document,{childList:!0,subtree:!0});function s(e){const t={};return e.integrity&&(t.integrity=e.integrity),e.referrerPolicy&&(t.referrerPolicy=e.referrerPolicy),e.crossOrigin==="use-credentials"?t.credentials="include":e.crossOrigin==="anonymous"?t.credentials="omit":t.credentials="same-origin",t}function n(e){if(e.ep)return;e.ep=!0;const t=s(e);fetch(e.href,t)}})();/** + * @license + * Copyright 2019 Google LLC. All Rights Reserved. + * SPDX-License-Identifier: Apache-2.0 + */async function c(){await google.maps.importLibrary("maps");let r=document.querySelector("gmp-map").innerMap;google.maps.event.addListenerOnce(r,"idle",()=>{r.data.loadGeoJson("google.json")})}c(); diff --git a/dist/samples/layer-data-simple/dist/google.json b/dist/samples/layer-data-simple/dist/google.json new file mode 100644 index 00000000..be2f35f7 --- /dev/null +++ b/dist/samples/layer-data-simple/dist/google.json @@ -0,0 +1,146 @@ +{ + "type": "FeatureCollection", + "features": [ + { + "type": "Feature", + "properties": { + "letter": "G", + "color": "blue", + "rank": "7", + "ascii": "71" + }, + "geometry": { + "type": "Polygon", + "coordinates": [ + [ + [123.61, -22.14], [122.38, -21.73], [121.06, -21.69], [119.66, -22.22], [119.00, -23.40], + [118.65, -24.76], [118.43, -26.07], [118.78, -27.56], [119.22, -28.57], [120.23, -29.49], + [121.77, -29.87], [123.57, -29.64], [124.45, -29.03], [124.71, -27.95], [124.80, -26.70], + [124.80, -25.60], [123.61, -25.64], [122.56, -25.64], [121.72, -25.72], [121.81, -26.62], + [121.86, -26.98], [122.60, -26.90], [123.57, -27.05], [123.57, -27.68], [123.35, -28.18], + [122.51, -28.38], [121.77, -28.26], [121.02, -27.91], [120.49, -27.21], [120.14, -26.50], + [120.10, -25.64], [120.27, -24.52], [120.67, -23.68], [121.72, -23.32], [122.43, -23.48], + [123.04, -24.04], [124.54, -24.28], [124.58, -23.20], [123.61, -22.14] + ] + ] + } + }, + { + "type": "Feature", + "properties": { + "letter": "o", + "color": "red", + "rank": "15", + "ascii": "111" + }, + "geometry": { + "type": "Polygon", + "coordinates": [ + [ + [128.84, -25.76], [128.18, -25.60], [127.96, -25.52], [127.88, -25.52], [127.70, -25.60], + [127.26, -25.79], [126.60, -26.11], [126.16, -26.78], [126.12, -27.68], [126.21, -28.42], + [126.69, -29.49], [127.74, -29.80], [128.80, -29.72], [129.41, -29.03], [129.72, -27.95], + [129.68, -27.21], [129.33, -26.23], [128.84, -25.76] + ], + [ + [128.45, -27.44], [128.32, -26.94], [127.70, -26.82], [127.35, -27.05], [127.17, -27.80], + [127.57, -28.22], [128.10, -28.42], [128.49, -27.80], [128.45, -27.44] + ] + ] + } + }, + { + "type": "Feature", + "properties": { + "letter": "o", + "color": "yellow", + "rank": "15", + "ascii": "111" + }, + "geometry": { + "type": "Polygon", + "coordinates": [ + [ + [131.87, -25.76], [131.35, -26.07], [130.95, -26.78], [130.82, -27.64], [130.86, -28.53], + [131.26, -29.22], [131.92, -29.76], [132.45, -29.87], [133.06, -29.76], [133.72, -29.34], + [134.07, -28.80], [134.20, -27.91], [134.07, -27.21], [133.81, -26.31], [133.37, -25.83], + [132.71, -25.64], [131.87, -25.76] + ], + [ + [133.15, -27.17], [132.71, -26.86], [132.09, -26.90], [131.74, -27.56], [131.79, -28.26], + [132.36, -28.45], [132.93, -28.34], [133.15, -27.76], [133.15, -27.17] + ] + ] + } + }, + { + "type": "Feature", + "properties": { + "letter": "g", + "color": "blue", + "rank": "7", + "ascii": "103" + }, + "geometry": { + "type": "Polygon", + "coordinates": [ + [ + [138.12, -25.04], [136.84, -25.16], [135.96, -25.36], [135.26, -25.99], [135, -26.90], + [135.04, -27.91], [135.26, -28.88], [136.05, -29.45], [137.02, -29.49], [137.81, -29.49], + [137.94, -29.99], [137.90, -31.20], [137.85, -32.24], [136.88, -32.69], [136.45, -32.36], + [136.27, -31.80], [134.95, -31.84], [135.17, -32.99], [135.52, -33.43], [136.14, -33.76], + [137.06, -33.83], [138.12, -33.65], [138.86, -33.21], [139.30, -32.28], [139.30, -31.24], + [139.30, -30.14], [139.21, -28.96], [139.17, -28.22], [139.08, -27.41], [139.08, -26.47], + [138.99, -25.40], [138.73, -25.00 ], [138.12, -25.04] + ], + [ + [137.50, -26.54], [136.97, -26.47], [136.49, -26.58], [136.31, -27.13], [136.31, -27.72], + [136.58, -27.99], [137.50, -28.03], [137.68, -27.68], [137.59, -26.78], [137.50, -26.54] + ] + ] + } + }, + { + "type": "Feature", + "properties": { + "letter": "l", + "color": "green", + "rank": "12", + "ascii": "108" + }, + "geometry": { + "type": "Polygon", + "coordinates": [ + [ + [140.14,-21.04], [140.31,-29.42], [141.67,-29.49], [141.59,-20.92], [140.14,-21.04] + ] + ] + } + }, + { + "type": "Feature", + "properties": { + "letter": "e", + "color": "red", + "rank": "5", + "ascii": "101" + }, + "geometry": { + "type": "Polygon", + "coordinates": [ + [ + [144.14, -27.41], [145.67, -27.52], [146.86, -27.09], [146.82, -25.64], [146.25, -25.04], + [145.45, -24.68], [144.66, -24.60], [144.09, -24.76], [143.43, -25.08], [142.99, -25.40], + [142.64, -26.03], [142.64, -27.05], [142.64, -28.26], [143.30, -29.11], [144.18, -29.57], + [145.41, -29.64], [146.46, -29.19], [146.64, -28.72], [146.82, -28.14], [144.84, -28.42], + [144.31, -28.26], [144.14, -27.41] + ], + [ + [144.18, -26.39], [144.53, -26.58], [145.19, -26.62], [145.72, -26.35], [145.81, -25.91], + [145.41, -25.68], [144.97, -25.68], [144.49, -25.64], [144, -25.99], [144.18, -26.39] + ] + ] + } + } + ] +} \ No newline at end of file diff --git a/dist/samples/layer-data-simple/dist/index.html b/dist/samples/layer-data-simple/dist/index.html new file mode 100644 index 00000000..bff7f64c --- /dev/null +++ b/dist/samples/layer-data-simple/dist/index.html @@ -0,0 +1,24 @@ + + + + + + Data Layer: Simple + + + + + + + + + + + + + diff --git a/dist/samples/layer-data-simple/docs/google.json b/dist/samples/layer-data-simple/docs/google.json new file mode 100644 index 00000000..be2f35f7 --- /dev/null +++ b/dist/samples/layer-data-simple/docs/google.json @@ -0,0 +1,146 @@ +{ + "type": "FeatureCollection", + "features": [ + { + "type": "Feature", + "properties": { + "letter": "G", + "color": "blue", + "rank": "7", + "ascii": "71" + }, + "geometry": { + "type": "Polygon", + "coordinates": [ + [ + [123.61, -22.14], [122.38, -21.73], [121.06, -21.69], [119.66, -22.22], [119.00, -23.40], + [118.65, -24.76], [118.43, -26.07], [118.78, -27.56], [119.22, -28.57], [120.23, -29.49], + [121.77, -29.87], [123.57, -29.64], [124.45, -29.03], [124.71, -27.95], [124.80, -26.70], + [124.80, -25.60], [123.61, -25.64], [122.56, -25.64], [121.72, -25.72], [121.81, -26.62], + [121.86, -26.98], [122.60, -26.90], [123.57, -27.05], [123.57, -27.68], [123.35, -28.18], + [122.51, -28.38], [121.77, -28.26], [121.02, -27.91], [120.49, -27.21], [120.14, -26.50], + [120.10, -25.64], [120.27, -24.52], [120.67, -23.68], [121.72, -23.32], [122.43, -23.48], + [123.04, -24.04], [124.54, -24.28], [124.58, -23.20], [123.61, -22.14] + ] + ] + } + }, + { + "type": "Feature", + "properties": { + "letter": "o", + "color": "red", + "rank": "15", + "ascii": "111" + }, + "geometry": { + "type": "Polygon", + "coordinates": [ + [ + [128.84, -25.76], [128.18, -25.60], [127.96, -25.52], [127.88, -25.52], [127.70, -25.60], + [127.26, -25.79], [126.60, -26.11], [126.16, -26.78], [126.12, -27.68], [126.21, -28.42], + [126.69, -29.49], [127.74, -29.80], [128.80, -29.72], [129.41, -29.03], [129.72, -27.95], + [129.68, -27.21], [129.33, -26.23], [128.84, -25.76] + ], + [ + [128.45, -27.44], [128.32, -26.94], [127.70, -26.82], [127.35, -27.05], [127.17, -27.80], + [127.57, -28.22], [128.10, -28.42], [128.49, -27.80], [128.45, -27.44] + ] + ] + } + }, + { + "type": "Feature", + "properties": { + "letter": "o", + "color": "yellow", + "rank": "15", + "ascii": "111" + }, + "geometry": { + "type": "Polygon", + "coordinates": [ + [ + [131.87, -25.76], [131.35, -26.07], [130.95, -26.78], [130.82, -27.64], [130.86, -28.53], + [131.26, -29.22], [131.92, -29.76], [132.45, -29.87], [133.06, -29.76], [133.72, -29.34], + [134.07, -28.80], [134.20, -27.91], [134.07, -27.21], [133.81, -26.31], [133.37, -25.83], + [132.71, -25.64], [131.87, -25.76] + ], + [ + [133.15, -27.17], [132.71, -26.86], [132.09, -26.90], [131.74, -27.56], [131.79, -28.26], + [132.36, -28.45], [132.93, -28.34], [133.15, -27.76], [133.15, -27.17] + ] + ] + } + }, + { + "type": "Feature", + "properties": { + "letter": "g", + "color": "blue", + "rank": "7", + "ascii": "103" + }, + "geometry": { + "type": "Polygon", + "coordinates": [ + [ + [138.12, -25.04], [136.84, -25.16], [135.96, -25.36], [135.26, -25.99], [135, -26.90], + [135.04, -27.91], [135.26, -28.88], [136.05, -29.45], [137.02, -29.49], [137.81, -29.49], + [137.94, -29.99], [137.90, -31.20], [137.85, -32.24], [136.88, -32.69], [136.45, -32.36], + [136.27, -31.80], [134.95, -31.84], [135.17, -32.99], [135.52, -33.43], [136.14, -33.76], + [137.06, -33.83], [138.12, -33.65], [138.86, -33.21], [139.30, -32.28], [139.30, -31.24], + [139.30, -30.14], [139.21, -28.96], [139.17, -28.22], [139.08, -27.41], [139.08, -26.47], + [138.99, -25.40], [138.73, -25.00 ], [138.12, -25.04] + ], + [ + [137.50, -26.54], [136.97, -26.47], [136.49, -26.58], [136.31, -27.13], [136.31, -27.72], + [136.58, -27.99], [137.50, -28.03], [137.68, -27.68], [137.59, -26.78], [137.50, -26.54] + ] + ] + } + }, + { + "type": "Feature", + "properties": { + "letter": "l", + "color": "green", + "rank": "12", + "ascii": "108" + }, + "geometry": { + "type": "Polygon", + "coordinates": [ + [ + [140.14,-21.04], [140.31,-29.42], [141.67,-29.49], [141.59,-20.92], [140.14,-21.04] + ] + ] + } + }, + { + "type": "Feature", + "properties": { + "letter": "e", + "color": "red", + "rank": "5", + "ascii": "101" + }, + "geometry": { + "type": "Polygon", + "coordinates": [ + [ + [144.14, -27.41], [145.67, -27.52], [146.86, -27.09], [146.82, -25.64], [146.25, -25.04], + [145.45, -24.68], [144.66, -24.60], [144.09, -24.76], [143.43, -25.08], [142.99, -25.40], + [142.64, -26.03], [142.64, -27.05], [142.64, -28.26], [143.30, -29.11], [144.18, -29.57], + [145.41, -29.64], [146.46, -29.19], [146.64, -28.72], [146.82, -28.14], [144.84, -28.42], + [144.31, -28.26], [144.14, -27.41] + ], + [ + [144.18, -26.39], [144.53, -26.58], [145.19, -26.62], [145.72, -26.35], [145.81, -25.91], + [145.41, -25.68], [144.97, -25.68], [144.49, -25.64], [144, -25.99], [144.18, -26.39] + ] + ] + } + } + ] +} \ No newline at end of file diff --git a/dist/samples/layer-data-simple/docs/index.html b/dist/samples/layer-data-simple/docs/index.html new file mode 100644 index 00000000..284e4c84 --- /dev/null +++ b/dist/samples/layer-data-simple/docs/index.html @@ -0,0 +1,24 @@ + + + + + + Data Layer: Simple + + + + + + + + + + + + + diff --git a/dist/samples/layer-data-simple/docs/index.js b/dist/samples/layer-data-simple/docs/index.js new file mode 100644 index 00000000..e31f9a29 --- /dev/null +++ b/dist/samples/layer-data-simple/docs/index.js @@ -0,0 +1,17 @@ +"use strict"; +/** + * @license + * Copyright 2019 Google LLC. All Rights Reserved. + * SPDX-License-Identifier: Apache-2.0 + */ +// [START maps_layer_data_simple] +async function initMap() { + (await google.maps.importLibrary("maps")); + const mapElement = document.querySelector("gmp-map"); + let innerMap = mapElement.innerMap; + google.maps.event.addListenerOnce(innerMap, "idle", () => { + innerMap.data.loadGeoJson("google.json"); + }); +} +initMap(); +// [END maps_layer_data_simple] diff --git a/dist/samples/layer-data-simple/docs/index.ts b/dist/samples/layer-data-simple/docs/index.ts new file mode 100644 index 00000000..3cfc7c3b --- /dev/null +++ b/dist/samples/layer-data-simple/docs/index.ts @@ -0,0 +1,23 @@ +/** + * @license + * Copyright 2019 Google LLC. All Rights Reserved. + * SPDX-License-Identifier: Apache-2.0 + */ + +// [START maps_layer_data_simple] +async function initMap() { + (await google.maps.importLibrary("maps")) as google.maps.MapsLibrary; + + const mapElement = document.querySelector( + "gmp-map" + ) as google.maps.MapElement; + + let innerMap = mapElement.innerMap; + + google.maps.event.addListenerOnce(innerMap, "idle", () => { + innerMap.data.loadGeoJson("google.json"); + }); +} + +initMap(); +// [END maps_layer_data_simple] diff --git a/dist/samples/layer-data-simple/docs/style.css b/dist/samples/layer-data-simple/docs/style.css new file mode 100644 index 00000000..21f573cf --- /dev/null +++ b/dist/samples/layer-data-simple/docs/style.css @@ -0,0 +1,25 @@ +/** + * @license + * Copyright 2019 Google LLC. All Rights Reserved. + * SPDX-License-Identifier: Apache-2.0 + */ +/* [START maps_layer_data_simple] */ +/* + * Always set the map height explicitly to define the size of the div element + * that contains the map. + */ +#map { + height: 100%; +} + +/* + * Optional: Makes the sample page fill the window. + */ +html, +body { + height: 100%; + margin: 0; + padding: 0; +} + +/* [END maps_layer_data_simple] */ diff --git a/dist/samples/layer-data-simple/jsfiddle/demo.css b/dist/samples/layer-data-simple/jsfiddle/demo.css new file mode 100644 index 00000000..38d9eeed --- /dev/null +++ b/dist/samples/layer-data-simple/jsfiddle/demo.css @@ -0,0 +1,25 @@ +/** + * @license + * Copyright 2019 Google LLC. All Rights Reserved. + * SPDX-License-Identifier: Apache-2.0 + */ + +/* + * Always set the map height explicitly to define the size of the div element + * that contains the map. + */ +#map { + height: 100%; +} + +/* + * Optional: Makes the sample page fill the window. + */ +html, +body { + height: 100%; + margin: 0; + padding: 0; +} + + diff --git a/dist/samples/layer-data-simple/jsfiddle/demo.details b/dist/samples/layer-data-simple/jsfiddle/demo.details new file mode 100644 index 00000000..8eb56a48 --- /dev/null +++ b/dist/samples/layer-data-simple/jsfiddle/demo.details @@ -0,0 +1,7 @@ +name: layer-data-simple +authors: + - Geo Developer IX Documentation Team +tags: + - google maps +load_type: h +description: Sample code supporting Google Maps Platform JavaScript API documentation. diff --git a/dist/samples/layer-data-simple/jsfiddle/demo.html b/dist/samples/layer-data-simple/jsfiddle/demo.html new file mode 100644 index 00000000..fe360d79 --- /dev/null +++ b/dist/samples/layer-data-simple/jsfiddle/demo.html @@ -0,0 +1,24 @@ + + + + + + Data Layer: Simple + + + + + + + + + + + + + diff --git a/dist/samples/layer-data-simple/jsfiddle/demo.js b/dist/samples/layer-data-simple/jsfiddle/demo.js new file mode 100644 index 00000000..366323d8 --- /dev/null +++ b/dist/samples/layer-data-simple/jsfiddle/demo.js @@ -0,0 +1,17 @@ +"use strict"; +/** + * @license + * Copyright 2019 Google LLC. All Rights Reserved. + * SPDX-License-Identifier: Apache-2.0 + */ + +async function initMap() { + (await google.maps.importLibrary("maps")); + const mapElement = document.querySelector("gmp-map"); + let innerMap = mapElement.innerMap; + google.maps.event.addListenerOnce(innerMap, "idle", () => { + innerMap.data.loadGeoJson("google.json"); + }); +} +initMap(); + diff --git a/dist/samples/layer-data-simple/jsfiddle/google.json b/dist/samples/layer-data-simple/jsfiddle/google.json new file mode 100644 index 00000000..be2f35f7 --- /dev/null +++ b/dist/samples/layer-data-simple/jsfiddle/google.json @@ -0,0 +1,146 @@ +{ + "type": "FeatureCollection", + "features": [ + { + "type": "Feature", + "properties": { + "letter": "G", + "color": "blue", + "rank": "7", + "ascii": "71" + }, + "geometry": { + "type": "Polygon", + "coordinates": [ + [ + [123.61, -22.14], [122.38, -21.73], [121.06, -21.69], [119.66, -22.22], [119.00, -23.40], + [118.65, -24.76], [118.43, -26.07], [118.78, -27.56], [119.22, -28.57], [120.23, -29.49], + [121.77, -29.87], [123.57, -29.64], [124.45, -29.03], [124.71, -27.95], [124.80, -26.70], + [124.80, -25.60], [123.61, -25.64], [122.56, -25.64], [121.72, -25.72], [121.81, -26.62], + [121.86, -26.98], [122.60, -26.90], [123.57, -27.05], [123.57, -27.68], [123.35, -28.18], + [122.51, -28.38], [121.77, -28.26], [121.02, -27.91], [120.49, -27.21], [120.14, -26.50], + [120.10, -25.64], [120.27, -24.52], [120.67, -23.68], [121.72, -23.32], [122.43, -23.48], + [123.04, -24.04], [124.54, -24.28], [124.58, -23.20], [123.61, -22.14] + ] + ] + } + }, + { + "type": "Feature", + "properties": { + "letter": "o", + "color": "red", + "rank": "15", + "ascii": "111" + }, + "geometry": { + "type": "Polygon", + "coordinates": [ + [ + [128.84, -25.76], [128.18, -25.60], [127.96, -25.52], [127.88, -25.52], [127.70, -25.60], + [127.26, -25.79], [126.60, -26.11], [126.16, -26.78], [126.12, -27.68], [126.21, -28.42], + [126.69, -29.49], [127.74, -29.80], [128.80, -29.72], [129.41, -29.03], [129.72, -27.95], + [129.68, -27.21], [129.33, -26.23], [128.84, -25.76] + ], + [ + [128.45, -27.44], [128.32, -26.94], [127.70, -26.82], [127.35, -27.05], [127.17, -27.80], + [127.57, -28.22], [128.10, -28.42], [128.49, -27.80], [128.45, -27.44] + ] + ] + } + }, + { + "type": "Feature", + "properties": { + "letter": "o", + "color": "yellow", + "rank": "15", + "ascii": "111" + }, + "geometry": { + "type": "Polygon", + "coordinates": [ + [ + [131.87, -25.76], [131.35, -26.07], [130.95, -26.78], [130.82, -27.64], [130.86, -28.53], + [131.26, -29.22], [131.92, -29.76], [132.45, -29.87], [133.06, -29.76], [133.72, -29.34], + [134.07, -28.80], [134.20, -27.91], [134.07, -27.21], [133.81, -26.31], [133.37, -25.83], + [132.71, -25.64], [131.87, -25.76] + ], + [ + [133.15, -27.17], [132.71, -26.86], [132.09, -26.90], [131.74, -27.56], [131.79, -28.26], + [132.36, -28.45], [132.93, -28.34], [133.15, -27.76], [133.15, -27.17] + ] + ] + } + }, + { + "type": "Feature", + "properties": { + "letter": "g", + "color": "blue", + "rank": "7", + "ascii": "103" + }, + "geometry": { + "type": "Polygon", + "coordinates": [ + [ + [138.12, -25.04], [136.84, -25.16], [135.96, -25.36], [135.26, -25.99], [135, -26.90], + [135.04, -27.91], [135.26, -28.88], [136.05, -29.45], [137.02, -29.49], [137.81, -29.49], + [137.94, -29.99], [137.90, -31.20], [137.85, -32.24], [136.88, -32.69], [136.45, -32.36], + [136.27, -31.80], [134.95, -31.84], [135.17, -32.99], [135.52, -33.43], [136.14, -33.76], + [137.06, -33.83], [138.12, -33.65], [138.86, -33.21], [139.30, -32.28], [139.30, -31.24], + [139.30, -30.14], [139.21, -28.96], [139.17, -28.22], [139.08, -27.41], [139.08, -26.47], + [138.99, -25.40], [138.73, -25.00 ], [138.12, -25.04] + ], + [ + [137.50, -26.54], [136.97, -26.47], [136.49, -26.58], [136.31, -27.13], [136.31, -27.72], + [136.58, -27.99], [137.50, -28.03], [137.68, -27.68], [137.59, -26.78], [137.50, -26.54] + ] + ] + } + }, + { + "type": "Feature", + "properties": { + "letter": "l", + "color": "green", + "rank": "12", + "ascii": "108" + }, + "geometry": { + "type": "Polygon", + "coordinates": [ + [ + [140.14,-21.04], [140.31,-29.42], [141.67,-29.49], [141.59,-20.92], [140.14,-21.04] + ] + ] + } + }, + { + "type": "Feature", + "properties": { + "letter": "e", + "color": "red", + "rank": "5", + "ascii": "101" + }, + "geometry": { + "type": "Polygon", + "coordinates": [ + [ + [144.14, -27.41], [145.67, -27.52], [146.86, -27.09], [146.82, -25.64], [146.25, -25.04], + [145.45, -24.68], [144.66, -24.60], [144.09, -24.76], [143.43, -25.08], [142.99, -25.40], + [142.64, -26.03], [142.64, -27.05], [142.64, -28.26], [143.30, -29.11], [144.18, -29.57], + [145.41, -29.64], [146.46, -29.19], [146.64, -28.72], [146.82, -28.14], [144.84, -28.42], + [144.31, -28.26], [144.14, -27.41] + ], + [ + [144.18, -26.39], [144.53, -26.58], [145.19, -26.62], [145.72, -26.35], [145.81, -25.91], + [145.41, -25.68], [144.97, -25.68], [144.49, -25.64], [144, -25.99], [144.18, -26.39] + ] + ] + } + } + ] +} \ No newline at end of file diff --git a/index.html b/index.html index 54a4c17e..9a47c295 100644 --- a/index.html +++ b/index.html @@ -48,6 +48,7 @@

    Maps JSAPI Samples

  • deckgl-kml
  • deckgl-kml-updated
  • deckgl-polygon
  • +
  • layer-data-simple
  • map-drawing-terradraw
  • map-simple
  • place-autocomplete-basic-map
  • diff --git a/package-lock.json b/package-lock.json index be17457c..c5fbaac2 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1347,6 +1347,10 @@ "resolved": "samples/deckgl-polygon", "link": true }, + "node_modules/@js-api-samples/layer-data-simple": { + "resolved": "samples/layer-data-simple", + "link": true + }, "node_modules/@js-api-samples/map-drawing-terradraw": { "resolved": "samples/map-drawing-terradraw", "link": true @@ -5895,6 +5899,10 @@ "name": "@js-api-samples/deckgl-polygon", "version": "1.0.0" }, + "samples/layer-data-simple": { + "name": "@js-api-samples/layer-data-simple", + "version": "1.0.0" + }, "samples/map-drawing-terradraw": { "name": "@js-api-samples/map-drawing-terradraw", "version": "1.0.0",