-
Notifications
You must be signed in to change notification settings - Fork 823
Commit
Change-Id: Ic28cc873ffc1616fa9cd6ded887f42d0a38d85ef
- Loading branch information
There are no files selected for viewing
Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.
Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.
Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.
Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.
Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.
Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.
Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.
Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.
Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.
Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.
Large diffs are not rendered by default.
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,9 @@ | ||
<!DOCTYPE html> | ||
<!-- | ||
@license | ||
Copyright 2019 Google LLC. All Rights Reserved. | ||
SPDX-License-Identifier: Apache-2.0 | ||
--> | ||
{% extends '../../src/_includes/layout.njk'%} {% block html %} | ||
<div id="map"></div> | ||
{% endblock %} |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,76 @@ | ||
/** | ||
* @license | ||
* Copyright 2019 Google LLC. All Rights Reserved. | ||
* SPDX-License-Identifier: Apache-2.0 | ||
*/ | ||
|
||
// [START maps_tree_pollen] | ||
function getNormalizedCoord(coord, zoom) { | ||
const y = coord.y; | ||
let x = coord.x; | ||
// tile range in one direction range is dependent on zoom level | ||
// 0 = 1 tile, 1 = 2 tiles, 2 = 4 tiles, 3 = 8 tiles, etc | ||
const tileRange = 1 << zoom; | ||
|
||
// don't repeat across y-axis (vertically) | ||
if (y < 0 || y >= tileRange) { | ||
return null; | ||
} | ||
|
||
// repeat across x-axis | ||
if (x < 0 || x >= tileRange) { | ||
x = ((x % tileRange) + tileRange) % tileRange; | ||
} | ||
return { x: x, y: y }; | ||
} | ||
|
||
class AirQualityMapType { | ||
tileSize; | ||
alt = null; | ||
maxZoom = 16; | ||
minZoom = 3; | ||
name = null; | ||
projection = null; | ||
radius = 6378137; | ||
constructor(tileSize) { | ||
this.tileSize = tileSize; | ||
} | ||
|
||
getTile(coord, zoom, ownerDocument) { | ||
const img = ownerDocument.createElement("img"); | ||
const mapType = "TREE_UPI"; | ||
const normalizedCoord = getNormalizedCoord(coord, zoom); | ||
|
||
const x = coord.x; | ||
const y = coord.y; | ||
const key = "AIzaSyD4jWorF4eIMiBE3oZnd73Y7kOVO9q6gBE"; | ||
img.style.opacity = 0.8; | ||
img.src = `https://pollen.googleapis.com/v1/mapTypes/${mapType}/heatmapTiles/${zoom}/${x}/${y}?key=${key}`; | ||
return img; | ||
} | ||
releaseTile(tile) {} | ||
} | ||
|
||
async function initMap(): Promise<void> { | ||
const { Map } = await google.maps.importLibrary("maps") as google.maps.MapsLibrary; | ||
const myLatLng = { lat: 40.3769, lng: -80.5417 }; | ||
const map = new google.maps.Map(document.getElementById("map") as HTMLElement, { | ||
mapId: "ffcdd6091fa9fb03", | ||
zoom: 0, | ||
center: myLatLng, | ||
maxZoom: 16, | ||
minZoom: 3, | ||
restriction: { | ||
latLngBounds: {north: 80, south: -80, west: -180, east: 180}, | ||
strictBounds: true, | ||
}, | ||
streetViewControl: false, | ||
}); | ||
const aqMapType = new AirQualityMapType(new google.maps.Size(256, 256)); | ||
map.overlayMapTypes.insertAt(0, aqMapType); | ||
|
||
} | ||
|
||
initMap(); | ||
// [END maps_tree_pollen] | ||
export {}; |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,12 @@ | ||
/** | ||
* @license | ||
* Copyright 2019 Google LLC. All Rights Reserved. | ||
* SPDX-License-Identifier: Apache-2.0 | ||
*/ | ||
|
||
@use 'sass:meta'; // To enable @use via meta.load-css and keep comments in order | ||
|
||
/* [START maps_tree_pollen] */ | ||
@include meta.load-css("../../shared/scss/default.scss"); | ||
|
||
/* [END maps_tree_pollen] */ |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,13 @@ | ||
{ | ||
"title": "Tree Pollen", | ||
"version": "beta", | ||
"dynamic_import": "true", | ||
"tag": "tree_pollen", | ||
"name": "tree-pollen", | ||
"pagination": { | ||
"data": "mode", | ||
"size": 1, | ||
"alias": "mode" | ||
}, | ||
"permalink": "samples/{{ page.fileSlug }}/{{mode}}/{% if mode == 'jsfiddle' %}demo{% else %}index{% endif %}.{{ page.outputFileExtension }}" | ||
} |