417 lines
14 KiB
Plaintext
417 lines
14 KiB
Plaintext
|
let terrainMap;
|
|||
|
|
|
|||
|
|
// 初始化地图
|
|||
|
|
function initMap(type) {
|
|||
|
|
createMap(type); // 创建地图
|
|||
|
|
madeBoundary(); //加载区域图
|
|||
|
|
addMapControl(); // 添加自定义控件
|
|||
|
|
setMapEvent(); //地图控件设置
|
|||
|
|
$('#allMap').css({ 'zIndex': 999, 'backgroundColor': 'transparent' });
|
|||
|
|
clearOverlay(type)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 初始化地图
|
|||
|
|
function initMap2(type) {
|
|||
|
|
createMap2(type); // 创建地图
|
|||
|
|
madeBoundary(); //加载区域图
|
|||
|
|
addMapControl(); // 添加自定义控件
|
|||
|
|
setMapEvent(); //地图控件设置
|
|||
|
|
$('#allMap').css({ 'zIndex': 999, 'backgroundColor': 'transparent' });
|
|||
|
|
getSignProAjax();
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 设置杆塔连线
|
|||
|
|
function setTowerLine(gtList,proName){
|
|||
|
|
let allOverlayList = terrainMap.getOverlays();
|
|||
|
|
//循坏所有点并清除指定的点
|
|||
|
|
if (allOverlayList.length > 0) {
|
|||
|
|
for (let i = 0; i < allOverlayList.length; i++) {
|
|||
|
|
console.log(allOverlayList[i].toString());
|
|||
|
|
if (allOverlayList[i].toString() == "[object Label]" || allOverlayList[i].toString() == "[object Marker]" || allOverlayList[i].toString() == "[object Polyline]") {
|
|||
|
|
terrainMap.removeOverlay(allOverlayList[i]);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
if(gtList && gtList.length === 0){
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
var points=[];
|
|||
|
|
for(var i = 0; i < gtList.length; i++) {
|
|||
|
|
var point=new Object();
|
|||
|
|
point.lng=gtList[i].lon;
|
|||
|
|
point.lat=gtList[i].lat;
|
|||
|
|
point.proName=proName;
|
|||
|
|
point.img = '../../img/map/bdz.png';
|
|||
|
|
point.place=gtList[i].towerName;
|
|||
|
|
points.push(point);
|
|||
|
|
}
|
|||
|
|
console.log(points)
|
|||
|
|
for(var i=0, len = points.length; i<len; i++) {
|
|||
|
|
//自定义图标
|
|||
|
|
var pointIcon = new BMap.Icon(points[i].img,new BMap.Size(27,27));
|
|||
|
|
//将标注点转化为地图上的点
|
|||
|
|
var point = new BMap.Point(points[i].lat, points[i].lng);
|
|||
|
|
var infoWindow = new BMap.InfoWindow( points[i].place);
|
|||
|
|
//将点转化为标注点
|
|||
|
|
var marker = new BMap.Marker(point,{icon:pointIcon});
|
|||
|
|
//添加点图层
|
|||
|
|
terrainMap.addOverlay(marker);
|
|||
|
|
(function() {
|
|||
|
|
let title= '<p class="map-p">工程名称：' + points[i].proName+ '</p>' +
|
|||
|
|
'<p class="map-p">杆塔名称：' + points[i].place + '</p>' +
|
|||
|
|
'<p class="map-p">经度：' +points[i].lat + '</p>' +
|
|||
|
|
'<p class="map-p">维度：' + points[i].lng+ '</p>';
|
|||
|
|
|
|||
|
|
//创建label图层 points[i].place
|
|||
|
|
var label = new BMap.Label(title,{position:point});
|
|||
|
|
marker.addEventListener("mouseover",function() {
|
|||
|
|
terrainMap.addOverlay(label);
|
|||
|
|
});
|
|||
|
|
marker.addEventListener("mouseout",function() {
|
|||
|
|
terrainMap.removeOverlay(label);
|
|||
|
|
});
|
|||
|
|
})();
|
|||
|
|
}
|
|||
|
|
//将所有点连线，连线图层polyline
|
|||
|
|
var line = [];
|
|||
|
|
for(var i=0; i<points.length; i++){
|
|||
|
|
console.log(points[i].lng, points[i].lat)
|
|||
|
|
line.push(new BMap.Point(points[i].lat, points[i].lng));
|
|||
|
|
}
|
|||
|
|
line.push(new BMap.Point(points[0].lat, points[0].lng));
|
|||
|
|
console.log(line,'line')
|
|||
|
|
console.log(line)
|
|||
|
|
var polyline = new BMap.Polyline(line,{strokeColor:'#00aa00',strokeWeight:2,strokeOpacity:1});
|
|||
|
|
terrainMap.addOverlay(polyline);
|
|||
|
|
terrainMap.centerAndZoom(line[0],9); //设置中心点和缩放层级
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function getTitle(points) {
|
|||
|
|
console.log(points);
|
|||
|
|
return
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
//地图设置start
|
|||
|
|
function setMapEvent() {
|
|||
|
|
terrainMap.enableScrollWheelZoom();
|
|||
|
|
terrainMap.enableKeyboard();
|
|||
|
|
terrainMap.enableDragging();
|
|||
|
|
terrainMap.enableDoubleClickZoom();
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//地图设置end
|
|||
|
|
|
|||
|
|
// 创建地图
|
|||
|
|
function createMap() {
|
|||
|
|
terrainMap = new BMap.Map("allMap", {
|
|||
|
|
mapType: BMAP_HYBRID_MAP
|
|||
|
|
}); // 创建Map实例
|
|||
|
|
terrainMap.centerAndZoom('合肥', 8); // 初始化地图,设置中心点坐标和地图级别
|
|||
|
|
//添加地图类型控件
|
|||
|
|
// terrainMap.addControl(new BMap.MapTypeControl({
|
|||
|
|
// mapTypes: [
|
|||
|
|
// BMAP_NORMAL_MAP,
|
|||
|
|
// BMAP_HYBRID_MAP
|
|||
|
|
// ]
|
|||
|
|
// }));
|
|||
|
|
terrainMap.setCurrentCity("合肥"); // 设置地图显示的城市 此项是必须设置的
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
// 创建地图
|
|||
|
|
function createMap2() {
|
|||
|
|
terrainMap = new BMap.Map("allMap", {
|
|||
|
|
// mapType: BMAP_HYBRID_MAP
|
|||
|
|
}); // 创建Map实例
|
|||
|
|
terrainMap.centerAndZoom('合肥', 8); // 初始化地图,设置中心点坐标和地图级别
|
|||
|
|
//添加地图类型控件
|
|||
|
|
// terrainMap.addControl(new BMap.MapTypeControl({
|
|||
|
|
// mapTypes: [
|
|||
|
|
// BMAP_NORMAL_MAP,
|
|||
|
|
// BMAP_HYBRID_MAP
|
|||
|
|
// ]
|
|||
|
|
// }));
|
|||
|
|
// terrainMap.setCurrentCity("合肥"); // 设置地图显示的城市 此项是必须设置的
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
//设置区域图 start
|
|||
|
|
function madeBoundary() {
|
|||
|
|
let datas = new Array("安徽省-");
|
|||
|
|
var bdary = new BMap.Boundary();
|
|||
|
|
for (var i = 0; i < datas.length; i++) {
|
|||
|
|
getBoundary(datas[i], bdary);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function getBoundary(data, bdary) {
|
|||
|
|
data = data.split("-");
|
|||
|
|
bdary.get(data[0], function (rs) { //获取行政区域
|
|||
|
|
var count = rs.boundaries.length; //行政区域的点有多少个
|
|||
|
|
var pointArray = [];
|
|||
|
|
for (var i = 0; i < count; i++) {
|
|||
|
|
var ply = new BMap.Polygon(rs.boundaries[i], {
|
|||
|
|
strokeWeight: 3,
|
|||
|
|
strokeColor: "#1066FC",
|
|||
|
|
fillOpacity: 1,
|
|||
|
|
fillColor: data[1]
|
|||
|
|
}); //建立多边形覆盖物
|
|||
|
|
terrainMap.addOverlay(ply); //添加覆盖物
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 设置区域图end
|
|||
|
|
//向地图添加控件start
|
|||
|
|
function addMapControl() {
|
|||
|
|
var mystyleJson = [{
|
|||
|
|
"featureType": "road",
|
|||
|
|
"elementType": "all",
|
|||
|
|
"stylers": {
|
|||
|
|
"lightness": 20
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
"featureType": "railway",
|
|||
|
|
"elementType": "all",
|
|||
|
|
"stylers": {
|
|||
|
|
"visibility": "off"
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
"featureType": "local",
|
|||
|
|
"elementType": "labels",
|
|||
|
|
"stylers": {
|
|||
|
|
"visibility": "off"
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
"featureType": "water",
|
|||
|
|
"elementType": "all",
|
|||
|
|
"stylers": {
|
|||
|
|
"color": "#d1e5ff"
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
"featureType": "highway",
|
|||
|
|
"elementType": "labels",
|
|||
|
|
"stylers": {}
|
|||
|
|
}
|
|||
|
|
];
|
|||
|
|
terrainMap.setMapStyle({
|
|||
|
|
styleJson: mystyleJson
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//向地图添加控件end
|
|||
|
|
|
|||
|
|
//创建地图覆盖物start
|
|||
|
|
function createMarker(obj) { //创建地图覆盖物
|
|||
|
|
var cent = "";
|
|||
|
|
var pt = new BMap.Point(obj.lon, obj.lat);
|
|||
|
|
var myIcon = getIcon(obj);
|
|||
|
|
var marker = new BMap.Marker(pt, {
|
|||
|
|
icon: myIcon
|
|||
|
|
});
|
|||
|
|
addClickHandler(marker, obj);
|
|||
|
|
return marker;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//设置风险图标
|
|||
|
|
function getIcon(data) {
|
|||
|
|
let url = "";
|
|||
|
|
let warnNum = Number(data.num) + 1;
|
|||
|
|
if (data.riskType === '2') {
|
|||
|
|
url = getImgUrl(2, warnNum, data.proName);
|
|||
|
|
} else if (data.riskType === '3') {
|
|||
|
|
url = getImgUrl(3, warnNum, data.proName);
|
|||
|
|
} else if (data.riskType === '4') {
|
|||
|
|
url = getImgUrl(4, warnNum, data.proName);
|
|||
|
|
} else if (data.riskType === '5') {
|
|||
|
|
url = getImgUrl(5, warnNum, data.proName);
|
|||
|
|
}
|
|||
|
|
var myIcon = new BMap.Icon(url, new BMap.Size(33, 33), { //图片大小
|
|||
|
|
anchor: new BMap.Size(10, 25), //标注相对point的偏移位置
|
|||
|
|
});
|
|||
|
|
myIcon.setImageSize(new BMap.Size(22, 22)) //重点重点，设置图片大小
|
|||
|
|
// return icon = new BMap.Icon(url, new BMap.Size(33, 33));
|
|||
|
|
// icon.setImageSize(new BMap.Size(10,12)) //重点重点，设置图片大小
|
|||
|
|
return myIcon;
|
|||
|
|
}
|
|||
|
|
function getImgUrl(type, num, proName) {
|
|||
|
|
if (proName.indexOf('变电站') != -1 && proName.indexOf('线路') == -1) {
|
|||
|
|
if (type == 2) {
|
|||
|
|
return '../../img/map/bdz2.png';
|
|||
|
|
} else if (type == 3) {
|
|||
|
|
return '../../img/map/bdz3.png';
|
|||
|
|
} else if (type == 4) {
|
|||
|
|
return '../../img/map/bdz4.png';
|
|||
|
|
} else if (type == 5) {
|
|||
|
|
return '../../img/map/bdz5.png';
|
|||
|
|
}
|
|||
|
|
} else {
|
|||
|
|
if (type == 2) {
|
|||
|
|
return '../../img/map/two-risk' + num + '.png';
|
|||
|
|
} else if (type == 3) {
|
|||
|
|
return '../../img/map/three-risk' + num + '.png';
|
|||
|
|
} else if (type == 4) {
|
|||
|
|
return '../../img/map/four-risk' + num + '.png';
|
|||
|
|
} else if (type == 5) {
|
|||
|
|
return '../../img/map/five-risk' + num + '.png';
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
/* 设置天气图标 */
|
|||
|
|
function getWeatherIcon(data) {
|
|||
|
|
let url = "";
|
|||
|
|
if (data.indexOf("晴") !== -1) {
|
|||
|
|
url = '../../img/compreDisplay/weather/fine.png';
|
|||
|
|
} else if (data.indexOf("多云") !== -1) {
|
|||
|
|
url = '../../img/compreDisplay/weather/partlyCloudy.png';
|
|||
|
|
} else if (data.indexOf("阴") !== -1) {
|
|||
|
|
url = '../../img/compreDisplay/weather/shade.png';
|
|||
|
|
} else if (data.indexOf("小雨") !== -1) {
|
|||
|
|
url = '../../img/compreDisplay/weather/lightRain.png';
|
|||
|
|
} else if (data.indexOf("中雨") !== -1) {
|
|||
|
|
url = '../../img/compreDisplay/weather/moderateRain.png';
|
|||
|
|
} else if (data.indexOf("大雨") !== -1) {
|
|||
|
|
url = '../../img/compreDisplay/weather/heavyRain.png';
|
|||
|
|
} else if (data.indexOf("雷阵雨") !== -1) {
|
|||
|
|
url = '../../img/compreDisplay/weather/thunderstorm.png';
|
|||
|
|
} else if (data.indexOf("小雪") !== -1) {
|
|||
|
|
url = '../../img/compreDisplay/weather/snow.png';
|
|||
|
|
} else if (data.indexOf("中雪") !== -1) {
|
|||
|
|
url = '../../img/compreDisplay/weather/moderateRain.png';
|
|||
|
|
} else if (data.indexOf("大雪") !== -1) {
|
|||
|
|
url = '../../img/compreDisplay/weather/heavySnow.png';
|
|||
|
|
} else if (data.indexOf("大风") !== -1) {
|
|||
|
|
url = '../../img/compreDisplay/weather/gale.png';
|
|||
|
|
} else if (data.indexOf("雨夹雪") !== -1) {
|
|||
|
|
url = '../../img/compreDisplay/weather/sleet.png';
|
|||
|
|
} else if (data.indexOf("雾") !== -1) {
|
|||
|
|
url = '../../img/compreDisplay/weather/fog.png';
|
|||
|
|
} else if (data.indexOf("雾霾") !== -1) {
|
|||
|
|
url = '../../img/compreDisplay/weather/smog.png';
|
|||
|
|
} else if (data.indexOf("浮尘") !== -1) {
|
|||
|
|
url = '../../img/compreDisplay/weather/sinkFloat.png';
|
|||
|
|
} else if (data.indexOf("沙尘暴") !== -1) {
|
|||
|
|
url = '../../img/compreDisplay/weather/sandstorm.png';
|
|||
|
|
}
|
|||
|
|
return url;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//覆盖物事件start
|
|||
|
|
function addClickHandler(marker, obj) {
|
|||
|
|
let steelContent = '<div><p class="terrain-map-p">' + obj.proName + '</p>' +
|
|||
|
|
'<p class="terrain-map-p">风险等级：' + setRiskLevelColor(obj.riskType) + '</p>' +
|
|||
|
|
'<p class="terrain-map-p" title="' + obj.workContent + '">作业内容：' + sliceStr(obj.workContent) + '</p>' +
|
|||
|
|
'<p class="terrain-map-p">班组长：' + dealEmptyString(obj.workManage) + ' ' + dealEmptyString(obj.workManagePhone) + '</p>' +
|
|||
|
|
'<p class="terrain-map-p">预警数量：' + obj.num + '</p></div>' +
|
|||
|
|
'<p class="terrain-map-p">球机：' + isOnline(obj.ballStatus) + '</p></div>';
|
|||
|
|
let steelOpts = {
|
|||
|
|
width: 300, //信息窗口宽度
|
|||
|
|
height: 180, //信息窗口高度
|
|||
|
|
enableMessage: false //设置允许信息窗发送短息
|
|||
|
|
};
|
|||
|
|
marker.addEventListener("mouseover", function (e) {
|
|||
|
|
this.openInfoWindow(new BMap.InfoWindow(steelContent, steelOpts));
|
|||
|
|
});
|
|||
|
|
/* marker.addEventListener("mouseout", function () {
|
|||
|
|
this.closeInfoWindow();
|
|||
|
|
}
|
|||
|
|
);*/
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*清除地形图覆盖物 */
|
|||
|
|
function clearOverlay(type) {
|
|||
|
|
let allOverlayList = terrainMap.getOverlays();
|
|||
|
|
//循坏所有点并清除指定的点
|
|||
|
|
if (allOverlayList.length > 0) {
|
|||
|
|
for (let i = 0; i < allOverlayList.length; i++) {
|
|||
|
|
if (allOverlayList[i].toString() == "[object Label]" || allOverlayList[i].toString() == "[object Marker]") {
|
|||
|
|
terrainMap.removeOverlay(allOverlayList[i]);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
if (type === 1) {
|
|||
|
|
// 添加点覆盖物
|
|||
|
|
for (let i = 0; i < mapPointList.length; i++) {
|
|||
|
|
terrainMap.addOverlay(createMarker(mapPointList[i]));
|
|||
|
|
}
|
|||
|
|
} else if (type === 2) {
|
|||
|
|
$.each(showWeatherList, function (index, item) {
|
|||
|
|
let point = new BMap.Point(item.lon, item.lat);
|
|||
|
|
let content = "<div class='labelStyle layout'>" +
|
|||
|
|
"<div class='temp layout'><p>" + item.cictyName + "</p><p>" + item.currentTemp + "</p><img src=" + getWeatherIcon(item.weatherStatus) + "></div>" +
|
|||
|
|
"<div class='temp layout'><p>" + item.weatherDes + "</p></div>" +
|
|||
|
|
"</div>";
|
|||
|
|
let label = new BMap.Label(content, { // 创建文本标注
|
|||
|
|
position: point,
|
|||
|
|
offset: new BMap.Size(-60, -40)
|
|||
|
|
})
|
|||
|
|
terrainMap.addOverlay(label);
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 单项工程
|
|||
|
|
function getSignProAjax() {
|
|||
|
|
let url = dataUrl + 'proteam/pot/bidTowerMain/getSingleProList';
|
|||
|
|
let params = {};
|
|||
|
|
ajaxRequest(url, "POST", params, true, function () {
|
|||
|
|
}, function (result) {
|
|||
|
|
console.log(result);
|
|||
|
|
if (parseInt(result.code) == 200) {
|
|||
|
|
setData(result.data);
|
|||
|
|
} else if (parseInt(result.code) === 500) {
|
|||
|
|
layer.alert('服务异常', { icon: 2 })
|
|||
|
|
} else if (parseInt(result.code) === 401) {
|
|||
|
|
logout(1);
|
|||
|
|
}
|
|||
|
|
}, function (xhr) {
|
|||
|
|
|
|||
|
|
});
|
|||
|
|
function setData(bidCodeList){
|
|||
|
|
let html = '';
|
|||
|
|
if (bidCodeList && bidCodeList.length > 0) {
|
|||
|
|
$.each(bidCodeList, function (index, item) {
|
|||
|
|
if(index === 0){
|
|||
|
|
html += '<option value="' + (item.proNo + "@" + item.proName) + '" checked>' + (item.proName + '（'+item.num+'）') + '</option>'
|
|||
|
|
getSignProTowerAjax(item.proNo,item.proName);
|
|||
|
|
}else{
|
|||
|
|
html += '<option value="' + (item.proNo + "@" + item.proName) + '">' + (item.proName + '（'+item.num+'）') + '</option>'
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
$('#bidPro').empty().append(html);
|
|||
|
|
layui.form.render();
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 单项工程->杆塔
|
|||
|
|
function getSignProTowerAjax(proNo,proName) {
|
|||
|
|
let url = dataUrl + 'proteam/pot/bidTowerMain/getSignProTowerById';
|
|||
|
|
let params = {'proNo':proNo};
|
|||
|
|
ajaxRequest(url, "POST", params, true, function () {
|
|||
|
|
}, function (result) {
|
|||
|
|
console.log(result);
|
|||
|
|
if (parseInt(result.code) == 200) {
|
|||
|
|
setData(result.data,proName);
|
|||
|
|
} else if (parseInt(result.code) === 500) {
|
|||
|
|
layer.alert('服务异常', { icon: 2 })
|
|||
|
|
} else if (parseInt(result.code) === 401) {
|
|||
|
|
logout(1);
|
|||
|
|
}
|
|||
|
|
}, function (xhr) {
|
|||
|
|
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
function setData(data,proName){
|
|||
|
|
setTimeout(() => {
|
|||
|
|
setTowerLine(data,proName);
|
|||
|
|
}, 2000);
|
|||
|
|
}
|
|||
|
|
}
|