/
index.ts
61 lines (55 loc) · 1.3 KB
/
index.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
/**
* @license
* Copyright 2019 Google LLC. All Rights Reserved.
* SPDX-License-Identifier: Apache-2.0
*/
// [START maps_marker_modern]
import { faBus } from "@fortawesome/free-solid-svg-icons";
function initMap(): void {
const center = { lat: 36.6163, lng: -100.605 };
const map = new google.maps.Map(
document.getElementById("map") as HTMLElement,
{
zoom: 15,
center,
}
);
// use a FontAwesome svg
new google.maps.Marker({
position: { lat: 36.6163, lng: -100.61 },
map,
icon: {
path: faBus.icon[4] as string,
fillColor: "#0000ff",
fillOpacity: 1,
anchor: new google.maps.Point(
faBus.icon[0] / 2, // width
faBus.icon[1] // height
),
strokeWeight: 1,
strokeColor: "#ffffff",
scale: 0.075,
},
title: "FontAwesome SVG Marker",
});
// use a Material Icon as font
new google.maps.Marker({
position: { lat: 36.6163, lng: -100.6 },
map,
label: {
text: "\ue530", // codepoint from https://fonts.google.com/icons
fontFamily: "Material Icons",
color: "#ffffff",
fontSize: "18px",
},
title: "Material Icon Font Marker",
});
}
declare global {
interface Window {
initMap: () => void;
}
}
window.initMap = initMap;
// [END maps_marker_modern]
export {};