162 lines
6.2 KiB
HTML
162 lines
6.2 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Document</title>
|
|
<style>
|
|
html,
|
|
body,
|
|
#markercontainer {
|
|
width: 100%;
|
|
height: 100%;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
#markercontainer .BMap_bubble_pop {
|
|
border: 2px solid #2094ff !important;
|
|
overflow: hidden;
|
|
padding: 0 !important;
|
|
}
|
|
#markercontainer .BMap_bubble_top{
|
|
text-align: center;
|
|
font-weight: bold;
|
|
background-color: #2094ff !important;
|
|
}
|
|
#markercontainer .BMap_bubble_title {
|
|
color: #fff !important;
|
|
}
|
|
#markercontainer .BMap_bubble_pop img{
|
|
display: none;
|
|
}
|
|
</style>
|
|
<script>
|
|
// 这里一定要配置ak 否则无法使用
|
|
window.BMAP_AUTHENTIC_KEY = "t6k6UC2IZR40Un8kkqM4RXlaQb4FulyM"
|
|
</script>
|
|
|
|
<script>
|
|
const result = new URLSearchParams(window.location.search)
|
|
const params = {}
|
|
for (const [key, value] of result) {
|
|
params[key] = value
|
|
}
|
|
if(params.NODE_ENV === 'production'){
|
|
document.write('<link rel="stylesheet" type="text/css" href="./script/bmap.pro.css" />')
|
|
document.write('<script type="text/javascript" src="./script/getscript.pro.js?type=webgl&v=1.0&services=&t=20230529114224"><\/script>')
|
|
}else{
|
|
document.write('<link rel="stylesheet" type="text/css" href="./script/bmap.css" />')
|
|
document.write('<script type="text/javascript" src="./script/getscript.js?type=webgl&v=1.0&services=&t=20230529114224"><\/script>')
|
|
}
|
|
</script>
|
|
<!-- <script type="text/javascript" src="./script/getscript.js?type=webgl&v=1.0&services=&t=20230529114224"></script> -->
|
|
|
|
|
|
</head>
|
|
|
|
<body>
|
|
<div id="markercontainer"></div>
|
|
<script>
|
|
window.parent['mapProps']('MAP_LOADING');
|
|
var map = new BMapGL.Map('markercontainer', {
|
|
backgroundColor: [192, 214, 213, 100]
|
|
});
|
|
map.enableScrollWheelZoom(true);
|
|
window.parent['mapProps']('MAP_LOADING_FINISH');
|
|
|
|
// 点击点标记显示客户信息
|
|
function createInfoWindowContent(record) {
|
|
const div = document.createElement('div');
|
|
const { point, title, id, ...otherRecord } = record;
|
|
Object.keys(otherRecord).map(key => {
|
|
let title = '';
|
|
if (key === 'lpName') {
|
|
title = '法人代表'
|
|
} else if (key === 'ziben') {
|
|
title = '注册资本'
|
|
} else if (key === 'custScaleList') {
|
|
title = '企业规模'
|
|
} else if (key === 'isLoan') {
|
|
title = '是否贷款'
|
|
} else if (key === 'custPhone') {
|
|
title = '联系电话'
|
|
} else if (key === 'custTag') {
|
|
title = '产品标签'
|
|
}
|
|
const divIn = document.createElement('div');
|
|
div.style.cssText = 'color: #222; font-size: 12px; font-weight: bold; padding: 0 8px; text-align:left;';
|
|
divIn.innerHTML = title;
|
|
const span = document.createElement('span');
|
|
span.style.cssText = 'color: #666; font-size: 12px; font-weight: normal;margin-left: 10px';
|
|
span.innerHTML = otherRecord[key];
|
|
divIn.appendChild(span);
|
|
div.appendChild(divIn);
|
|
});
|
|
const btn = document.createElement('span');
|
|
btn.style.cssText = 'display: inline-block; margin-left: 70px; cursor: pointer; padding: 0 10px; margin-top: 10px; color: #2094ff; border: 1px solid #2094ff; border-radius: 2px;';
|
|
btn.innerHTML = '客户试图';
|
|
btn.onclick = function() {
|
|
window.parent['mapProps']('JUMP', record);
|
|
}
|
|
div.appendChild(btn);
|
|
return div
|
|
}
|
|
|
|
|
|
function addPolygon(regionMapVO, selectedTab) {
|
|
console.log(window.parant, regionMapVO)
|
|
window.parent['mapProps']('MAP_LOADING');
|
|
map.clearOverlays();
|
|
|
|
// const markerPoints = [
|
|
// {
|
|
// point: [116.404, 39.925],
|
|
// custName: '临海市盛世木价家具厂',
|
|
// lpName: '李爱国',
|
|
// ziben: '500万',
|
|
// custScaleList: '大型企业',
|
|
// isLoan: '否',
|
|
// custPhone: '15888884588',
|
|
// custTag: '存款/中收',
|
|
// id: 132
|
|
// },
|
|
// {
|
|
// point: [116.404, 39.915],
|
|
// custName: '临海市盛世木价家具厂1',
|
|
// lpName: '李爱国1',
|
|
// ziben: '500万1',
|
|
// custScaleList: '大型企业1',
|
|
// isLoan: '否',
|
|
// custPhone: '15888884588',
|
|
// custTag: '存款/中收1',
|
|
// id: 133
|
|
// }
|
|
// ]
|
|
if (regionMapVO.length <= 0) return;
|
|
map.centerAndZoom(new BMapGL.Point(regionMapVO[0].latitude, regionMapVO[0].longitude), 12); // 设置地图中心
|
|
regionMapVO.map(markerInfo => {
|
|
// 创建点标记
|
|
const point = new BMapGL.Point(markerInfo.latitude, markerInfo.longitude);
|
|
const marker = new BMapGL.Marker(point);
|
|
// 在地图上添加点标记
|
|
map.addOverlay(marker);
|
|
const opts = {
|
|
width: 250,
|
|
height: 200,
|
|
title: markerInfo.title
|
|
}
|
|
const infoWindow = new BMapGL.InfoWindow(createInfoWindowContent(markerInfo), opts);
|
|
marker.addEventListener('click', function() {
|
|
map.openInfoWindow(infoWindow, point);
|
|
});
|
|
});
|
|
window.parent['mapProps']('MAP_LOADING_FINISH');
|
|
}
|
|
|
|
|
|
</script>
|
|
</body>
|
|
|
|
</html> |