-
Notifications
You must be signed in to change notification settings - Fork 1
/
mappp.html
218 lines (210 loc) · 13.4 KB
/
mappp.html
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
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<title>Complex icons</title>
<style>
/* 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;
}
</style>
</head>
<body>
<div id="map"></div>
<script>
// The following example creates complex markers to indicate beaches near
// Sydney, NSW, Australia. Note that the anchor is set to (0,32) to correspond
// to the base of the flagpole.
function initMap() {
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 10,
center: {lat: 23.973875, lng: 120.982024}
});
setMarkers(map);
}
// Data for the markers consisting of a name, a LatLng and a zIndex for the
// order in which these markers should display on top of each other.
var address = [
['臺中市西屯區文心路2段588號', 24.1595839,120.64828439999997],
['臺中市西區三民路1段178號', 24.1385183,120.67579750000004],
['臺中市西區三民路1段178號', 24.1385183,120.67579750000004],
['臺中市西區精誠二十三街30號', 24.1459977,120.65648599999997],
['臺中市西區民權路258號', 24.146132,120.67071659999999],
['臺中市中區成功路302號', 24.143928,120.67952790000004],
['臺中市中區中山路9號', 24.1374378,120.68379589999995],
['臺中市北區太原路2段228號', 24.164933,120.68230349999999],
['臺中市北區太原路2段228號', 24.164933,120.68230349999999],
['臺中市北區天津路1段2號', 24.1698532,120.66841699999998],
['臺中市北區三民路3段128號', 24.1505287,120.68456519999995],
['臺中市北區中正路440號', 24.2507458,120.71045079999999],
['臺中市北區雙十路1段65號', 24.1443145,120.68570939999995],
['臺中市南區復興路3段157號', 24.1306242,120.67339930000003],
['臺中市東區進化路16號', 24.1413624,120.69441039999992],
['臺中市東區力行路202號', 24.1518313,120.69297710000001],
['臺中市東區振興路6號', 24.1357654,120.69009060000008],
['臺中市南區復興路1段235號', 24.1122033,120.65079809999997],
['臺中市南區美村南路8號', 24.1196396,120.66697369999997],
['臺中市南區復興路3段159號', 24.130696,120.67345580000006],
['臺中市南屯區向心南路811號', 24.1343175,120.6438177],
['臺中市南屯區干城街2號', 24.1557986,120.63406650000002],
['臺中市南屯區忠勇路23之5號', 24.1362394,120.61162149999996],
['臺中市南屯區黎明路1段1056號', 24.1396821,120.63831589999995],
['臺中市南屯區大墩路229號', 24.1420644,120.64974280000001],
['臺中市北屯區崇德路3段2號', 24.1820492,120.68649670000002],
['臺中市北屯區文昌東三街48號', 24.1702769,120.68058329999997],
['臺中市北屯區東山路2段30號', 24.1790855,120.74031990000003],
['臺中市北屯區昌平路2段63號', 24.1925317,120.68213880000008],
['臺中市北屯區中清路99號', 24.1783027,120.66816470000003],
['臺中市北屯區北屯路106號', 24.1638399,120.6937891],
['臺中市北屯區松竹路2段5號', 24.1823452,120.69987409999999],
['臺中市西屯區市政路456號', 24.1594604,120.63899390000006],
['臺中市西屯區市政路456號', 24.1594604,120.63899390000006],
['臺中市西屯區西屯路3段40號', 24.1810237,120.63791519999995],
['臺中市西屯區甘肅路106號', 24.1661996,120.65911299999993],
['臺中市西屯區臺灣大道4段1347號', 24.1838726,120.608746],
['臺中市西屯區工業五路2之1號', 24.1690782,120.6082629],
['臺中市西屯區福科路372號', 24.1846292,120.61964379999995],
['臺中市大甲區文武路1號', 24.3452489,120.62683820000007],
['臺中市大甲區大甲里文武路1號', 24.3452489,120.62683820000007],
['臺中市外埔區土城路110號', 24.3452172,120.70423340000002],
['臺中市大甲區中山路2段165號', 24.3793401,120.65397689999998],
['臺中市后里區三月路19號', 24.3133762,120.69235249999997],
['臺中市大甲區順帆路94號', 24.4200133,120.62885329999995],
['臺中市后里區安眉路1號', 24.3241632,120.75176239999996],
['臺中市大安區大安港路1160號', 24.3793111,120.58683859999996],
['臺中市后里區三豐路209號', 24.3003494,120.72311259999992],
['臺中市后里區公安路88號', 24.3052361,120.71007080000004],
['臺中市外埔區六分路350號', 24.3322874,120.65542349999998],
['臺中市大安區中山南路300號', 24.3455164,120.58710329999997],
['臺中市和平區東關路3段154號', 24.1746924,120.88500840000006],
['臺中市和平區東關路2段33號', 24.1834983,120.92967079999994],
['臺中市和平區和平路2段16之1號', 24.256863,121.2094131],
['臺中市和平區中興路3段48號', 24.3121427,121.29259249999996],
['臺中市和平區東崎路2段39號', 24.2918755,120.90965649999998],
['臺中市和平區東崎路1段桃山巷7之2號', 24.340028,120.93577290000007],
['臺中市和平區雪山路2號', 24.241034,120.90721389999999],
['臺中市和平區平等村中興路1段21號', 24.3692056,121.34019339999998],
['臺中市和平區中興路2段47號', 24.3404412,121.31274180000003],
['臺中市和平區東崎路1段89號', 24.3051224,120.9245697],
['臺中市和平區中正路103號', 24.25651,121.25876560000006],
['臺中市和平區中興路4段54號', 24.2872076,121.26481349999995],
['臺中市和平區東關路3段270號', 24.1692005,120.86961450000001],
['臺中市和平區博愛村東關路1段125號', 24.1643026,120.95205399999998],
['臺中市和平區雪山路10號', 24.2269832,120.89430089999996],
['臺中市烏日區中山路3段309號', 24.1083169,120.60707819999993],
['臺中市烏日區中山路2段309號', 24.106243,120.62271149999992],
['臺中市龍井區中央路1段165巷36號', 24.2006145,120.52345880000007],
['臺中市烏日區五光路281號', 24.0929517,120.64797390000001],
['臺中市龍井區沙田路4段245號', 24.1918639,120.54590630000007],
['臺中市烏日區溪南路2段638號', 24.0565319,120.64628689999995],
['臺中市龍井區茄投路67號', 24.1786434,120.53041200000007],
['臺中市龍井區臨港東路2段317號', 24.1978626,120.51461530000006],
['臺中市龍井區遊園南路194號', 24.1825992,120.58414319999997],
['臺中市大肚區沙田路1段290號', 24.1214329,120.57028790000004],
['臺中市大肚區沙田路3段38號', 24.1549633,120.54437689999997],
['臺中市大肚區遊園路1段1之1號', 24.1521652,120.57350529999997],
['臺中市烏日區三榮八路25號', 24.1077465,120.6030968],
['臺中市東勢區豐勢路512號', 24.2583553,120.82803480000007],
['臺中市東勢區豐勢路512號', 24.2583553,120.82803480000007],
['臺中市東勢區下城里下城街36號', 24.2195822,120.83787259999997],
['臺中市新社區興社街1段285號', 24.2069785,120.82141819999993],
['臺中市石岡區豐勢路19號', 24.2601189,120.81615099999999],
['臺中市東勢區東坑路665號', 24.2362208,120.85429010000007],
['臺中市新社區中和街1段20號', 24.2194838,120.7923882],
['臺中市東勢區石城街297號', 24.2851517,120.78912439999999],
['臺中市新社區美林45號', 24.1592112,120.86494390000007],
['臺中市石岡區豐勢路1021號', 24.2749255,120.78093860000001],
['臺中市新社區興社街2段28之3號', 24.2341665,120.81001739999999],
['臺中市清水區鰲峰路23號', 24.2692551,120.57420509999997],
['臺中市清水區鰲峰路23號', 24.2692551,120.57420509999997],
['臺中市清水區神清路46號', 24.2732139,120.63108199999999],
['臺中市清水區五權路438號', 24.2802586,120.55368369999997],
['臺中市梧棲區中棲路2段18號', 24.2439733,120.55883700000004],
['臺中市清水區護岸路29號', 24.3113334,120.56255420000002],
['臺中市沙鹿區鎮南路1段450號', 24.2159545,120.57122900000002],
['臺中市沙鹿區光華路387號', 24.2442374,120.56777290000002],
['臺中市沙鹿區中清路2之39號', 24.2460592,120.60991890000003],
['臺中市梧棲區中興路210號', 24.25485,120.53378299999997],
['臺中市沙鹿區鎮政路12號', 24.2345799,120.5662691],
['臺中市清水區中山路559號', 24.2930457,120.58822859999998],
['臺中市豐原區葫蘆里中山路225號', 24.2436442,120.71359210000003],
['臺中市豐原區豐洲里豐洲路489號', 24.2619758,120.70356749999996],
['臺中市潭子區得天南街37巷57號', 24.1938474,120.70113650000008],
['臺中市潭子區潭子街3段56號', 24.2147789,120.70668539999997],
['臺中市豐原區育英路52號', 24.2429321,120.71603470000002],
['臺中市大雅區雅潭路150號', 24.2172771,120.66565450000007],
['臺中市豐原區豐東路162號', 24.2485785,120.73052789999997],
['臺中市神岡區中正路516號', 24.2504462,120.70838779999997],
['臺中市豐原區豐勢路2段10號', 24.2606912,120.73646759999997],
['臺中市神岡區神岡路121號', 24.2566067,120.65883450000001],
['臺中市大雅區永興路168號', 24.2232424,120.64866610000001],
['臺中市潭子區中山路2段241巷3號', 24.2099126,120.70473800000002],
['臺中市豐原區東北街1-1號', 24.254863,120.72301100000004],
['臺中市豐原區西安街21號', 24.2491666,120.71387329999993],
['臺中市霧峰區中正路1236號', 24.0745132,120.69987990000004],
['臺中市大里區永大街5號', 24.105118,120.67985199999998],
['臺中市大里區立元路115號', 24.1023709,120.70007439999995],
['臺中市霧峰區民權街37號', 24.0667434,120.70007929999997],
['臺中市霧峰區中正路161號', 24.0262085,120.69663909999997],
['臺中市大里區新興路5號', 24.097994,120.67683799999998],
['臺中市霧峰區中正路1236號', 24.0745132,120.69987990000004],
['臺中市大里區中興路2段598號', 24.1151439,120.68979579999996],
['臺中市大里區成功路9號', 24.0846115,120.69796870000005],
['臺中市大里區仁化路198號', 24.0946021,120.7154951],
['臺中市霧峰區四德路541號', 24.0602312,120.66604000000007],
['臺中市太平區中山路1段215號', 24.1420136,120.73276080000005],
['臺中市太平區中興東路21號', 24.1299227,120.71950779999997],
['臺中市太平區新高里中山路4段2號', 24.1493846,120.71412680000003],
['臺中市太平區光興路900號', 24.1094601,120.73012570000003],
['臺中市太平區長龍路2段11巷2號', 24.1236303,120.75054849999992],
['臺中市太平區中山路1段215號', 24.1420136,120.73276080000005]
];
function setMarkers(map) {
// Adds markers to the map.
// Marker sizes are expressed as a Size of X,Y where the origin of the image
// (0,0) is located in the top left of the image.
// Origins, anchor positions and coordinates of the marker increase in the X
// direction to the right and in the Y direction down.
var image = {
url: 'https://developers.google.com/maps/documentation/javascript/examples/full/images/beachflag.png',
// This marker is 20 pixels wide by 32 pixels high.
size: new google.maps.Size(20, 32),
// The origin for this image is (0, 0).
origin: new google.maps.Point(0, 0),
// The anchor for this image is the base of the flagpole at (0, 32).
anchor: new google.maps.Point(0, 32)
};
// Shapes define the clickable region of the icon. The type defines an HTML
// <area> element 'poly' which traces out a polygon as a series of X,Y points.
// The final coordinate closes the poly by connecting to the first coordinate.
var shape = {
coords: [1, 1, 1, 20, 18, 20, 18, 1],
type: 'poly'
};
for (var i = 0; i < address.length; i++) {
var beach = address[i];
var marker = new google.maps.Marker({
position: {lat: beach[1], lng: beach[2]},
map: map,
icon: image,
shape: shape,
title: beach[0],
zIndex: beach[3]
});
}
}
</script>
<script async defer
src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAAdPzTTL1vTbf4pmtIQHSfM8mdT6TRwqg&callback=initMap">
</script>
</body>
</html>