function CompanyLayer(options) { // 信访企业 this.companys = [] // 信访企业地图标记 this.companyMarker = [] this.companyInfoWindow = [] this.isCompanyShow = false this.factor = 'VOC' this.startTime = '00:00:00' this.endTime = '05:59:59' this.deviceCode = '0d0000000001' this.epwResult this.zoomEvent = false this.lastZoom this.zoomLevel = 17 this.searched = false } CompanyLayer.prototype = { init: function () { this.searchBox() }, enable: function () { this.isEnable = true this.uiChange(true) this.zoomEvent = false }, disable: function () { this.isEnable = false MapUtil._map.off('zoomend', this._onZoom) MapUtil.removeViews(this.companyMarker) }, /** * UI显示隐藏变化 */ uiChange: function (isShow) { if (isShow) { $('#epw_model').slideDown("fast") } }, searchBox: function () { var that = this var time = new Date(); var day = ("0" + time.getDate()).slice(-2); var month = ("0" + (time.getMonth() + 1)).slice(-2); var today = time.getFullYear() + "-" + (month) + "-" + (day); $('#epw_date').val(today) $('.epw_radio').on('click', function () { var type = this.value switch (type) { case '0': that.startTime = '00:00:00' that.endTime = '05:59:59' break; case '1': that.startTime = '06:00:00' that.endTime = '08:59:59' break; case '2': that.startTime = '09:00:00' that.endTime = '11:59:59' break; case '3': that.startTime = '12:00:00' that.endTime = '13:59:59' break; case '4': that.startTime = '14:00:00' that.endTime = '16:59:59' break; case '5': that.startTime = '17:00:00' that.endTime = '19:59:59' break; case '6': that.startTime = '20:00:00' that.endTime = '23:59:59' break; default: break; } }) $('.epw_f_radio').on('click', function () { that.factor = this.value if (that.searched) { that.refreshEPW() } }) $('#btn_search_epw').on('click', function () { that.searched = true that.getEPWResult() }) }, /** * 获取当前数据对应的权重分析结果 */ getEPWResult: function (callback) { var date = $('#epw_date').val() var st = date + ' ' + this.startTime var et = date + ' ' + this.endTime DataUtil.toggleLoading() HttpService.getEPWResult(this.deviceCode, st, et, undefined, function (data) { this.epwResult = data if (!this.isCompanyShow) { this.toggleCompany() } else { this.refreshEPW() } }.bind(this)) }, /** * 显示或隐藏信访企业 */ toggleCompany: function () { this.isCompanyShow = !this.isCompanyShow if (!this.isCompanyShow) { MapUtil.removeViews(this.companyMarker) return } this.refreshEPW() }, refreshEPW: function () { var that = this if (this.companys.length == 0) { HttpService.getCompanyInfo(function (data) { this.companys = data var datas = [] var index = 1 var lnglats = [] this.companys.forEach(element => { if (element.ciLongitude != undefined) { datas.push({ id: index, name: element.ciName, }) lnglats.push([element.ciLongitude, element.ciLatitude]) index++ } }); MapUtil.convertFromGPS(lnglats, function (gd) { for (let i = 0; i < datas.length; i++) { const element = datas[i]; var mContent = that.getLabelContent(element.name) if (mContent == undefined) { break } var icon = new AMap.Icon({ size: new AMap.Size(30, 30), imageSize: new AMap.Size(22, 22), image: "./asset/mipmap/company.png", // imageOffset: new AMap.Pixel(-16, -16) // 相对于基点的偏移位置 }) var marker = new AMap.Marker({ position: new AMap.LngLat(gd[i][0], gd[i][1]), // 经纬度对象,也可以是经纬度构成的一维数组[116.39, 39.9] // label: { // content: labelContent, // offset: 0, // direction: "top" // }, title: element.name, content: mContent[0], // icon: icon, animation: "AMAP_ANIMATION_DROP" }); var w = new AMap.InfoWindow({ isCustom: true, //使用自定义窗体 content: that.createInfoWindow(element.name, i), offset: new AMap.Pixel(16, -45) }) this.companyInfoWindow.push(w) //鼠标点击marker弹出自定义的信息窗体 AMap.event.addListener(marker, 'click', function () { that.companyInfoWindow[i].open(MapUtil._map, that.companyMarker[i].getPosition()); }); this.companyMarker.push(marker) } MapUtil.addViews(this.companyMarker) DataUtil.toggleLoading() }.bind(this)) }.bind(this)) } else { for (let i = 0; i < this.companyMarker.length; i++) { var m = this.companyMarker[i] var element = m.getTitle() this.companyInfoWindow[i].setContent(this.createInfoWindow(element, i)) var labelContent = that.getLabelContent(element) if (labelContent == undefined) { return } if (this.lastZoom >= this.zoomLevel) { m.setContent(labelContent[0]) } else { m.setContent(labelContent[1]) } } MapUtil.addViews(this.companyMarker, false) DataUtil.toggleLoading(false) } if (!this.zoomEvent) { MapUtil._map.on('zoomend', this._onZoom) this.zoomEvent = true } }, _onZoom: function () { var zoom = MapUtil._map.getZoom() if (this.lastZoom == undefined || (this.lastZoom >= this.zoomLevel && zoom < this.zoomLevel) || (this.lastZoom < this.zoomLevel && zoom >= this.zoomLevel)) { if (this.companyMarker != undefined) { this.companyMarker.forEach(m => { var element = m.getTitle() var labelContent = this.getLabelContent(element) if (labelContent == undefined) { return } if (zoom >= this.zoomLevel) { m.setContent(labelContent[0]) } else { m.setContent(labelContent[1]) } }); MapUtil.addViews(this.companyMarker, false) } } this.lastZoom = zoom }, getLabelContent: function (company) { // var labelContent0 = `
${company}
` var labelContent0 = '' var labelContent1 = '' var icon = "./asset/mipmap/c_level_no.png" if (this.epwResult != undefined) { for (const key in this.epwResult) { // if (this.epwResult[key][this.factor] === undefined) { // return undefined // } var cName = key.split(';')[0] if (company === cName) { const r = this.epwResult[key] var epw = '/', period = "数据无效" if (r[this.factor] != undefined) { for (const p in r[this.factor]) { period = p epw = r[this.factor][p]['average'] break } } var level = '', color = 'green' if (epw < 15) { level = '低风险' color = 'green' icon = "./asset/mipmap/c_level_0.png" } else if (epw < 20) { level = '中风险' color = 'rgb(187, 108, 4)' icon = "./asset/mipmap/c_level_1.png" } else if (epw >= 20){ level = '高风险' color = 'red' icon = "./asset/mipmap/c_level_2.png" } // labelContent0 += `
${period}: ${epw}
` // labelContent0 += `
${level}
` // labelContent1 += `
${level}
` // labelContent1 += `
${epw} ${Util.factorUnit2[this.factor]}
` break } } } var mContent0 = '
' mContent0 += `` // mContent0 += '
' // mContent0 += labelContent0 // mContent0 += '
' mContent0 += '
' var mContent1 = '
' mContent1 += `` // mContent1 += '
' // mContent1 += labelContent1 // mContent1 += '
' mContent1 += '
' return [mContent0, mContent1] }, /** * 站点标记信息窗体 */ createInfoWindow: function (cName, index) { var that = this var c for (let i = 0; i < this.companys.length; i++) { const e = this.companys[i]; if (e.ciName === cName) { c = e break } } //实例化信息窗体 var title = '
' + c.ciName + '
' + '
经营地址:' + c.ciAddress + '
', content = ''; tag = '' // 遍历站点数据中的每一项监测因子,生成页面 // content += "" if (this.epwResult != undefined) { for (const key in this.epwResult) { // if (this.epwResult[key][this.factor] === undefined) { // return undefined // } var cName = key.split(';')[0] if (c.ciName === cName) { const r = this.epwResult[key] var epw = '/', period = "数据无效" if (r[this.factor] != undefined) { for (const p in r[this.factor]) { period = p epw = r[this.factor][p]['average'] break } } var level = '', color = '#26e23f' if (epw < 15) { level = '低风险' color = '#26e23f' icon = "./asset/mipmap/c_level_0.png" } else if (epw < 20) { level = '中风险' color = '#e6d436' icon = "./asset/mipmap/c_level_1.png" } else if (epw >= 20){ level = '高风险' color = 'red' icon = "./asset/mipmap/c_level_2.png" } content += `
${period}: ${epw} ${Util.factorUnit2[this.factor]}
` content += `
${level}
` // labelContent1 += `
${level}
` // labelContent1 += `
${epw} ${Util.factorUnit2[this.factor]}
` break } } } // content += "
" var info = document.createElement("div"); // info.className = "custom-info input-card content-window-card"; info.className = "flexbox-col"; //可以通过下面的方式修改自定义窗体的宽高 //info.style.width = "400px"; // 定义顶部标题 var top = document.createElement("div"); // top.className = "info-top"; top.className = "ff-content ff-content-top-left ff-content-small-borderless-t info-top"; var top_b = document.createElement("div"); top_b.className = "ff-border-bottom" var top_t = document.createElement("div"); top_t.className = "ff-border-top" var top_c = document.createElement("div"); top_c.className = "ff-border-content flexbox flex-space-between" var titleD = document.createElement("div"); var closeX = document.createElement("i"); titleD.innerHTML = title; closeX.className = "fa fa-times margin-left-8" // $(closeX).attr('aria-hidden', 'true') closeX.onclick = function () { that.closeInfoWindow(index); } top_c.appendChild(titleD); top_c.appendChild(closeX); top_t.appendChild(top_c) top.appendChild(top_b) top.appendChild(top_t) info.appendChild(top); // 定义中部内容 var m_top = document.createElement("div"); m_top.className = "ff-content ff-content-left ff-content-medium"; var m_top_b = document.createElement("div"); m_top_b.className = "ff-border-bottom" var m_top_t = document.createElement("div"); m_top_t.className = "ff-border-top" var m_top_c = document.createElement("div"); m_top_c.className = "ff-border-content" var m_top_f = document.createElement("div"); m_top_f.className = "ff-footer flexbox-col flex-center" var m_top_tr = document.createElement("div"); m_top_tr.className = "ff-triangle" var m_top_trb = document.createElement("div"); m_top_trb.className = "ff-triangle-border" // $(refresh).on('click', site.code, function(event) { // $(this).addClass('loading-pic') // that.fetchingData(event.data, function() { // $(this).removeClass('loading-pic') // }) // }); var middle = document.createElement("div"); // middle.className = "info-middle"; middle.innerHTML = content; m_top_f.innerHTML = tag m_top_c.appendChild(middle); m_top_t.appendChild(m_top_c) m_top_tr.appendChild(m_top_trb) m_top.appendChild(m_top_b) m_top.appendChild(m_top_t) m_top.appendChild(m_top_f) m_top.appendChild(m_top_tr) info.appendChild(m_top); // 定义底部内容 var bottom = document.createElement("div"); bottom.className = "info-bottom"; bottom.style.position = 'relative'; bottom.style.top = '0px'; bottom.style.margin = '0 auto'; var sharp = document.createElement("img"); sharp.src = "https://webapi.amap.com/images/sharp.png"; bottom.appendChild(sharp); info.appendChild(bottom); return info; }, closeInfoWindow: function (index) { this.companyInfoWindow[index].close() }, }