//在div中初始化地图 // /let myChart = echarts.init(document.getElementById('map-content')); let uploadedDataURL2 = "../../js/compreDisplay/anhui/hefei.json"; echarts.init(document.getElementById('echarts-map2')).dispose(); let myChart2 = null; /** * 加载地图 * @param dataMap */ function map2(dataMap) { $.getJSON(uploadedDataURL2, function (geoJson) { echarts.registerMap('anhui', geoJson); myChart2.hideLoading(); let max = 480, min = 1; // todo let maxSize4Pin = 100, minSize4Pin = 100; let convertData = function (data) { let res = []; for (let i = 0; i < data.length; i++) { let geoCoord = data[i].coordinate; if (geoCoord) { res.push({ name: data[i].isOnline == 1 ? "在线" : "不在线", value: geoCoord.concat(data[i].value), coordinate: data[i].coordinate, cityName: data[i].cityName, workId: data[i].workId, macId: data[i].macId, puid: data[i].puid, classId: data[i].classId, subName: data[i].subName, workUnit: data[i].workUnit, workManager: data[i].workManager, proName: data[i].proName, ticketNo: data[i].ticketNo, ticketType: data[i].ticketType, workTeam: data[i].workTeam, workContent: data[i].workContent, riskLevel: data[i].riskLevel, workPostion: data[i].workPostion, safetyManager: data[i].safetyManager, workStatus: data[i].workStatus, isOnline: data[i].isOnline, bidName: data[i].bidName }); } } return res; }; let option = { silent: false, backgroundColor: 'transparent', textStyle: { fontSize: 15, fontWeight: 'bold', color: 'red' }, tooltip: { trigger: 'item', enterable: true, position: function (pos, params, dom, rect, size) { if ($(dom).children($('p')).length === 0) $(dom).css('display', 'none') pos = [pos[0], pos[1] + 10]; return pos; }, backgroundColor: 'rgba(14, 17, 28,0.63)', //设置背景颜色 textStyle: { color: '#fff' }, borderColor: "#174FDD", formatter: function (params) { if (params.data) return ( '

' + dealEmptyString(params.data.proName) + '

' + '

风险等级:' + dealEmptyString(params.data.riskLevel) + '

' + '

作业内容:' + sliceStr(params.data.workContent) + '

' + '

班组长:' + dealEmptyString(params.data.workManager) + '

' + '

球机:' + dealEmptyString(params.data.isOnline) + '

' ) }, // extraCssText: "background:url('../../img/tc.png') 100% 100% repeat;", extraCssText: "max-width:300px;height:auto;word-break:break-all;white-space:pre-wrap;", }, geo: { show: true, map: 'anhui', aspectScale:0.8, label: { normal: { show: true, textStyle: { color: '#fff', fontFamily: 'Alibaba PuHuiTi R' }, rotate: -20, }, emphasis: { show: true, } }, roam: true, scaleLimit: { max: max, min: min }, itemStyle: { normal: { areaColor: '#356dbb', borderColor: '#7ad4ff', borderWidth: 1, shadowColor: 'rgba(53,109,187,0.5)', shadowBlur: 30, }, emphasis: { areaColor: '#2B91B7', } }, tooltip: { show: true } }, series: [{ name: '在线', type: 'scatter', coordinateSystem: 'geo', animation: false, symbolSize: function (val) { let a = (maxSize4Pin - minSize4Pin) / (max - min); let b = minSize4Pin - a * min; b = maxSize4Pin - a * max; return 33; }, symbol: function (val) { console.log(val) switch (val[2]) { case 2: return 'image://../../img/compreDisplay/two-risk.png'; break; case 3: return 'image://../../img/compreDisplay/three-risk.png'; break; case 4: return 'image://../../img/compreDisplay/four-risk.png'; break; case 5: return 'image://../../img/compreDisplay/five-risk.png'; break; default: break; } }, label: { normal: { show: false, textStyle: { color: '#fff', fontSize: 15, opacity: 1 } } }, zlevel: 6, z: 6, // data: convertData(dataMap) }, ] } myChart2.clear(); myChart2.setOption(option, true); }); window.addEventListener("resize", function () { myChart2.resize(); }); }