import axios from "axios"; import data from "@c/mixins/anbao"; export default { data() { return { stores: this.$useStore(), map: null, oldPopup: null, oldPopupId: null, }; }, mounted() { window.vue = this; window.jMap = null; window.jmapQuery = null; }, methods: { streetTownMap(name) { return name }, /** *地图初始化 * */ async initMap() { window.vue = this; window.jMap = null; window.jmapQuery = null; window.jMap = new JMap(); var map_params = { camera: { x: 121.4175597, y: 31.119248, radius: 18000.0, offset: { heading: -4, pitch: -70, range: 0 }, }, map_complete_callback: () => { window.jmapQuery = new JMapQuery(window.jMap); // ToDo... }, map_left_click_callback: (obj, type, movement, event) => { console.log(movement.position) this.stores.$state.tankuangXY = { x: movement.position.x, y: movement.position.y }; // this.$store.commit("tankuangXY", { x: movement.position.x, y: movement.position.y }); }, map_right_click_callback: (obj) => {}, }; let res = await this.$axios.get(this.$api.dt); // 加载地图 window.jMap.createMap("mapF", res.data, window.location.origin, map_params, {}); // 地图背景样式 window.jMap.switchBaseLayer("blue"); /** * 获取街镇信息 */ var options = { click: addLayerCallBack, isZoom: false, style: { outline: true, outlineColor: "rgb(255,0,0,0.8)", material: "rgb(154,255,154,0)", perPositionHeight: false, height: 5, width: 5, label: { show: true, text: "name", font: "16px Helvetica", fillColor: "rgb(0,255,0,0.9)", pixelOffset: [0, -40], backgroundColor: "rgb(0,0,0,0)", showBackground: false, }, }, // where:"name = '莘庄镇'" }; window.jMap.addLayer("mh_dyn_district", [1], options); var _this = this; function addLayerCallBack(obj) { // _this.streetTownMap(obj._name) _this.stores.streetTownSet(obj._name) } // 街镇标题 var qp = new JMapQueryParam({ queryMapService: "mh_dyn_district", queryMapLayers: [1], outFields: ["code", "name", "center_x", "center_y"], queryWhere: "name like '%莘庄镇%' ", callBack: (res) => { res.features.forEach(async(val) => { await window.jMap.FlagInfo.show({ id: val.attributes.code, position: { x: Number(val.attributes.center_x), y: Number(val.attributes.center_y), z: 0 }, element: `
${val.attributes.name} ${val.attributes.code}
`, }, { isZoom: false }); }); }, }); // new JMapQuery(window.jMap).execQuery(qp) //window.jMap.bindBuildingClick(callbackFunction) // 点击三维建筑模型触发的回调函数 }, /** *添加动态图层 * */ addLayer() { var wheres = []; wheres[1] = "subdistrict='七宝镇'"; // 1:图层序号 subdistrict='七宝镇' 筛选条件 var options = { click: windowGxLayer, wheres: wheres }; setTimeout(() => { jMap.addImageryLayer("mh_dyn_cywg", [1], options); }, 3000); }, // 点击事件回调函数 addLayerCallBack(obj) { }, /** *安保区域划分 * */ anbaoMap() { let target = { id: '100001', attributes: { name: '大型安保范围', }, position: data[0], label: { text: "大型安保范围", font: "16px Helvetica", color: "rgba(255,255,255,0.1)", pixelOffset: [0, -50], backgroundColor: "red" } } var options = { isZoom: true, style: { color: 'rgb(255,255,0,0.9)', transparency: 1, outline: true, outlineColor: 'transparent', perPositionHeight: true }, // click: regionLocateCallBack }; setTimeout(() => { window.jMap.Locate.trackLocate(target, options); }, 1000) }, // 安保分布点点击事件的回调函数 regionLocateCallBack(obj) { console.log(obj); // obj为返回值 }, /** * @聚合撒点 * @param {数据list} data * @param {页面类型} pageType * @param {类型} type */ initMarkers(data, pageType, type) { var _this = this; var tag = 1; //1.自定义图标 2.完全自定义 3.默认 var style = ""; //地图最大化小图标 var points = []; //地图撒点处理数据存储 var options = { style: { pixelRange: 10 }, isZoom: true, click: clusterMapCallBack, }; jMap.ClusterMap.show(data, options); }, clickFlag(val) { console.log(val); }, randomColor() { var color = "#"; //for循环中,如果后面仅有一条语句,{}可省略不写 //随机生成6位0-15之间的数字,再用toString(16)将数字转成16进制 for (var i = 0; i < 6; i++) color += parseInt(Math.random() * 16).toString(16); return color; }, removeMarkers(lnglats) { this.map.remove(lnglats); }, /** *街镇切换 */ streetTownSwitch(data) { // console.log(data); let sf = 2800.0; if (data.id == 12) { //区缩放比例调整 sf = 18000.0; } var options = { area: data.id, base_layer_name: "dark", model_data_name: "dark", isShowDistrictLabel: true, camera: { x: data.x, y: data.y, radius: sf, offset: { heading: 4, pitch: -89, range: 0 }, }, }; jMap.switchStreet(options); }, /** * 点分布(撒点) * @param {坐标信息} lnglats * @param {页面类型} type */ addMarker(lnglats, pageType, type) { window.jMap.Locate.clearLocate(); let icon = ""; let arr = [] let arr1 = [] let arr2 = [] let arr3 = [] let arr4 = [] let arr5 = [] var target = lnglats.map((val, ind) => { var wgs84 = CoordUtil.gcj02towgs84(Number(val.gisX) || Number(val.longitude), Number(val.gisY) || Number(val.latitude)) var x = wgs84[0] var y = wgs84[1] if (pageType == "enforcement-dynamic" || pageType == "self-management" || pageType == "comprehensive-disposal" || pageType == "rescue-station" || pageType == "security-plan" || pageType == "fire-signs" || pageType == "fire-data-analysis" || pageType == "water-sources") { let marker = { id: ind + 1, attrbutes: val, position: { x: x, y: y, // x: Number(val.gisX) || Number(val.longitude), // y: Number(val.gisY) || Number(val.latitude), z: 0 }, image: { url: type == "双随机执法单位" ? this.stores.sadianIcon.ssjzf : type == "安全检查单位" ? this.stores.sadianIcon.aqjcdw : type == "举报投诉" ? this.stores.sadianIcon.jbts : type == "执法记录仪" ? this.stores.sadianIcon.zfjly : type == "重点单位" ? this.stores.sadianIcon.zddw : type == "龙湖天街(试点)" ? this.stores.sadianIcon.lhtj : type == "一般单位" ? this.stores.sadianIcon.ybdw : type == "九小场所" ? this.stores.sadianIcon.jxcs : type == "其他单位" ? this.stores.sadianIcon.qtdw : type == "厂房" ? this.stores.sadianIcon.cf : type == "仓库" ? this.stores.sadianIcon.ck : type == "车辆" && val.type != "国家会展中心" ? this.stores.sadianIcon.xfc : type == "历史警情" && val.type != "国家会展中心" ? this.stores.sadianIcon.lsjq : type == "历史火灾" && val.type != "国家会展中心" ? this.stores.sadianIcon.lshz : val.type == "国家会展中心" ? this.stores.sadianIcon.hzzx : type == "亡人火灾" ? this.stores.sadianIcon.wrhz : type == "伤人火灾" ? this.stores.sadianIcon.srhz : type == "消火栓可用" ? this.stores.sadianIcon.xhs : type == "消火栓不可用" ? this.stores.sadianIcon.xhsH : type == "天然水源" ? this.stores.sadianIcon.trsy : type == "科普教育基地" ? this.stores.sadianIcon.kpjyjd : type == "消防站" ? this.stores.sadianIcon.xfz : type == "高层建筑覆盖" && val.stationType == 1 ? this.stores.sadianIcon.xfdjl : type == "高层建筑覆盖" && val.stationType == 2 ? this.stores.sadianIcon.xfdj2 : type == "高层建筑覆盖" && val.stationType == 3 ? this.stores.sadianIcon.xfdj3 : type == "高层建筑覆盖" && val.stationType == 4 ? this.stores.sadianIcon.zzd : type == "高层建筑覆盖" && val.stationType == 5 ? this.stores.sadianIcon.jzwxxfz : type == "高层建筑覆盖" && val.stationType == 111 ? this.stores.sadianIcon.dian : type == "高层建筑" ? this.stores.sadianIcon.gcggjz : type == "专职队" ? this.stores.sadianIcon.zzd : type == "微型消防站" ? this.stores.sadianIcon.jzwxxfz : type == "大型综合体" && val.facilityType == "lhtj" ? this.stores.sadianIcon.lhtj : type == "大型综合体" && (val.facilityType == 2 || val.facilityType == 3) ? this.stores.sadianIcon.dxzht : type == "重大火灾隐患" ? this.stores.sadianIcon.lsjq : type == "企业消防" && val.facilityType == 13 ? this.stores.sadianIcon.zddw : type == "企业消防" && val.facilityType == 14 ? this.stores.sadianIcon.ybdw : type == "社区消防" && val.facilityType == 15 ? this.stores.sadianIcon.zddw : type == "社区消防" && val.facilityType == 16 ? this.stores.sadianIcon.ybdw : type == "一级微型消防站" ? this.stores.sadianIcon.yjxfz : type == "街镇专职消防队" ? this.stores.sadianIcon.jzzzxfd : type == "中小学" ? this.stores.sadianIcon.zs : type == "幼儿园" ? this.stores.sadianIcon.yey : type == "其他学校" ? this.stores.sadianIcon.qtxx : type == "三合一" ? this.stores.sadianIcon.shy : type == "实时警情" ? this.stores.sadianIcon.ssjq : type == "本年度重点事项推进情况" && val.status == 1 ? this.stores.sadianIcon.ywc : type == "本年度重点事项推进情况" && val.status == 2 ? this.stores.sadianIcon.jxz : type == "本年度重点事项推进情况" && val.status == 3 ? this.stores.sadianIcon.zbz : type == "高风险" ? this.stores.sadianIcon.gfx : type == "较高风险" ? this.stores.sadianIcon.jgfx : type == "一般风险" ? this.stores.sadianIcon.ybfx : type == "低风险" ? this.stores.sadianIcon.dfx : this.stores.sadianIcon.trsy, // this.jqzhczIcon3 : val.type == "4" ? // this.jqzhczIcon4 : val.type == "5" ? // this.jqzhczIcon5 : val.type == "消火栓" && val.status == "1" ? // this.jqzhczIcon5 : val.type == "消火栓" && val.status == "2" ? // this.jqzhczIcon51 : val.type == "天然水源" ? // this.jqzhczIcon7 : this.xfzfdtIcon4, width: val.type == "国家会展中心" ? 83 : type == "高层建筑覆盖" && val.stationType == 111 ? 7 : type == 111 ? 74 : 19.5, height: val.type == "国家会展中心" ? 59 : type == "高层建筑覆盖" && val.stationType == 111 ? 7 : type == 111 ? 66 : 25, }, }; if (type == "高层建筑覆盖" && val.stationType == 1) { arr1.push(val) } if (type == "高层建筑覆盖" && val.stationType == 2) { arr2.push(val) } if (type == "高层建筑覆盖" && val.stationType == 3) { arr3.push(val) } if (type == "高层建筑覆盖" && val.stationType == 4) { arr4.push(val) } if (type == "高层建筑覆盖" && val.stationType == 5) { arr5.push(val) } return marker; } else { let marker = { id: ind + 1, attrbutes: val, position: { x: val.gisBaiDuX, y: val.gisBaiDuY, z: 0 }, image: { url: icon, width: 300, height: 300 }, }; return marker; } }); if (type == "高层建筑覆盖") { if (arr1.length > 0) { this.bufferL1(arr1) } if (arr2.length > 0) { this.bufferL2(arr2) } if (arr3.length > 0) { this.bufferL3(arr3) } if (arr4.length > 0) { this.bufferL4(arr4) } if (arr5.length > 0) { this.bufferL5(arr5) } // this.bufferL(arr) } //消防水源 if (pageType == "water-sources") { var array = { clusterId: 100001, clusterData: [] } var target1 = lnglats.map((val, ind) => { var wgs84 = CoordUtil.gcj02towgs84(Number(val.gisX) || Number(val.longitude), Number(val.gisY) || Number(val.latitude)) var x = wgs84[0] var y = wgs84[1] val.type2 = type var array1 = { attributes: val, position: { x: x, y: y, z: 0, }, image: { url: type == "消火栓可用" ? this.stores.sadianIcon.xhs : type == "消火栓不可用" ? this.stores.sadianIcon.xhsH : type == "天然水源" ? this.stores.sadianIcon.trsy : this.stores.sadianIcon.trsy, width: 19.5, height: 25, } } array.clusterData.push(array1) }) var options = { style: { pixelRange: 60 }, isZoom: true, click: this.clusterMapCallBack }; window.jMap.ClusterMap.show(array, options) } else { //撒点类型 window.jMap.Locate.pointLocate(target, { //撒点 isZoom: false, //animate: { "show": true }, scaleByDistance: { minScaling: 1, maxScaling: 1, minDistance: 50, //最小距离 maxDistance: 120000 //最大距离 }, click: (val) => { //消防执法 if (pageType == "enforcement-dynamic") { if (type == "安全检查单位" || type == "双随机执法单位") { this.$axios .get( this.$api.siaeall.one + "?" + this.$qs.stringify({ companyId: val.attrbutes.number, companyName: val.attrbutes.name, }) ) .then((res) => { res.data[0].company = val._attrbutes.name; res.data[0].streetTown = val._attrbutes.streetTown; let arrayList = [{ title: [res.data[0].company, res.data[0].company ? true : false], children: [ ["单位地址:", res.data[0].companyAddress, 24], ["负责人:", res.data[0].linkPerson, 10], ["联系电话:", res.data[0].linkPhone, 14], ["历史火灾次数:", res.data[0].fireCount, 12], ], }, { title: ["行政许可情况", res.data[0].processDate && res.data[0].carefullyCheckDate && res.data[0].securityCheckDates], children: [ ["审核时间:", res.data[0].processDate, 12], ["验收时间:", res.data[0].carefullyCheckDate, 12], ["安检时间:", res.data[0].securityCheckDates, 12], ], }, { title: ["历史检查情况", res.data[0].inspectCompany && res.data[0].fireHazard && res.data[0].rectificateFireHazard && res.data[0].punishmentDecision && res.data[0].orderThreeStops && res.data[0].correctionNotice && res.data[0].temporarySeizure && res.data[0].penaltyAmount], children: [ ["检查:", res.data[0].inspectCompany + "(家)", 8], ["隐患:", res.data[0].fireHazard + "(起)", 8], ["整改:", res.data[0].rectificateFireHazard + "(起)", 8], ["行罚:", res.data[0].punishmentDecision + "(份)", 8], ["三停:", res.data[0].orderThreeStops + "(家)", 8], ["责改:", res.data[0].correctionNotice + "(份)", 8], ["临封:", res.data[0].temporarySeizure + "(份)", 8], ["罚金:", res.data[0].penaltyAmount + "(万元)", 8], ], }, { title: ["相关火灾情况", res.data[0].fireTime && res.data[0].disposalDuration && res.data[0].burnedArea && res.data[0].fireGrade && res.data[0].mobilizeVehicles && res.data[0].squadron && res.data[0].status && res.data[0].initialFuelType1], children: [ ["报警时间:", res.data[0].fireTime, 12], ["处置时长:", res.data[0].disposalDuration, 12], ["过火面积:", res.data[0].burnedArea, 12], ["火灾等级:", res.data[0].fireGrade, 12], ["调动车辆:", res.data[0].mobilizeVehicles + "(辆)", 12], ["所属中队:", res.data[0].squadron, 12], ["状况:", res.data[0].status, 12], ["起火物:", res.data[0].initialFuelType1, 12], ], }, ]; this.popup(val._attrbutes, arrayList, true) }); } else if (type == "举报投诉") { let arrayList = [{ title: [val._attrbutes.name, true], children: [ ], }] this.popup(val._attrbutes, arrayList, true) } else if (type == "执法记录仪") { let arrayList = [{ title: [val._attrbutes.groupName, true], children: [ ["执法人:", val._attrbutes.name, 12], ], type: type, url: val._attrbutes.url, }, ] this.popup(val._attrbutes, arrayList, true) } else if (type == "重大火灾隐患") { let msgParse = JSON.parse(val.attrbutes.extendData) let arrayList = [{ title: [val.attrbutes.facilityName, true], children: [ ["地址:", val.attrbutes.address, 24], ["分类等级:", val.attrbutes.address, 24], ["基础信息:", msgParse.test1, 24], ["消防安全隐患情况:", msgParse.test2, 24], ], }, ]; this.popup(val._attrbutes, arrayList, true) } else if (type == "三合一") { let msgParse = JSON.parse(val.attrbutes.extendData) let arrayList = [{ title: [val.attrbutes.facilityName, true], children: [ ["单位地址:", val.attrbutes.address.replace("\t", ""), 24], ["单位类别:", "三合一九小场所", 24], ["单位法人:", val.attrbutes.facilityName.replace("\t", ""), 24], ["检查人员姓名:", msgParse.test1, 24], ["检查时间:", msgParse.test3, 24], ["单位使用性质:", msgParse.test4, 24], ["单位所属街道:", msgParse.test8, 24], ["消消防安全责任人:", msgParse.test10, 24], ["消防安全管理人(联系人):", msgParse.test11, 24], ["联系电话(手机):", msgParse.test12, 24], ["单位(场所)面积(m²):", msgParse.test17, 24], ["地上:", msgParse.test18, 24], ["地下:", msgParse.test19, 24], ["建筑性质:", msgParse.test21, 24], ["建筑结构:", msgParse.test22, 24], ], }, ]; this.popup(val._attrbutes, arrayList, true) } else if (type == "本年度重点事项推进情况") { let msgParse = JSON.parse(val.attrbutes.extendData) let arrayList = [{ title: [val.attrbutes.facilityName, true], children: [ ["街道名称:", val.attrbutes.streetTown, 24], ["地址:", val.attrbutes.address, 24], ["状态:", val.attrbutes.status == 1 ? "已完成" : val.attrbutes.status == 2 ? "施工中" : val.attrbutes.status == 3 ? "招标中" : "", 24], ], }, ]; this.popup(val._attrbutes, arrayList, true) } } //企业自主 if (pageType == "self-management") { if (val.attrbutes.type == "重点单位") { this.elementInfo(val.attrbutes, "重点单位") } else if (val.attrbutes.type == "大型综合体") { let msgParse = JSON.parse(val.attrbutes.extendData) let arrayList = [{ title: [val.attrbutes.facilityName, true], children: [ ["地址:", val.attrbutes.address, 24], ["类型:", val.attrbutes.facilityType == 2 ? "5W平大型商业综合体" : val.attrbutes.facilityType == 3 ? "3-5万平大型商业综合体" : "", 24], ["平面布局:", msgParse.planeLayout, 24], ["用火用电用气管理:", msgParse.fireGasManage, 24], ["油烟管道管理:", msgParse.oilFumeManage, 24], ["消防设施:", msgParse.fireFacility, 24], ["其他安全管理:", msgParse.otherSecurityManage, 24], ["合计汇总:", msgParse.totalSummary, 24], ], }, ]; this.popup(val._attrbutes, arrayList, true) } else if (val.attrbutes.type == "中小学" || val.attrbutes.type == "幼儿园" || val.attrbutes.type == "其他学校") { let msgParse = JSON.parse(val.attrbutes.extendData) let phone = val.attrbutes.contactPhone let arrayList = [{ title: [val.attrbutes.facilityName, true], children: [ ["机构简称:", msgParse.test1, 24], // ["学校办别:", val.attrbutes.facilityType, 24], ["学校类型:", val.attrbutes.type, 24], ["所在街镇:", val.attrbutes.streetTown, 24], ["地址:", msgParse.address, 24], ["法人代表:", val.attrbutes.contact, 24], ["手机:", phone.length > 8 ? phone.substring(0, 3) + '****' + phone.substring(phone.length - 3, phone.length) : phone.substring(0, 2) + '***' + phone.substring(phone.length - 3, phone.length), 24], ], }, ]; this.popup(val._attrbutes, arrayList, true) } else { let arrayList = [{ title: ["单位详情", val.attrbutes.companyName ? true : false], children: [ ["单位名称:", val.attrbutes.companyName, 24], ["单位类型:", val.attrbutes.companyTypeName, 24], ["联系电话:", val.attrbutes.linkPhone, 24], ["地址:", val.attrbutes.address, 24], ], }, ]; this.popup(val._attrbutes, arrayList, true) } } //大型安保 、火灾数据分析 if (pageType == "security-plan" || pageType == "fire-data-analysis") { let arrayList = [{ title: ["案件详情", true], children: [ ["案件编号:", val.attrbutes.ajbh, 24], ["案件描述:", val.attrbutes.bcxx, 24], ["报警时间:", val.attrbutes.tzsj, 24], ["案件类型:", val.attrbutes.ajlx, 24], ["警情类别:", type, 24], ["警情等级:", val.attrbutes.ajdj, 24], ["调动车辆:", val.attrbutes.cdcl, 24], ["处置对象:", val.attrbutes.czdx, 24], ["主责中队:", val.attrbutes.zhongdui, 24], ["案件状态:", val.attrbutes.ajzt, 24], ["到场时间:", val.attrbutes.cssj, 24], ["控制时间:", val.attrbutes.kzsj, 24], ["熄灭时间:", val.attrbutes.xmsj, 24], ["返队时间:", val.attrbutes.fdsj, 24], ["所属街道:", val.attrbutes.streettown, 24], ], }, ]; if (val._attrbutes.type != "国家会展中心") { this.popup(val._attrbutes, arrayList, true) } } //消防救援站点 if (pageType == "rescue-station") { if (type == "科普教育基地") { let arrayList = [{ title: [val.attrbutes.type, true], children: [ ["成立时间/联系人:", val.attrbutes.policeTime, 24], ["站点地址:", val.attrbutes.alertLevel, 24], ["预约电话:", val.attrbutes.address, 24], ], }, ]; this.popup(val._attrbutes, arrayList, true) } if (type == "消防站" || type == "专职队" || type == "高层建筑覆盖" || type == "高层建筑" || type == "微型消防站" || type == "一级微型消防站" || type == "街镇专职消防队") { if (val.attrbutes.stationType == 1 || val.attrbutes.stationType == 2 || val.attrbutes.stationType == 3 || val.attrbutes.stationType == 4) { let arrayList = [{ title: [val.attrbutes.stationName, true], children: [ ["消防站地址:", val.attrbutes.stationAddress, 24], ["消防站类型:", val.attrbutes.stationType == 1 ? "一级消防站" : val.attrbutes.stationType == 2 ? "二级消防站" : val.attrbutes.stationType == 3 ? "三级消防站" : val.attrbutes.stationType == 4 ? "专职队" : "", 24], ], }, ]; this.popup(val._attrbutes, arrayList, true) } if (val.attrbutes.stationType == 5) { let arrayList = [{ title: [val.attrbutes.streetTown + "微型消防站(" + val.attrbutes.stationCode + '号)', true], children: [ ["地址:", val.attrbutes.stationAddress, 24], ["编号:", val.attrbutes.stationCode, 24], ["距消防站直线距离:", val.attrbutes.stationAddress, 24], ["距消防站行驶距离:", val.attrbutes.driveDistance, 24], ["交通拥堵行驶时间:", val.attrbutes.jamDrive, 24], ["交通畅通行驶时间:", val.attrbutes.unimpededDrive, 24], // ["点位情况:", val.attrbutes.pointSituation, 24], ["建筑情况:", val.attrbutes.buildSituation, 24], ["车辆停放:", val.attrbutes.vehiclePark, 24], ["是否有产证:", val.attrbutes.birthCert, 24], ["产证情况:", val.attrbutes.birthCertSituation, 24], ], }, ]; this.popup(val._attrbutes, arrayList, true) } if (val.attrbutes.stationType == 111 || val.attrbutes.stationType == 112) { let arrayList = [{ title: [val.attrbutes.buildName, true], children: [ ["建筑地址:", val.attrbutes.address, 24], ["主要产权人:", val.attrbutes.principalPropertyOwner, 24], ["统一社会信用代码:", val.attrbutes.creditCode, 24], ["物业服务企业名称:", val.attrbutes.propertyServiceName, 24], ["建成年份:", val.attrbutes.completeYear, 24], ["建筑高度:", val.attrbutes.buildHigh, 24], ["地上建筑层数:", val.attrbutes.aboveFloor, 24], ["地下建筑层数:", val.attrbutes.underFloor, 24], ["建筑类型:", val.attrbutes.buildType, 24], ["功能用途:", val.attrbutes.functionalPurpose, 24], ], }, ]; this.popup(val._attrbutes, arrayList, true) } if (val.attrbutes.stationType == 17 || val.attrbutes.stationType == 18) { let bianhao = JSON.parse(val.attrbutes.extendData).test1 let arrayList = [{ title: [val.attrbutes.facilityName, true], children: [ ["编号:", bianhao, 24], ["消防站地址:", val.attrbutes.address, 24], ["消防站类型:", val.attrbutes.stationType == 17 ? "一级微型消防站" : val.attrbutes.stationType == 18 ? "街镇专职消防队" : "", 24], ], }, ]; this.popup(val._attrbutes, arrayList, true) } } if (type == "企业消防" || type == "社区消防") { let arrayList = [{ title: [val.attrbutes.facilityName, true], children: [ ["站点地址:", val.attrbutes.address, 24], ["站点类型:", val.attrbutes.facilityType == 13 ? "重点单位微站" : val.attrbutes.facilityType == 14 ? "一般单位微站" : val.attrbutes.facilityType == 15 ? "居委会微站" : val.attrbutes.facilityType == 16 ? "村委会微站" : "", 24 ], ["街镇:", val.attrbutes.streetTown, 24], ], }, ]; this.popup(val._attrbutes, arrayList, true) } } //警情综合处置 if (pageType == "comprehensive-disposal") { if (type == "实时警情") { let arrayList = [{ title: ["案件详情", true], children: [ ["案件编号:", val.attrbutes.ajbh, 24], ["案件描述:", val.attrbutes.bcxx, 24], ["报警时间:", val.attrbutes.tzsj, 24], ["案件类型:", val.attrbutes.ajlx, 24], ["警情类别:", val.attrbutes.type, 24], ["警情等级:", val.attrbutes.ajdj, 24], ["案发地址:", val.attrbutes.afdz, 24], ["调动车辆:", val.attrbutes.cdcl, 24], ["处置对象:", val.attrbutes.czdx, 24], ["主责中队:", val.attrbutes.zhongdui, 24], ["案件状态:", val.attrbutes.cssj, 24], ["到场时间:", val.attrbutes.dcsj, 24], ["出水时间:", val.attrbutes.cssj, 24], ["控制时间:", val.attrbutes.kzsj, 24], ["熄灭时间:", val.attrbutes.xmsj, 24], ["所属街道:", val.attrbutes.streettown, 24], ], }, ]; this.popup(val._attrbutes, arrayList, true) } } //城市消防体征 if (pageType == "fire-signs") { if (type == "仓库") { let arrayList = [{ title: [val.attrbutes.companyName, true], children: [ ["单位地址:", val.attrbutes.address, 24], ["单位类别:", val.attrbutes.companyType, 24], ["单位使用性质:", val.attrbutes.companyNature, 24], ["单位(法人)名称:", val.attrbutes.delegateName, 24], ["统一社会信用代码:", val.attrbutes.socialCode, 24], ["所辖派出所:", val.attrbutes.policeStation, 24], ["消防安全责任人:", val.attrbutes.fireDutyName, 24], ["消防安全管理人:", val.attrbutes.fireManageName, 24], ["联系电话(手机):", val.attrbutes.linkPhone, 24], ["是否自主消防安全管理:", val.attrbutes.fireSafetyManage, 24], ["单位(场所)面积(㎡):", val.attrbutes.companyArea, 24], ["行业类别:", val.attrbutes.industryType, 24], ["是否为洁净厂房:", val.attrbutes.cleanRoom, 24], ["生产经营组织形式:", val.attrbutes.organizationForm, 24], ["网格号:", val.attrbutes.gridNo, 24], ["年份:", val.attrbutes.particularYear, 24], ["提交时间:", val.attrbutes.submitTime, 24], ["经度:", val.attrbutes.longitude, 24], ["纬度:", val.attrbutes.latitude, 24], ], }, ]; this.popup(val._attrbutes, arrayList, true) } } }, }); } }, //聚合点击事件 clusterMapCallBack(clusterPointArr, clickPoint) { let val = clusterPointArr.attributes if (val.type2 == "消火栓可用" || val.type2 == "消火栓不可用") { let arrayList = [{ title: ["消火栓", true], children: [ ["水源位置:", val.address, 24], ["电话:", val.phone, 12], ["责任人:", val.dutyPerson, 12], ["支队名称:", val.detachmentName, 24], ["管辖机构:", val.jurisdictionalAgency, 12], ["水源类型:", val.type, 12], ["取水形式:", val.getWaterType, 12], ["水源性质:", val.waterAdministrative, 12], ["供水单位:", val.waterUnit, 24], ["水压(Mpa):", val.waterGage, 24], ["状态:", val.status == 1 ? "可用" : "不可用", 12], ], }, ]; this.popup(val, arrayList, true) } else if (type == "天然水源") { let arrayList = [{ title: [val.facilityName, true], children: [ ["水源位置:", val.address, 24], ], }, ]; this.popup(val, arrayList, true) } }, heatMap(data) { let target = [] if (data.length > 0) { for (let i = 0; i < data.length; i++) { var wgs84 = CoordUtil.gcj02towgs84(Number(data[i].gisX) || Number(data[i].longitude), Number(data[i].gisY) || Number(data[i].latitude)) var x = wgs84[0] var y = wgs84[1] target[i] = [] target[i].x = x target[i].y = y } } let options = { style: { minOpacity: 0.6, maxOpacity: 0.9, radius: 50, gradient: { '.10': 'green', '.45': 'yellow', '.65': 'orange', '.80': 'red' } }, isZoom: false } jMap.HeatMap.show(target, options) }, // 无经纬度创建标点和点击事件 addMarkerAddress(lnglats) { let target = lnglats.map((val, ind) => { if (!val.addressId) { let addressInfo = window.jMap.queryMphInfo(val.address)[val.address][0]; return { ...val, addressId: addressInfo.address_id, // 地址id province: addressInfo.province, // 市 district: addressInfo.district, // 区 sub_district: addressInfo.sub_district, // 街镇 streetname: addressInfo.streetname, // 路 address: addressInfo.address, // 户 committee: addressInfo.committee, // 居委会 }; } }); target = target.reduce((item, next) => { !item.some((val) => val.addressId === next.addressId) && item.push(next); return item; }, []); for (let item = 0; item < Math.floor(target.length / 100); item++) { setTimeout(() => { window.jMap.locateMph( target .slice(item * 100, (item + 1) * 100) .map((val) => val.addressId) .join(), { isZoom: false, scaleByDistance: { minScaling: 0, maxScaling: 1, minDistance: 1000, maxDistance: 30000 }, click: (value) => { this.elementInfo(value, "fire"); }, } ); }, 0); } }, elementInfo(value, type) { let element = ""; if (type == "重点单位") { element = `
1212121
`; } this.addMarkerInfo(element, value, type); }, bufferL(val) { let target = { geometry: [{ position: [], type: 'point' }], distance: 7000 } for (let i = 0; i < val.length; i++) { // var wgs84 = CoordUtil.gcj02towgs84(Number(val.longitude + '0000000' ), Number(val.latitude + '0000000' )) // var x = wgs84[0] // var y = wgs84[1] target.geometry[i] = { position: [{ x: Number(val[i].longitude) + '0000000', y: Number(val[i].latitude) + '0000000' }], type: 'point' } // if(val[i].stationType ==7 ){ // target // } } var options = { callBack: this.bufferCallback }; jMap.Buffer.generate(target, options); }, bufferL1(val) { let target = { geometry: [{ position: [], type: 'point' }], distance: ((Math.sqrt(7 / 3.14) * 1000) / 2).toFixed(0) } for (let i = 0; i < val.length; i++) { var wgs84 = CoordUtil.gcj02towgs84(Number(val[i].longitude), Number(val[i].latitude)) var x = wgs84[0].toFixed(13) var y = wgs84[1].toFixed(13) target.geometry[i] = { position: [{ x: x, y: y }], type: 'point' } } var options = { callBack: bufferCallback }; jMap.Buffer.generate(target, options); }, bufferL2(val) { let target = { geometry: [{ position: [], type: 'point' }], distance: ((Math.sqrt(4 / 3.14) * 1000) / 2).toFixed(0) } for (let i = 0; i < val.length; i++) { var wgs84 = CoordUtil.gcj02towgs84(Number(val[i].longitude), Number(val[i].latitude)) var x = wgs84[0].toFixed(13) var y = wgs84[1].toFixed(13) target.geometry[i] = { position: [{ x: x, y: y }], type: 'point' } } var options = { callBack: bufferCallback }; jMap.Buffer.generate(target, options); }, bufferL3(val) { let target = { geometry: [{ position: [], type: 'point' }], distance: ((Math.sqrt(2 / 3.14) * 1000) / 2).toFixed(0) } for (let i = 0; i < val.length; i++) { var wgs84 = CoordUtil.gcj02towgs84(Number(val[i].longitude), Number(val[i].latitude)) var x = wgs84[0].toFixed(13) var y = wgs84[1].toFixed(13) target.geometry[i] = { position: [{ x: x, y: y }], type: 'point' } } var options = { callBack: bufferCallback }; jMap.Buffer.generate(target, options); }, bufferL4(val) { let target = { geometry: [{ position: [], type: 'point' }], distance: ((Math.sqrt(2 / 3.14) * 1000) / 2).toFixed(0) } for (let i = 0; i < val.length; i++) { var wgs84 = CoordUtil.gcj02towgs84(Number(val[i].longitude), Number(val[i].latitude)) var x = wgs84[0].toFixed(13) var y = wgs84[1].toFixed(13) target.geometry[i] = { position: [{ x: x, y: y }], type: 'point' } } var options = { callBack: bufferCallback }; jMap.Buffer.generate(target, options); }, bufferL5(val) { let target = { geometry: [{ position: [], type: 'point' }], distance: ((Math.sqrt(2 / 3.14) * 1000) / 2).toFixed(0) } for (let i = 0; i < val.length; i++) { var wgs84 = CoordUtil.gcj02towgs84(Number(val[i].longitude), Number(val[i].latitude)) var x = wgs84[0].toFixed(13) var y = wgs84[1].toFixed(13) target.geometry[i] = { position: [{ x: x, y: y }], type: 'point' } } var options = { callBack: bufferCallback }; jMap.Buffer.generate(target, options); }, bufferCallback(result) { for (var i in result) { var target = { id: i, position: CoordUtil.arrayToJson(result[i].rings[0]) // 二维坐标数组转JSON数组,详见三中 }; var options = { style: { color: 'red', transparency: 0.6, } } // if (result[i].stationType == 1) { // options.style.color = '#f80000', // options.style.transparency = 0.6 // } // if (result[i].stationType == 2) { // options.style.color = '#f88c00', // options.style.transparency = 0.6 // } // if (result[i].stationType == 3) { // options.style.color = '#0092f8', // options.style.transparency = 0.6 // } jMap.Locate.regionLocate(target, options) } }, bufferCallback1(result) { for (var i in result) { var target = { id: i, position: CoordUtil.arrayToJson(result[i].rings[0]) // 二维坐标数组转JSON数组,详见三中 }; jMap.Locate.regionLocate(target, { style: { color: '#f80000', transparency: 0.6, } }) } }, bufferCallback2(result2) { for (var i in result2) { var target = { id: i, position: CoordUtil.arrayToJson(result2[i].rings[0]) // 二维坐标数组转JSON数组,详见三中 }; jMap.Locate.regionLocate(target, { isZoom: true, style: { color: '#f88c00', transparency: 0.6, } }) } }, bufferCallback3(result3) { for (var i in result3) { var target = { id: i, position: CoordUtil.arrayToJson(result3[i].rings[0]) // 二维坐标数组转JSON数组,详见三中 }; jMap.Locate.regionLocate(target, { style: { color: '#0092f8', transparency: 0.6, } }) } }, addMarkerInfo(element, value, type, isBtn = false) { var wgs84 = CoordUtil.gcj02towgs84(Number(value.gisX) || Number(value.longitude), Number(value.gisY) || Number(value.latitude)) var x = wgs84[0] var y = wgs84[1] let _this = this // window.jMap.Popup && window.jMap.Popup.hide([this.oldPopup && this.oldPopup.id]); if (this.oldPopup && value.id === this.oldPopup.id) { window.jMap.Popup.hide(); return (this.oldPopup = null); } if (type == "selfManagement" || type == "water") { window.jMap.Popup.show({ id: value.id, //position: value.wgs84position, //使用自定义窗体 position: { x: x, y: y }, //使用自定义窗体 element: element, }, { isZoom: false, offset: [0, -40] }); } if (type == "重点单位") { _this.stores.zddwIdSD(value.companyId); // localStorage.setItem("zddw",) // window.jMap.Popup.show({ // // position: { x: value.gisX, y: value.gisY }, //使用自定义窗体 // position: { x: x, y: y }, //使用自定义窗体 // element: element, // }, { isZoom: 100, offset: [0, -40] }); } // if (!isBtn) { // window.jMap.goTo({ // x: Number(value.wgs84position.x), // y: Number(value.wgs84position.y), // radius: 1000, // }, { // duration: 3, // offset: { // heading: -4, // pitch: -70, // range: 0, // }, // }); // window.jMap.Buffer.generate({ // geometry: [{ position: [{ x: Number(value.wgs84position.x), y: Number(value.wgs84position.y) }], type: "point" }], // distance: 1000, // }, { // callBack: (el) => { // for (const i in el) { // var target = { // id: i, // position: CoordUtil.arrayToJson(el[i].rings[0]), // }; // } // window.jMap.Locate.regionLocate(target, { // style: { // color: "rgba(235, 98, 98, .1)", // transparency: 0.3, // }, // }); // }, // }); // } this.oldPopup = value; }, removePopup(e) { }, /** * *气泡窗 */ popup(data, arrayList, type, other) { if (type) { if (!other) { var html = document.createElement('div'); html.className = 'ysc-dynamic-layer ys-css3-box'; var line = document.createElement('div'); line.className = 'line'; var main = document.createElement('div'); main.className = 'main'; main.setAttribute('style', 'position: absolute;top:50%;max-height:500px;overflow-y: scroll;background:none;width:400px;bottom:auto; padding:10px 10px 5px 0 !important; border-radius: 0.05rem;border:1px solid rgba(115, 251, 253, 1);box - shadow: inset 0 0 1px 0.0125rem rgba(115, 251, 253, 1); background:rgba(0, 0, 0, 0.6)'); var click = document.createElement('div'); click.setAttribute('style', 'float: right;width: 13px;height: 13px;position: absolute;top:8px;right:16px;cursor: pointer'); var img = document.createElement('img'); img.className = 'click'; img.setAttribute("src", this.stores.sadianIcon.close); img.setAttribute("style", 'width: 20px;height: 20px;') click.appendChild(img) var contain = document.createElement('div'); contain.setAttribute('style', 'margin-left: 3%;right:50px;top:30px;padding: 0px 0 '); if (arrayList[0].title[1]) { var p = document.createElement('div'); p.setAttribute('style', 'font-size:18px;color:#73fbfd;line-height:25px'); p.innerHTML = arrayList[0].title[0] contain.appendChild(p) } for (let i = 0; i < arrayList[0].children.length; i++) { if (arrayList[0].children[i][1]) { let textWrap = document.createElement('div'); textWrap.setAttribute('style', 'font-size:14px;color:#fff;line-height:25px;'); let p1 = document.createElement('span'); p1.setAttribute('style', 'color:#73fbfd;'); p1.innerHTML = arrayList[0].children[i][0] let p2 = document.createElement('span'); p2.setAttribute('style', 'color:#fff;word-break:break-all !important'); p2.innerHTML = arrayList[0].children[i][1] textWrap.appendChild(p1) textWrap.appendChild(p2) contain.appendChild(textWrap) } } setTimeout(() => { main.appendChild(click) main.appendChild(contain) html.appendChild(line) html.appendChild(main) let text = html.innerHTML.replace(/"click"/g, '"click" onclick="vue.popup(false, false, false)"') var wgs84 = CoordUtil.gcj02towgs84(Number(data.gisX) || Number(data.longitude), Number(data.gisY) || Number(data.latitude)) var x = wgs84[0] var y = wgs84[1] var target = { id: '100001', position: { x: x, y: y, z: 0 }, element: `
${text}
` }; var options = { // isZoom: true, offset: [-6, -275] }; jMap.Popup.show(target, options); }, 10) } else { } } else { jMap.Popup.hide(); } }, } }