-
Notifications
You must be signed in to change notification settings - Fork 18
/
marker_map.ejs
95 lines (70 loc) · 2.42 KB
/
marker_map.ejs
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
<script src="https://npm.webcache.cn/@babel/polyfill/dist/polyfill.min.js"></script>
<script src="https://polyfill.io/v3/polyfill.min.js?features=Promise%2CIntersectionObserver"></script>
<script src="https://npm.webcache.cn/dom-renderer"></script>
<script src="https://npm.webcache.cn/web-cell@1.2.3"></script>
<script src="//webapi.amap.com/maps?v=1.4.15&key=<%= config.amap.key %>&plugin=AMap.Geocoder,AMap.AdvancedInfoWindow"></script>
<template><%= JSON.stringify( markers ) %></template>
<template>
<div style="padding: 0.5rem 0.5rem 0 0.5rem">
<h4>
<a href="${view.URL}">${view.title}</a>
</h4>
<p>${view.address}</p>
</div>
</template>
<div class="embed-box"></div>
<script>
(function (main) {
var box = document.currentScript.previousElementSibling;
self.addEventListener('load', function () {
new IntersectionObserver(function (entry, observer) {
observer.disconnect();
main(
self['dom-renderer'].default,
self['web-cell'].unique,
box,
box.previousElementSibling,
box.previousElementSibling.previousElementSibling
);
}).observe( box );
});
})(function (View, unique, box, template, list) {
list = unique(JSON.parse( list.innerHTML.trim() ), function (A, B) {
return A.address !== B.address;
});
var map = new AMap.Map(box, {resizeEnable: true}),
coder = new AMap.Geocoder(),
dialog = new AMap.AdvancedInfoWindow({
offset: new AMap.Pixel(0, -30),
showShadow: true,
closeWhenClickMap: true
}),
template = new View( template.innerHTML );
function getCoords(addresses) {
return new Promise(function (resolve, reject) {
coder.getLocation(addresses, function (status, result) {
if (status === 'error')
reject( result );
else if (status === 'complete')
resolve( result );
});
});
}
getCoords(
list.map(function (item) { return item.address; })
).then(function (data) {
if (! data.geocodes[0]) return;
var markers = data.geocodes.map(function (item, index) {
var marker = new AMap.Marker({position: item.location});
marker.on('click', function () {
template.render( list[index] ).then(function () {
dialog.setContent(template + '');
dialog.open(map, item.location);
});
});
return marker;
});
map.add( markers ), map.setFitView( markers );
});
});
</script>