You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
107 lines
4.0 KiB
107 lines
4.0 KiB
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>Geocoding service</title>
|
|
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
|
|
<script type="text/javascript" src="/static/lib/jquery/jquery-2.1.4.min.js"></script>
|
|
<meta charset="utf-8">
|
|
<style>
|
|
#map {
|
|
height: 100%;
|
|
}
|
|
|
|
html, body {
|
|
height: 100%;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div id="map"></div>
|
|
<!--<script async defer src="http://maps.google.cn/maps/api/js?key=AIzaSyDNx0I5o5U0HWPjpHqB4N-y4_f-GLZq4oQ&callback=initMap"-->
|
|
<!--type="text/javascript"></script>-->
|
|
|
|
<script async defer
|
|
src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDNx0I5o5U0HWPjpHqB4N-y4_f-GLZq4oQ®ion=aus&language=zh-CN&callback=initMap"
|
|
type="text/javascript"></script>
|
|
<script>
|
|
var industryLabel = {
|
|
327: {label: 'A', info: '服饰鞋帽'},
|
|
328: {label: 'B', info: '酒店行业'},
|
|
329: {label: 'C', info: '教育行业'},
|
|
330: {label: 'D', info: '国际物流'},
|
|
331: {label: 'E', info: '其它服务行业'},
|
|
332: {label: 'F', info: '数码电器'},
|
|
333: {label: 'G', info: '母婴'},
|
|
334: {label: 'H', info: '化妆品'},
|
|
335: {label: 'I', info: '食品'},
|
|
336: {label: 'J', info: '综合商城'},
|
|
337: {label: 'K', info: '文具/办公用品'},
|
|
338: {label: 'L', info: '其它货物贸易行业'},
|
|
339: {label: 'M', info: '机票行业'},
|
|
356: {label: 'N', info: '软件服务'},
|
|
357: {label: 'O', info: '旅游票务'},
|
|
358: {label: 'P', info: '国际租车'},
|
|
359: {label: 'Q', info: '医疗服务(出国)'},
|
|
360: {label: 'R', info: '医疗服务(不出国)'},
|
|
361: {label: 'S', info: '留学教育(网络教育)'},
|
|
362: {label: 'T', info: '留学教育(一年及以下)'},
|
|
363: {label: 'U', info: '留学教育(一年以上)'}
|
|
};
|
|
|
|
function initMap(merchant_locations) {
|
|
var map = new google.maps.Map(document.getElementById('map'), {
|
|
zoom: 4,
|
|
center: {lat: -23.73, lng: 133.95}
|
|
});
|
|
if (!merchant_locations) {
|
|
var locationsStr = window.parent.document.getElementById('merchant_locations').innerText;
|
|
if(!locationsStr){
|
|
return;
|
|
}
|
|
merchant_locations = JSON.parse(locationsStr);
|
|
}
|
|
$.each(merchant_locations, function (i, item) {
|
|
var infoWindow = new google.maps.InfoWindow;
|
|
var infowincontent = document.createElement('div');
|
|
var strong = document.createElement('strong');
|
|
strong.textContent = item.short_name + '(' + item.client_moniker + ')';
|
|
infowincontent.appendChild(strong);
|
|
infowincontent.appendChild(document.createElement('br'));
|
|
|
|
var icon = industryLabel[item.industry] || {};
|
|
|
|
var industry_info = document.createElement('p');
|
|
industry_info.textContent = 'Industry: ' + icon.info;
|
|
infowincontent.appendChild(industry_info);
|
|
|
|
var merchant_address = document.createElement('p');
|
|
merchant_address.textContent = 'Address: ' + item.address;
|
|
infowincontent.appendChild(merchant_address);
|
|
|
|
var contact_bd = document.createElement('text');
|
|
contact_bd.setAttribute("style", "color:blue");
|
|
contact_bd.textContent = 'BD:' + item.bd_user_name;
|
|
infowincontent.appendChild(contact_bd);
|
|
|
|
var point = new google.maps.LatLng(
|
|
parseFloat(item.latitude),
|
|
parseFloat(item.longitude)
|
|
);
|
|
|
|
var marker = new google.maps.Marker({
|
|
map: map,
|
|
position: point,
|
|
label: icon.label
|
|
});
|
|
marker.addListener('mouseover', function () {
|
|
infoWindow.close();
|
|
infoWindow.setContent(infowincontent);
|
|
infoWindow.open(map, marker);
|
|
});
|
|
})
|
|
}
|
|
</script>
|
|
</body>
|
|
</html> |