let app = new Vue({ el: "#app", data () { return { count: 0, //重点项目两线指标轮到哪个 list: [], //重点项目两线指标数组 countType: 0, //重点项目两线指标数组 mapShow: true, // false为中国地图 true为山西地图 titleUrl: '',// 标题弹窗显示的内容 titleName: '', // 弹窗的名字显示 leftEcharts1: "", leftEcharts2: "", leftEcharts3: "", leftEcharts4: "", leftEcharts5: "", leftEcharts6: "", leftEcharts7: "", leftEcharts8: "", leftEcharts9: "", leftEcharts10: "", leftEcharts11: "", leftEcharts12: '', leftEcharts13: '', leftEcharts14: '', leftEcharts15: '', leftEcharts17: '', //投资产业分布中间的水球图 leftEcharts18: '', //单个柱状图弹窗 tipShow1: false, // 标题弹窗显示 tipShow2: false, // 单柱状图弹窗 stageTitle: '', // 管理类型分析圆环图内容 stageTitle2: '', // 管理类型分析圆环图内容 stageTitle3: '', // 投资产业分析圆环图内容 stageTitle4: '', // 投资产业分析圆环图内容 echartR2Fd: true, // 投后进度成本偏差防抖 leftEcharts16: '', // 中国地图背景地球 rightEcharts1: '', // 投后进度成本偏差 shanxiMap: "", // 山西地图 chinaMap: '', // 中国地图 industryProportion: 1, // 主辅业占比轮播 industryLayout: 0, //产业布局分析 time1: "", // 4秒定时器 time2: "", // 针对投前产业布局分析的定时器 projectNum: 0, // 项目阶段分析指示器 commonUrl: '',//获取当前服务器地址 radarNum: '', // 雷达图样式 projecList: [ //项目阶段分析内容距离 特别监管15~35 备案类50~70 [ { name: '特别监管', value: '14', value2: '12.05', top: 0 }, { name: '备案', value: '27', value2: '23.86', top: 0 }, { name: '项目储备', distance: '250px' } ], [ { name: '特别监管', value: '2', value2: '1.25', top: 22 }, { name: '备案', value: '1', value2: '1.05', top: 23 }, { name: '项目立项', distance: '370px' } ], [ { name: '特别监管', value: '10', value2: '32.69', top: 24 }, { name: '备案', value: '14', value2: '18.46', top: 25 }, { name: '可研论证', distance: '490px' } ], [ { name: '特别监管', value: '15', value2: '28.53', top: 26 }, { name: '备案', value: '40', value2: '38.86', top: 27 }, { name: '投资决策', distance: '610px' } ], [ { name: '特别监管', value: '9', value2: '6.49', top: 28 }, { name: '备案', value: '39', value2: '8.08', top: 29 }, { name: '项目储备', distance: '350px' } ], [ { name: '特别监管', value: '12', value2: '12.63', top: 30 }, { name: '备案', value: '7', value2: '1.83', top: 31 }, { name: '项目立项', distance: '470px' } ], [ { name: '特别监管', value: '2', value2: '0.10', top: 32 }, { name: '备案', value: '19', value2: '1.01', top: 33 }, { name: '可研论证', distance: '590px' } ], [ { name: '特别监管', value: '27', value2: '15.52', top: 34 }, { name: '备案', value: '73', value2: '17.65', top: 35 }, { name: '投资决策', distance: '710px' } ], ], year: '', // 选择的年份 pollList: [], // 年份有哪些呢 pullShow: false, // 选择年份弹窗 storageRecordConfig: { waitTime: "10000", hoverPause: true, header: ["企业集团", "项目名称", "投资金额"], headerHeight: 80, headerBGC: '#69C0FF20', oddRowBGC: '#011e4800', evenRowBGC: '#011e4800', // oddRowBGC: '#05507b33', rowNum: 6, columnWidth: [150, 450, 150], align: ["center", "center", "center"], data: [ ['华阳新材', '华钠铜(碳)年产万吨级钠离子电池正负极材料项目', '11.42亿'], ['太重集团', '太重退城入园智能高端装备生产线升级改造项目', '18.11亿'], ['太重集团', '太重智能高端液压挖掘机项目', '17.82亿'], ['太重集团', '太重(大同)高端起重机产业基地二期项目', '1.62亿'], ['太重集团', '太重液压挖掘机四轮一带项目', '4.00亿'], ['太重集团', '太重中大型工程起重机智能制造项目', '8.30亿'], ['太重集团', '太重高端工程机械齿轮箱智能制造项目', '3.55亿'], ['云时代', '侯马北铜年处理铜精矿150万吨综合回收项目', '27.70亿'], ['交控集团', '山西固废资源化利用交通科技园项目', '2.00亿'], ['云时代', '北方铜业铜矿峪矿园子沟尾矿库项目', '16.73亿'], ['山西建投', '山西综改示范区潇河产业园区建筑垃圾资源化处理项目', '3.90亿'], ['云时代', '山西北铜高性能压延铜带箔和覆铜板项目', '23.96亿'], ['大地控股', '大地控股忻州新店年产800万吨精品砂石骨料项目', '8.70亿'], ['山西建投', '山西建投晋西北建筑产业园区项目', '6.71亿'], ['山西建投', '山西建投长治建筑产业园区一期项目', '4.98亿'], ['汾酒集团', '汾青基地2万吨原酒酿造一期项目', '14.80亿'], ['文旅集团', '忻州清凉湾温泉康养项目', '9.34亿'], ['交控集团', '山西路桥数字化交通产业园(南区)项目', '32.10亿'], ['山西建投', '山西农谷智慧冷链物流园项目', '5.49亿'], ['华新燃气', '大同液化调峰储备集散中心二期项目', '1.50亿'], ['神农科技', '天镇万头奶牛智慧牧场项目', '5.67亿'], ['晋能控股', '阳泉郊区西上庄煤矿项目', '52.56亿'], ['华阳新材', '和顺泊里矿井及选煤厂项目', '67.00亿'], ['华阳新材', '寿阳七元煤矿项目', '50.77亿'], ['山西焦煤', '沁源中峪煤矿项目', '87.69亿'], ['晋能控股', '晋城兴唐车寨煤矿及选煤厂项目', '27.52亿'], ['晋能控股', '阳城龙湾矿井及选煤厂项目', '69.28亿'], ['晋能控股', '沁水东大矿井及选煤厂项目', '62.46亿'], ['晋能控股', '沁水郑庄矿井及选煤厂项目', '83.06亿'], ['山西焦煤', '乡宁谭坪煤矿一期项目', '56.62亿'], ['山西焦煤', '灵石灵北煤矿及选煤厂项目', '66.27亿'], ['晋能控股', '晋控电力同热三期2x100万千瓦“上大压小”煤电项目', '72.67亿'], ['山西焦煤', '山煤集团河曲2x35万千万低热值煤发电项目', '33.30亿'], ['华阳新材', '西上庄低热值煤发电项目', '53.85亿'], ['华新燃气', '阳城煤层气集输中心(町店配气站二期扩容改造)项目', '2.50亿'], ['交控集团', '高速公路充电桩建设项目', '3.10亿'], ['交控集团', '三个一号旅游公路和“四好农村路”沿线充电桩建设项目', '7.10亿'], ['山西建投', '山西省静态交通大数据平台项目', '1.00亿'], ['华远陆港', '集宁经大同至原平铁路项目', '248.21亿'], ['华远陆港', '雄安新区至忻州高速铁路山西段项目', '192.06亿'], ['华远陆港', '阳涉铁路开通客运服务项目', '6.60亿'], ['交控集团', '昔阳(晋冀界)至榆次高速公路项目', '209.86亿'], ['交控集团', '青银二广高速公路太原联络线项目', '72.88亿'], ['交控集团', '晋阳高速公路改扩建工程', '62.02亿'], ['交控集团', '青兰国家高速公路长治至延安联络线(G2211)山西境黎城至霍州段项目', '231.10亿'], ['交控集团', '汾阳至石楼高速公路项目', '117.14亿'], ['交控集团', '呼北国家高速公路离石至隰县段项目', '104.90亿'], ['交控集团', '临汾至沁水高速公路临汾至浮山段项目', '19.70亿'], ['交控集团', 'G108线重点路段新建改建工程(含2个子项目)', '130.19亿'], ['交控集团', '国道241、省道岚马线汾河水库段改线工程', '41.71'], ['交控集团', 'G241阳方口至朔州段和G336朔州至平鲁段公路改扩建工程PPP项目', '16.38亿'], ['交控集团', 'G336线应县罗庄至朔城区东榆林改扩建工程', '23.17亿'], ['航产集团', '太原武宿(国际)机场三期改扩建项目', '239.28亿'], ['航产集团', '太原武宿(国际)机场三期改扩建综合交通中心配套项目', '7.62亿'], ['山西建投', '大盂产业新城标准化厂房基础设施一期项目', '11.63亿'], ['水控集团', '滹沱河供水工程', '12.80亿'], ['水控集团', '全省县域水网及城乡供水一体化首批项目', '240.00亿'], ['水控集团', '小浪底引黄(灌区、工业及城镇生活供水)工程', '27.30亿'], ['水控集团', '阳泉龙华口调水工程', '20.30亿'], ['水控集团', '万家寨引黄北干支线工程', '15.63亿'], ['水控集团', '万家寨引黄入晋总干线南干线泵站二期扩机项目', '15.00亿'], ['交控集团', '智慧交通山西省实验室项目', '1.20亿'], ['交控集团', '山西隧道与地下工程研究中心项目', '1.50亿'], ['华舰体育', '山西体育职业学院新校区项目', '12.76亿'], ['华舰体育', '屯留沙家庄航空产教融合实训基地项目', '2.08亿'], ['太重集团', '太重智能高端装备产业园区基础设施及厂房配套项目', '55.87亿'], ['交控集团', '山西综改示范区中小企业产业园一期项目', '13.70亿'], ['山西焦煤', '临县三交一号煤矿项目', '80.53亿'], ['山西焦煤', '中阳吴家峁矿井及选煤厂项目', '60.21亿'], ['华阳新材', '华阳云冈千吨级高性能碳纤维一期示范项目', '6.40亿'] ], }, storageRecordConfig2: { header: ['企业集团', '项目名称', '项目阶段', '投资金额'], headerBGC: '#69C0FF20', oddRowBGC: '#011e4800', evenRowBGC: '#69C0FF20', headerHeight: '80', rowNum: 6, // columnWidth: [250], align: ['center', 'center', 'center'], data: dataList2 }, meansList: [ { label: "初步设计", value: "106", }, { label: "详细设计", value: "103", }, { label: "开工", value: "62", }, { label: "竣工", value: "35", }, { label: "验收", value: "42", }, { label: "结算", value: "33", }, ], stockRightList: [ { label: "前期准备", value: "17", }, { label: "变更登记", value: "43", }, ], costList: [ { num: 160, value: 500, status: "正偏差", }, { num: 28, value: 264, status: "容差内", }, { num: 103, value: 182, status: "负偏差", }, ], investData: { investList: [ { name: "大地控股", yse: "189.07", yqhte: "121.59", czrde: "189.07", jse: "121.59", fke: "189.07", url: "./img/logos/logo15.png", }, { name: "云时代", yse: "385.25", yqhte: "224.89", czrde: "385.25", jse: "224.89", fke: "385.25", url: "./img/logos/logo16.png", }, { name: "华舰体育", yse: "82.95", yqhte: "71.34", czrde: "82.95", jse: "71.34", fke: "82.95", url: "./img/logos/logo17.png", }, { name: "神农科技", yse: "26.79", yqhte: "9.64", czrde: "121.59", jse: "120.13", fke: "36.4", url: "./img/logos/logo18.png", }, { name: "山西焦煤", yse: "31.83", yqhte: "25.20", czrde: "31.83", jse: "25.20", fke: "31.83", url: "./img/logos/logo1.png", }, { name: "晋能控股", yse: "26.79", yqhte: "9.64", czrde: "121.59", jse: "120.13", fke: "36.4", url: "./img/logos/logo2.png", }, { name: "华阳新材", yse: "80.01", yqhte: "42.46", czrde: "80.01", jse: "42.46", fke: "80.01", url: "./img/logos/logo3.png", }, { name: "潞安化工", yse: "26.79", yqhte: "9.64", czrde: "121.59", jse: "120.13", fke: "36.4", url: "./img/logos/logo4.png", }, { name: "华新燃气", yse: "97.57", yqhte: "112.67", czrde: "97.57", jse: "112.67", fke: "97.57", url: "./img/logos/logo5.png", }, { name: "太重集团", yse: "26.79", yqhte: "9.64", czrde: "121.59", jse: "120.13", fke: "36.4", url: "./img/logos/logo6.png", }, { name: "国际能源", yse: "46.99", yqhte: "50.89", czrde: "46.99", jse: "50.89", fke: "46.99", url: "./img/logos/logo7.png", }, { name: "华远陆港", yse: "26.79", yqhte: "9.64", czrde: "121.59", jse: "120.13", fke: "36.4", url: "./img/logos/logo8.png", }, { name: "水控集团", yse: "41.09", yqhte: "42.67", czrde: "41.09", jse: "42.67", fke: "41.09", url: "./img/logos/logo9.png", }, { name: "文旅集团", yse: "26.79", yqhte: "9.64", czrde: "121.59", jse: "120.13", fke: "36.4", url: "./img/logos/logo10.png", }, { name: "交控集团", yse: "47.05", yqhte: "23.93", czrde: "47.05", jse: "23.93", fke: "47.05", url: "./img/logos/logo11.png", }, { name: "航产集团", yse: "26.79", yqhte: "9.64", czrde: "121.59", jse: "120.13", fke: "36.4", url: "./img/logos/logo12.png", }, { name: "山西建投", yse: "14.76", yqhte: "5.84", czrde: "14.76", jse: "120.13", fke: "5.84", url: "./img/logos/logo13.png", }, { name: "汾酒集团", yse: "26.79", yqhte: "9.64", czrde: "121.59", jse: "120.13", fke: "36.4", url: "./img/logos/logo14.png", }, ], }, riskData: { x: [ { name: "大地控股", value: [14, 13, 6, 15, 13, 4] }, { name: "云时代", value: [15, 12, 12, 10, 24, 6] }, { name: "华舰体育", value: [14, 13, 6, 15, 13, 4] }, { name: "神农科技", value: [14, 13, 6, 17, 13, 4] }, { name: "山西焦煤", value: [14, 13, 6, 15, 13, 4] }, { name: "晋能控股", value: [14, 13, 6, 17, 13, 4] }, { name: "华阳新材", value: [14, 13, 6, 15, 13, 4] }, { name: "潞安化工", value: [14, 13, 6, 15, 13, 4] }, { name: "华新燃气", value: [14, 13, 6, 17, 13, 4] }, { name: "太重集团", value: [14, 13, 6, 15, 13, 4] }, { name: "国际能源", value: [14, 13, 6, 15, 13, 4] }, { name: "华远陆港", value: [14, 13, 6, 15, 17, 4] }, { name: "水控集团", value: [14, 13, 6, 15, 13, 4] }, { name: "文旅集团", value: [14, 13, 6, 15, 13, 4] }, { name: "交控集团", value: [14, 13, 6, 15, 17, 4] }, { name: "航产集团", value: [14, 13, 6, 15, 13, 4] }, { name: "山西建投", value: [14, 13, 6, 15, 13, 24] }, { name: "汾酒集团", value: [14, 13, 6, 15, 13, 4] }, ], y1: [ 12, 11, 20, 22, 12, 34, 32, 12, 23, 23, 12, 13, 12, 11, 20, 22, 12, 34, ], y2: [ 12, 13, 11, 25, 14, 36, 22, 18, 26, 13, 16, 17, 16, 11, 26, 26, 19, 37, ], y3: [ 16, 21, 29, 24, 22, 45, 23, 23, 33, 34, 23, 43, 20, 10, 20, 20, 23, 45, ], }, inner: 0, innerDeg: 0, timer: null, // 两秒定时器 witchs: 0, topIndex: 0, echartR1Fd1: true, echartR2Fd2: true, echartC1Fd1: true, r3Index: 0, riskData1: { x: ["山西焦煤", "晋能控股", "华阳新材", "潞安化工", "华新燃气", "太重集团", "国际能源", "华远陆港", "水控集团", "文旅集团", "交控集团", '航产集团', '山西建投', '汾酒集团', '大地控股', '云时代', '华舰体育', '神农科技'], y1: [ 36, 37, 38, 39, 40, 41, 42, 43, 44, 45, 46, 47, 48, 49, 50, 51, 52, 53 ], y2: [ 110, 41, 35, 81, 56, 10, 9, 8, 7, 6, 5, 4, 6, 7, 8, 9, 4, 3, ], y3: [ 130, 76, 67, 120, 89, 111, 87, 123, 66, 65, 65, 98, 230, 78, 99, 130, 68, 98, ], y4: [ 90, 50, 50, 50, 50, 51, 52, 53, 54, 55, 56, 57, 58, 59, 51, 52, 53, 54, ], y5: [ 33, 32, 31, 31, 32, 33, 34, 34, 35, 36, 37, 38, 39, 33, 34, 35, 36, 37, ], } }; }, created () { }, beforeDestroy () { clearInterval(this.timer); clearInterval(this.time1); clearInterval(this.time2); }, mounted () { this.getUrlParams() this.countYear() }, methods: { // 计算项目阶段分析对应区间 countSection () { let topList = [] let bottomList = [] this.projecList.forEach(item => { topList.push(item[0].value2) bottomList.push(item[1].value2) }) let minTop = Math.min(...topList) let maxTop = Math.max(...topList) let minTop2 = Math.min(...bottomList) let maxTop2 = Math.max(...bottomList) let res = '' let res2 = '' this.projecList.forEach(item => { res = (Number(item[0].value2) - minTop)/(maxTop - minTop) * 20 + 15 res2 = (Number(item[1].value2) - minTop2)/(maxTop2 - minTop2) * 20 + 50 this.$set(item[0],'top',Math.round(50-res)) this.$set(item[1],'top',Math.round(120-res2)) }) }, // 获取地址栏参数 getUrlParams (id) { let url = window.location.href this.commonUrl = window.location.href.split('/') this.commonUrl.pop() this.commonUrl = this.commonUrl.join('/') // 通过 ? 分割获取后面的参数字符串 let urlStr = url.split('?')[1] if (!urlStr) { this.comeIn() return } // 创建空对象存储参数 let obj = {}; // 再通过 & 将每一个参数单独分割出来 let paramsArr = urlStr.split('&') for (let i = 0, len = paramsArr.length; i < len; i++) { // 再通过 = 将每一个参数分割为 key:value 的形式 let arr = paramsArr[i].split('=') obj[arr[0]] = arr[1]; } if (obj.model) { obj.model == 'A' || obj.model == 'a' ? this.mockData = false : this.mockData = true } obj.env && (this.env = obj.env) this.goUrl = (obj.env == 'SIT' || obj.env == 'sit') ? '172.21.3.68:8081' : (obj.env == 'UAT' || obj.env == 'uat') ? '172.21.3.149:8081' : '172.21.3.242:8081' this.accountId = obj.accountid this.comeIn() }, // 计算展示的年份 countYear () { this.year = new Date().getFullYear() for (i = 2022; true; i++) { if (i == this.year + 3) { this.pollList.push(i) return } else { this.pollList.push(i) } } }, comeIn () { let that = this this.time4s(); this.timeNs(); this.filterLpData(); this.lpRotate(); setTimeout(() => { if (that.mapShow) { that.leftEcharts17Fun() that.leftEcharts12Fun() that.leftEcharts14Fun() that.leftEcharts9Fun() that.leftEcharts15Fun() that.leftEcharts13Fun() that.shanxiEchartsFun() } else { that.chinaEchartsFun() that.leftEcharts16Fun() // 中国地图背景地球 } this.changeTopColor() this.leftEcharts1Fun(); this.leftEcharts2Fun(); this.leftEcharts3Fun(); this.leftEcharts4Fun(); this.leftEcharts5Fun(); this.leftEcharts6Fun(); this.leftEcharts7Fun(); this.leftEcharts8Fun(); this.leftEcharts10Fun(); this.countSection(); // this.leftEcharts11Fun(); this.rightEcharts1Fun(); this.initChartR2(); this.initChartR4(); }); }, // 解决除法是去精度 numDiv (num1, num2) { var baseNum1 = 0, baseNum2 = 0; var baseNum3, baseNum4; try { baseNum1 = num1.toString().split(".")[1].length; } catch (e) { baseNum1 = 0; } try { baseNum2 = num2.toString().split(".")[1].length; } catch (e) { baseNum2 = 0; } with (Math) { baseNum3 = Number(num1.toString().replace(".", "")); baseNum4 = Number(num2.toString().replace(".", "")); return (baseNum3 / baseNum4) * pow(10, baseNum2 - baseNum1); } }, // 解决乘法失去精度 numMulti (num1, num2) { var baseNum = 0; try { baseNum += num1.toString().split(".")[1].length; } catch (e) { } try { baseNum += num2.toString().split(".")[1].length; } catch (e) { } return Number(num1.toString().replace(".", "")) * Number(num2.toString().replace(".", "")) / Math.pow(10, baseNum); }, // 解决减法失去精度 numSub (num1, num2) { var baseNum, baseNum1, baseNum2; var precision;// 精度 try { baseNum1 = num1.toString().split(".")[1].length; } catch (e) { baseNum1 = 0; } try { baseNum2 = num2.toString().split(".")[1].length; } catch (e) { baseNum2 = 0; } baseNum = Math.pow(10, Math.max(baseNum1, baseNum2)); precision = (baseNum1 >= baseNum2) ? baseNum1 : baseNum2; return ((num1 * baseNum - num2 * baseNum) / baseNum).toFixed(precision); }, rightEcharts1Fun () { let that = this let sumA = 42 // 所有在100范围外的全部变成0,其他值相应增加/减少sumA right5.forEach(item => { item.forEach(item2 => { if (Number(item2[1]) < 0) { item2[1] = that.$set(item2, 1, Number(that.numSub(item2[1], sumA))) } else if (Number(item2[1]) > 0) { item2[1] = that.$set(item2, 1, Number(item2[1]) + sumA) } if (Number(item2[1]) < (-100 - sumA)) { item2[1] = that.$set(item2, 1, 0) item2[1] = that.$set(item2, 2, 0) } else if (Number(item2[1]) > (100 + sumA)) { item2[1] = that.$set(item2, 1, 0) item2[1] = that.$set(item2, 2, 0) } }) }) const itemStyle = { // opacity: 0.8, shadowBlur: 10, shadowOffsetX: 0, shadowOffsetY: 0, shadowColor: 'rgba(0,0,0,0.3)' }; that.rightEcharts1 = echarts.init(this.$refs['rightEcharts1']) that.rightEcharts1.on('showTip', (params) => { // 如果是7或者15并且满足防抖则切换 if ((params.dataIndex == 5 || params.dataIndex == 11) && that.echartR2Fd) { that.echartR2Fd = false setTimeout(() => { option.dataZoom[0].endValue = option.dataZoom[0].endValue + 6 option.dataZoom[0].startValue = option.dataZoom[0].startValue + 6 that.rightEcharts1.setOption(option); // 防止勿刷新做的防抖 setTimeout(() => { that.echartR2Fd = true }, 2000) }, 1900); // 如果是17表示到了最后一个,那么重新来一遍 } else if (params.dataIndex == 17 && that.echartR2Fd) { that.echartR2Fd = false setTimeout(() => { option.dataZoom[0].endValue = 0 option.dataZoom[0].startValue = 5 that.rightEcharts1.setOption(option); // 防止勿刷新做的防抖 setTimeout(() => { that.echartR2Fd = true }, 2000) }, 1900) } }) let option = { color: [{ type: 'radial', // linear 线性渐变 radial径向渐变 x: 0.5, y: 0.5, r: 0.5, colorStops: [{ offset: 0, color: '#58F7DF' // 0% 处的颜色 }, { offset: 1, color: '#4ECFBB' // 100% 处的颜色 }] }, { type: 'radial', // linear 线性渐变 radial径向渐变 x: 0.5, y: 0.5, r: 0.5, colorStops: [{ offset: 0, color: '#7FD9FF' // 0% 处的颜色 }, { offset: 1, color: '#40A9FF' // 100% 处的颜色 }] }, { type: 'radial', // linear 线性渐变 radial径向渐变 x: 0.5, y: 0.5, r: 0.5, colorStops: [{ offset: 0, color: '#FF9592' // 0% 处的颜色 }, { offset: 1, color: '#D2706D' // 100% 处的颜色 }] } ], dataZoom: [ { // start: 9,//默认为@ // end: 100,//黑认认为1@0 type: "slider", show: false, // xAxisIndex: [0] handlesize: 0,//滑动条的 左右2个滑动条的大小 startValue: 5,// 初始显示值 endValue: 0,// 结束显示值 height: 10,//组件高度 left: "5%", right: "4%",//右边的距离 bottom: "25%",//底边的距离 borderColor: "#939", fillerColor: "#269cdb", borderRadius: 5, backgroundColor: "#33384b",//两边未选中的滑动条区域的额色 showDataShadow: false,//是否显示数据阴影 showDetail: false,//即拖拽时候是否显示详细数值信息 truerealtime: true,//是否实时更新 filterMode: "filter" }, { type: 'inside', show: true, start: 1, end: 100, zoomOnMouseWheel: false, //滚轮是否触发缩放 moveOnMouseMove: false, //鼠标滚轮触发滚动 } ], legend: { selectedMode: false, top: 10, data: ['正偏差', '容差', '负偏差'], textStyle: { fontSize: 20, color: '#fff', fontFamily: 'Microsoft YaHei' } }, textStyle: { color: '#fff', }, tooltip: { show: true, trigger: "axis", backgroundColor: "rgba(50,50,50,0.7)", // 提示框浮层的背景颜色 borderColor: "rgba(50,50,50,0.7)", textStyle: { color: "#fff", fontStyle: "normal", // 文字字体的风格('normal',无样式;'italic',斜体;'oblique',倾斜字体) fontWeight: "normal", // 文字字体的粗细('normal',无样式;'bold',加粗;'bolder',加粗的基础上再加粗;'lighter',变细;数字定义粗细也可以,取值范围100至700) fontSize: "28", // 文字字体大小 }, formatter: data => { return `${data[0].value[0]}
${data[0].seriesName}:${that.numFormat(data[0].data[2])}亿
${data[1].seriesName}:${that.numFormat(data[1].data[2])}亿
${data[2].seriesName}:${that.numFormat(data[2].data[2])}亿` }, axisPointer: { // // type: 'cross',', }, }, grid: { top: '10%', right: '7%', left: '7%', bottom: '5%', }, yAxis: { min: (-101 - sumA), max: (101 + sumA), maxInterval: 1, splitLine: { show: false, // interval:, lineStyle: { color: '#68b4dd66', type: 'dashed', }, }, axisLine: { show: false }, axisTick: { show: false }, axisLabel: { show: true, // formatter: '{value}', formatter (data) { if (data == (100 + sumA)) { return '100%' } else if (data == (-100 - sumA)) { return '-100%' } else if (data == (-5 - sumA)) { return '-5%' } else if (data == (5 + sumA)) { return '5%' } }, textStyle: { color: '#fff', fontSize: '20', fontFamily: 'Microsoft YaHei' }, }, nameTextStyle: { color: '#fff', fontSize: 20, fontFamily: 'Microsoft YaHei' }, }, xAxis: { data: commonCompany, axisLine: { show: false, //隐藏X轴轴线 lineStyle: { color: '#005094', width: 1, }, }, splitLine: { show: true, lineStyle: { color: '#68b4dd66', type: 'dashed', }, }, axisTick: { show: true, //隐藏X轴刻度 }, axisLabel: { show: true, // rotate: 40, padding: [0, 0, 0, 0], textStyle: { color: '#fff', //X轴文字颜色 fontSize: 20, fontFamily: 'Microsoft YaHei' }, }, }, series: [ { name: '正偏差', type: 'scatter', itemStyle: itemStyle, data: right5[0], symbolSize: function (data) { if ((data[2] > 0 && data[2] < 50) || data[2] == 50) { return 40; } else if ((data[2] > 50 && data[2] < 100) || data[2] == 100) { return 70; } else if (data[2] > 100) { return 100; } }, markLine: { symbol: 'none', data: [ { name: '100%', yAxis: 100 + sumA, lineStyle: { // color: '#fff', }, label: { show: false, formatter: '{b}', position: 'right', color: '#fff', fontSize: 20, label: { show: false } }, }, { name: '5%', yAxis: 5 + sumA, lineStyle: { // color: '#fff', }, label: { show: false, formatter: '{b}', position: 'right', color: '#fff', fontSize: 20, }, }, { name: '-5%', yAxis: -5 - sumA, lineStyle: { // color: '#fff', }, label: { show: false, formatter: '{b}', position: 'right', color: '#fff', fontSize: 20, }, }, { name: '100%', yAxis: -100 - sumA, lineStyle: { // color: '#fff', }, label: { show: false, formatter: '{b}', position: 'right', color: '#fff', fontSize: 20, }, }, ], }, }, { name: '容差', type: 'scatter', itemStyle: itemStyle, data: right5[1], symbolSize: function (data) { if ((data[2] > 0 && data[2] < 50) || data[2] == 50) { return 40; } else if ((data[2] > 50 && data[2] < 100) || data[2] == 100) { return 70; } else if (data[2] > 100) { return 100; } }, }, { name: '负偏差', type: 'scatter', itemStyle: itemStyle, data: right5[2], symbolSize: function (data) { if ((data[2] > 0 && data[2] < 50) || data[2] == 50) { return 40; } else if ((data[2] > 50 && data[2] < 100) || data[2] == 100) { return 70; } else if (data[2] > 100) { return 100; } }, } ] } that.rightEcharts1.setOption(option) tools.loopShowTooltip(that.rightEcharts1, option, { interval: 2000, loopSeries: true, }) }, initChartR2 () { let that = this; that.right1Chart = echarts.init(this.$refs["echartR2"]); that.right1Chart.on("showTip", (params) => { // 如果是7或者15并且满足防抖则切换 if ( (params.dataIndex == 5 || params.dataIndex == 11) && that.echartR1Fd1 ) { that.echartR1Fd1 = false; setTimeout(() => { option.dataZoom[0].endValue = option.dataZoom[0].endValue + 6; option.dataZoom[0].startValue = option.dataZoom[0].startValue + 6; that.right1Chart.setOption(option); // 防止勿刷新做的防抖 setTimeout(() => { that.echartR1Fd1 = true; }, 2000); }, 1900); // 如果是17表示到了最后一个,那么重新来一遍 } else if (params.dataIndex == 17 && that.echartR1Fd1) { that.echartR1Fd1 = false; setTimeout(() => { option.dataZoom[0].endValue = 0; option.dataZoom[0].startValue = 5; that.right1Chart.setOption(option); // 防止勿刷新做的防抖 setTimeout(() => { that.echartR1Fd1 = true; }, 2000); }, 1900); } }); let option = { color: [ { type: "linear", x: 0, y: 0, x2: 0, y2: 1, colorStops: [ { offset: 0, color: "#07806E", // 0% 处的颜色 }, { offset: 1, color: "#79FFEB", // 100% 处的颜色 }, ], global: false, // 缺省为 false }, { type: "linear", x: 0, y: 0, x2: 0, y2: 1, colorStops: [ { offset: 0, color: "#9F7F00", // 0% 处的颜色 }, { offset: 1, color: "#FBE463", // 100% 处的颜色 }, ], global: false, // 缺省为 false }, { type: "linear", x: 0, y: 0, x2: 0, y2: 1, colorStops: [ { offset: 0, color: "#91231F", // 0% 处的颜色 }, { offset: 1, color: "#F98784", // 100% 处的颜色 }, ], global: false, // 缺省为 false } ], dataZoom: [ { // start: 9,//默认为@ // end: 100,//黑认认为1@0 type: "slider", show: false, // xAxisIndex: [0] handlesize: 0, //滑动条的 左右2个滑动条的大小 startValue: 5, // 初始显示值 endValue: 0, // 结束显示值 height: 10, //组件高度 left: "5%", right: "4%", //右边的距离 bottom: "25%", //底边的距离 borderColor: "#939", fillerColor: "#269cdb", borderRadius: 5, backgroundColor: "#33384b", //两边未选中的滑动条区域的额色 showDataShadow: false, //是否显示数据阴影 showDetail: false, //即拖拽时候是否显示详细数值信息 truerealtime: true, //是否实时更新 filterMode: "filter", }, { type: "inside", show: true, start: 1, end: 100, zoomOnMouseWheel: false, //滚轮是否触发缩放 moveOnMouseMove: false, //鼠标滚轮触发滚动 }, ], legend: { top: 10, right: 10, textStyle: { fontSize: 20, color: "#fff", fontFamily: "Microsoft YaHei", }, itemStyle: { borderCap: "round", }, }, tooltip: { trigger: "item", show: true, position: "top", backgroundColor: "rgba(50,50,50,0.7)", // 提示框浮层的背景颜色 backgroundColor: "rgba(50,50,50,0.7)", // 提示框浮层的背景颜色 borderColor: "rgba(50,50,50,0.7)", textStyle: { color: "#fff", fontStyle: "normal", // 文字字体的风格('normal',无样式;'italic',斜体;'oblique',倾斜字体) fontWeight: "normal", // 文字字体的粗细('normal',无样式;'bold',加粗;'bolder',加粗的基础上再加粗;'lighter',变细;数字定义粗细也可以,取值范围100至700) fontSize: "28", // 文字字体大小 }, formatter: function (p) { that.r3Index = p.dataIndex; if (Math.max(...that.riskData.x[p.dataIndex].value) > 15) { that.radarNum = 3 } else { that.radarNum = 2 } that.echartR3 && that.echartR3.dispose() that.initChartR3(); return `${p.name}
低风险:${that.riskData.y1[p.dataIndex]}个
中风险:${that.riskData.y2[p.dataIndex]}个
高风险:${that.riskData.y3[p.dataIndex]}个
` }, }, grid: { left: "3%", right: "4%", bottom: "3%", containLabel: true, }, xAxis: [ { type: "category", data: that.riskData.x.map((item) => item.name), axisLine: { show: true, lineStyle: { color: "rgba(0, 80, 148, .8)", }, }, axisTick: { show: false, }, axisLabel: { color: "#fff", rotate: 20, fontSize: 22, }, }, ], yAxis: [ { type: "value", axisLabel: { color: "#fff", fontSize: 22, }, splitLine: { show: true, lineStyle: { color: "rgba(104, 180, 221, .2)", type: "dashed", }, }, }, ], series: [ { name: "低风险", type: "bar", stack: "Ad", barWidth: 14, emphasis: { focus: "series", }, itemStyle: { barBorderRadius: [15, 15, 15, 15], }, data: that.riskData.y1, }, { name: "中风险", type: "bar", barWidth: 14, stack: "Ad", itemStyle: { barBorderRadius: [15, 15, 15, 15], }, emphasis: { focus: "series", }, data: that.riskData.y2, }, { name: "高风险", type: "bar", barWidth: 14, stack: "Ad", itemStyle: { barBorderRadius: [15, 15, 15, 15], }, emphasis: { focus: "series", }, data: that.riskData.y3, }, ], }; that.right1Chart.setOption(option); tools.loopShowTooltip(that.right1Chart, option, { interval: 2000, loopSeries: true, }); }, initChartR3 () { let that = this; that.right3Chart = echarts.init(this.$refs["echartR3"]); let option = { radar: { // shape: 'circle', splitNumber: that.radarNum, splitLine: { lineStyle: { color: that.radarNum == 3 ? ["#C25253", "#45C9B5", "#D1B83A"] : ["#D1B83A", "#45C9B5"], }, }, name: { //修改indicator文字的颜色 textStyle: { fontSize: 20 } }, axisLine: { // 设置雷达图中间射线的颜色 lineStyle: { color: '#fff', }, }, splitArea: { areaStyle: { color: that.radarNum == 3 ? [ "rgba(88,247,223,0.2)", "rgba(255, 224, 54, 0.2)", "rgba(221,89,85,0.3)", ] : [ "rgba(88,247,223,0.2)", "rgba(255, 224, 54, 0.2)", ], }, }, indicator: [ { name: "安全风险", max: that.radarNum == 3 ? 25 : 15 }, { name: "付款风险", max: that.radarNum == 3 ? 25 : 15 }, { name: "合同风险", max: that.radarNum == 3 ? 25 : 15 }, { name: "结算风险", max: that.radarNum == 3 ? 25 : 15 }, { name: "进度风险", max: that.radarNum == 3 ? 25 : 15 }, { name: "质量风险", max: that.radarNum == 3 ? 25 : 15 }, ], }, series: [ { name: "风险", type: "radar", symbol: "circle", label: { show: true, formatter: function (params) { return params.value; }, fontSize: 24, color: "#68BDFF", }, data: [ { value: that.riskData.x[that.r3Index].value, areaStyle: { color: "#112b75", }, lineStyle: { width: 4, color: "#60C1FF", }, label: { fontSize: 22, }, }, ], }, ], }; that.right3Chart.setOption(option); }, initChartR4 () { let that = this; that.right4Chart = echarts.init(this.$refs["echartR4"]); that.right4Chart.on("showTip", (params) => { // 如果是7或者15并且满足防抖则切换 if ( (params.dataIndex == 5 || params.dataIndex == 11) && that.echartR2Fd2 ) { that.echartR2Fd2 = false; setTimeout(() => { option.dataZoom[0].endValue = option.dataZoom[0].endValue + 6; option.dataZoom[0].startValue = option.dataZoom[0].startValue + 6; that.right4Chart.setOption(option); // 防止勿刷新做的防抖 setTimeout(() => { that.echartR2Fd2 = true; }, 2000); }, 1900); // 如果是17表示到了最后一个,那么重新来一遍 } else if (params.dataIndex == 17 && that.echartR2Fd2) { that.echartR2Fd2 = false; setTimeout(() => { option.dataZoom[0].endValue = 0; option.dataZoom[0].startValue = 5; that.right4Chart.setOption(option); // 防止勿刷新做的防抖 setTimeout(() => { that.echartR2Fd2 = true; }, 2000); }, 1900); } }); let option = { dataZoom: [ { // start: 9,//默认为@ // end: 100,//黑认认为1@0 type: "slider", show: false, // xAxisIndex: [0] handlesize: 0, //滑动条的 左右2个滑动条的大小 startValue: 5, // 初始显示值 endValue: 0, // 结束显示值 height: 10, //组件高度 left: "5%", right: "4%", //右边的距离 bottom: "25%", //底边的距离 borderColor: "#939", fillerColor: "#269cdb", borderRadius: 5, backgroundColor: "#33384b", //两边未选中的滑动条区域的额色 showDataShadow: false, //是否显示数据阴影 showDetail: false, //即拖拽时候是否显示详细数值信息 truerealtime: true, //是否实时更新 filterMode: "filter", }, { type: "inside", show: true, start: 1, end: 100, zoomOnMouseWheel: false, //滚轮是否触发缩放 moveOnMouseMove: false, //鼠标滚轮触发滚动 }, ], title: { text: "企业后评价执行情况", left: "center", textStyle: { color: "#fff", fontSize: 32, }, }, tooltip: { trigger: "item", show: true, position: "top", backgroundColor: "rgba(50,50,50,0.7)", // 提示框浮层的背景颜色 borderColor: "rgba(50,50,50,0.7)", confine: true, textStyle: { color: "#fff", fontStyle: "normal", // 文字字体的风格('normal',无样式;'italic',斜体;'oblique',倾斜字体) fontWeight: "normal", // 文字字体的粗细('normal',无样式;'bold',加粗;'bolder',加粗的基础上再加粗;'lighter',变细;数字定义粗细也可以,取值范围100至700) fontSize: "28", // 文字字体大小 }, formatter: function (p) { return `${p.name}
首次评价:应开展${that.riskData1.y1[p.dataIndex]}个,已完成${that.riskData1.y2[p.dataIndex]}个
再次评价:应开展${that.riskData1.y3[p.dataIndex]}个,已完成${that.riskData1.y4[p.dataIndex]}个,达标${that.riskData1.y5[p.dataIndex]}个` }, }, legend: { show: true, textStyle: { fontSize: 20, color: "#fff", }, inactiveColor: "#fff", // itemHeight: 20, top: "15%", backgroundColor: "transparent", data: [ { name: "应首评项目数", // icon: "image://data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAUCAYAAAC58NwRAAAAAXNSR0IArs4c6QAAAWdJREFUOE+N0k8og3EYB/Dvs8P8CSlTxJGD8u+yTYmNm0gJQznIQRxMoV2cXWSKCznIQdk7SkmOEomNg41y4EjURkLZFI/ed3vX+5v82nt4357n9/s8Pe/v9xCST6+fzVHGKAMDAKqT6WsCNi2ElS0Xfak5Ul+tfi77YewBqNcLpH0vTYSOAxc9kFo5wghINus2lJMPOzl8PE6EpX8qC2lmuMmp8CmABn3FVgJ4bIloLggEnwRzRg6F4wSY9fR2J1CUnYieY0DPrgDiUvASA7pF8PGnJXsp4LEC3wx4L4DAY1pLLQq7GVjM5KcJmKC2fc76fNeOtU6GmBDOzYMt04sLmQjt2sUZRyMCjAEYBKNKyxNuAGwUA8vCaBhbcSrMxviwj1JFU7Nk3NC49iqAk+FCObAu3AngfLJCDmpmjgVwNdskB5UjPgHcrvbLQXmXVwD3O1NyYGmeFkD0aF4OCmqHBPAWXhfAL4WqeuKVsFKCAAAAAElFTkSuQmCC", }, { name: "已完成首评项目数", // icon: "image://data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAUCAYAAAC58NwRAAAAAXNSR0IArs4c6QAAAXFJREFUOE+V0kFLAkEUB/D/G9eW3UN1sFPYNaJAu2R0Coog8mq0fQH1kEVBhz5Ah6CoLhrdE/LqKQo6VZ7SKCKChKRTBRmhbq47oabsZC22h1nem/k93jCP8P0F+E2HQ1dD4NAAGqqn+TUI8YpciCVo8LOaoeoSKOR6GTOSxOFtFLD+OSFtmpI/obqfqFqZ6Wrqr8NNyJHJK4aPtNLDAue0+1vlnzkiHqG5YvYcwGhj08MUhJyuWhgrvyBjFq3uogp0AB2NbFR2o5sctfCNVxDWc1ag/xPQR0tLXqYg6HTBBMd++RXplpZK2Qg4dtq5NAiLNM3v5a6ilALBY4s4rvKKMdLWw4EjU4E0U3s462gwXQ3DMLeJsfpgmCYgsSVTLkSF0bC24r9NcWucHPA1izZnyXpg8vRIAMfjU/ZgLH4ogDNt1h4Mb8YEcLkSsgf9y+sCuNtaswd92qoAHuMb9qBnIiiA55M9e9DpnRfAe/pAAF9gqJXUYWdYUwAAAABJRU5ErkJggg==", }, { name: "应再评项目数", // icon: "image://data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAUCAYAAAC58NwRAAAAAXNSR0IArs4c6QAAAV5JREFUOE+V0j8oxGEYwPHvo/wMjgyUslAWcTFhMRiEsHLKYDzFKZRBSskgR7mUG29QjpX86QaDwdlwLotiUYpB/gyHPDru9HsPP+c3vL+e530/T8/b+wipb31KrYJ8vAi9QE0qfYqy+vBEsHtKnpM5SS4bC1qW+8amQl26gP0vcPSSQ2fXiFxJsnKhi8PfDtvgsVo0yJZfhwQCP1XOzCn4ZNuvB0BjerO4HNxtn1FsB24vDRZNggRgpdPNXsjL/4wST7AXNEDiv+DxW0slFVDTCvoG8QjcXGS2NKc+hMVsLo0yLFsBzZNnDoHaP9CJWtRn9XDA8WsOHR8PZx+NQhcDqvQhVH3klTMRVu4fWTZGw97Ktl/VHrePyVfRr1myHwhP3xnAM1nkDJbGzw0wOFvpDCa8+waYCTY5g/6esAFCax5n0NI6b4DI7qgzcDeOGSAW9TuD0up+A1zHQwZ4B2JrgI9r4uMDAAAAAElFTkSuQmCC", }, { name: "已完成再评项目数", // icon: "image://data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAUCAYAAAC58NwRAAAAAXNSR0IArs4c6QAAAWBJREFUOE9jZICC/1e12Rh4uDIY/jNGMjAw6ECFrzAw/l/O8OXbDEbtq79AYowg4v9jS2mGv3+3MDAwGMAMQKMvMDAz+zDKHn/KCDaZm/skHsUwvRcZfr8zZ/z/0CyX4T/DJBwmowozMuQx/n9gdpyBgcECLsNpycAgXAPhvm1hYPgOkoaDEyANPxkYGNjgQjJbGRiYRSDcv28YGJ54I2v4SUDDWwaGJ17IGr5gcZIV1El/GRjetjMwfD+G5qSHpnkM/xknEufp//mM/2+rsDOwCoGCVZ+ApksMv9+ZERtxFxmYmb3BEYeaNHgyGf7/j2FgYNCEil9nYGRcwvDly3SUpIHslP8PzP4j8xkVTsENhaclZAWvLligaBAzOIFfw9ld1igajN2O4tewar49ioawxIP4NbQ0OqNoqKnfi19DXIoHioZFc3bg12Dt6YOi4ej2Lfg1yBn7o2h4dHYjigYAb0t88hVwEBYAAAAASUVORK5CYII=", }, { name: "再评达标项目数", // icon: "image://data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAUCAYAAAC58NwRAAAAAXNSR0IArs4c6QAAAWBJREFUOE+V0k8og2EcwPHvkzVZLLm6KItEzWlclIPbdhGKcsCJwzZFdtgOK+8OimIXTjgoSrisXByUgz8nE4mmXFwlZmuaPXr3r/eZ9sZ7eN9+v/f5/J6n3/MTFJ9wWFpTFqYFjAFdxfSthF1blo1wWHzpOaG/gppszkIM6C4VqPheW8ATCYkXoVdOW7g0WVyy8ZSdHhFYlF4E0SqV1bTEJwKaPAd6S3/aWmHEU4j2Y/D4pJgLHWQAaykd9ENDfSH6SEJkTQGZ/4LkryO1O2DYDbkcHB7DQ6LiSAua9AlQN67SAQl+4Y3KWtt7vq1Os04JuPm04/rrxcUt4M5fnHE00jXMIBgHOor5eyQ7dd+sK6NhPEpAk9IYL4VEuWh5lowLfKE3BUS1RnMwOZtQwNaqwxwMTp0p4Gizzxz0D+0p4PRg1Bw4B1YUED+ZMwctrnkFPF8tm4OmzgkFvN5tK+AHKZh4TU8krdoAAAAASUVORK5CYII=", }, ], }, grid: { top: "30%", left: "3%", right: "4%", bottom: "3%", containLabel: true, }, xAxis: { data: that.riskData1.x, type: "category", splitLine: { show: false, }, alignTicks: true, axisLine: { show: true, lineStyle: { color: "rgba(0, 80, 148, .8)", }, }, axisTick: { show: false, }, axisLabel: { color: "#fff", fontSize: 22, rotate: 20, }, }, yAxis: { type: "value", splitLine: { show: true, lineStyle: { color: "rgba(104, 180, 221, .2)", type: "dashed", }, }, axisLine: { show: false, }, axisTick: { show: false, }, axisLabel: { color: "#fff", fontSize: 22, }, }, series: [ { type: "bar", name: "应首评项目数", barWidth: 10, // barGap: "600%", data: that.riskData1.y1, // label: { // show: true, // position: "top", // formatter: " ", // width: 6, // height: 6, // borderRadius: 50, // borderWidth: 6, // borderColor: "#40A9FF", // backgroundColor: "#fff", // }, itemStyle: { color: { x: 0, y: 0, x2: 0, y2: 1, colorStops: [ { offset: 0, color: "#40A9FF", // 0% 处的颜色 }, { offset: 1, color: "#092351", // 100% 处的颜色 }, ], }, }, }, { type: "bar", name: "已完成首评项目数", // barGap: "600%", barWidth: 10, data: that.riskData1.y2, // label: { // show: true, // position: "top", // formatter: " ", // width: 6, // height: 6, // borderRadius: 50, // borderWidth: 6, // borderColor: "#58F7DF", // backgroundColor: "#fff", // }, itemStyle: { color: { x: 0, y: 0, x2: 0, y2: 1, colorStops: [ { offset: 0, color: "#58F7DF", // 0% 处的颜色 }, { offset: 1, color: "#092351", // 100% 处的颜色 }, ], }, }, }, { type: "bar", name: "应再评项目数", // barGap: "600%", barWidth: 10, data: that.riskData1.y3, // label: { // show: true, // position: "top", // formatter: " ", // width: 6, // height: 6, // borderRadius: 50, // borderWidth: 6, // borderColor: "#B78CFF", // backgroundColor: "#fff", // }, itemStyle: { color: { x: 0, y: 0, x2: 0, y2: 1, colorStops: [ { offset: 0, color: "#B78CFF", // 0% 处的颜色 }, { offset: 1, color: "#092351", // 100% 处的颜色 }, ], }, }, }, { type: "bar", name: "已完成再评项目数", // barGap: "600%", barWidth: 10, data: that.riskData1.y4, // label: { // show: true, // position: "top", // formatter: " ", // width: 6, // height: 6, // borderRadius: 50, // borderWidth: 6, // borderColor: "#FFE036", // backgroundColor: "#fff", // }, itemStyle: { color: { x: 0, y: 0, x2: 0, y2: 1, colorStops: [ { offset: 0, color: "#FFE036", // 0% 处的颜色 }, { offset: 1, color: "#092351", // 100% 处的颜色 }, ], }, }, }, { type: "bar", name: "再评达标项目数", // barGap: "600%", barWidth: 10, data: that.riskData1.y5, // label: { // show: true, // position: "top", // formatter: " ", // width: 6, // height: 6, // borderRadius: 50, // borderWidth: 6, // borderColor: "#7784FF", // backgroundColor: "#fff", // }, itemStyle: { color: { x: 0, y: 0, x2: 0, y2: 1, colorStops: [ { offset: 0, color: "#7784FF", // 0% 处的颜色 }, { offset: 1, color: "#092351", // 100% 处的颜色 }, ], }, }, }, ], }; that.right4Chart.setOption(option); tools.loopShowTooltip(that.right4Chart, option, { interval: 2000, loopSeries: true, }); }, clickItem (index) { const angle = 360 / this.investData.investList.length; this.witchs = index; this.inner = index; this.innerDeg = this.witchs * angle; this.lpRotate(); }, lpRotate () { const angle = 360 / this.investData.investList.length; clearInterval(this.timer); this.timer = setInterval(() => { this.inner++; this.topIndex++; this.topIndex = this.topIndex % 8; this.witchs = this.inner % this.investData.investList.length; this.innerDeg = this.inner * angle; // 项目阶段分析弹窗 if (this.projectNum < 7) { this.projectNum = this.projectNum + 1 } else { this.projectNum = 0 } }, 2000); }, // 转盘计算角度 filterLpData () { const angle = 360 / this.investData.investList.length; for (let i in this.investData.investList) { this.investData.investList[i].deg = i * angle; this.$set(this.investData.investList, i, { ...this.investData.investList[i], deg: i * angle, }); } }, // 4秒定时器 time4s () { let that = this; // 4秒定时器 this.time1 = setInterval(() => { that.industryProportion == 1 ? (that.industryProportion = 2) : (that.industryProportion = 1); that.leftEcharts1.dispose(); that.leftEcharts2.dispose(); that.leftEcharts3.dispose(); that.leftEcharts4.dispose(); that.leftEcharts1Fun(); that.leftEcharts2Fun(); that.leftEcharts3Fun(); that.leftEcharts4Fun(); }, 4000); }, // 针对投前产业布局分析的定时器 timeNs () { let that = this; this.time2 = setInterval(() => { if (that.industryLayout < 3) { that.industryLayout = that.industryLayout + 1; } else { that.industryLayout = 0; } this.time2 && clearInterval(this.time2); this.timeNs(); that.leftEcharts5.dispose(); that.leftEcharts5Fun(); }, left1[that.industryLayout].length * 2000); }, // 主辅业占比点击方法 industryProportionChange (e) { let that = this; this.industryProportion = e; this.time1 && clearInterval(this.time1); that.leftEcharts1.dispose(); that.leftEcharts2.dispose(); that.leftEcharts3.dispose(); that.leftEcharts4.dispose(); that.leftEcharts1Fun(); that.leftEcharts2Fun(); that.leftEcharts3Fun(); that.leftEcharts4Fun(); this.time4s(); }, // 产业布局分析点击方法 industryLayoutChange (e) { this.industryLayout = e; this.time2 && clearInterval(this.time2); this.leftEcharts5.dispose(); this.timeNs(); this.leftEcharts5Fun(); }, yuanChange (value) { return Number((value / 100000000).toFixed(2)); }, // 逢三折断 numFormat (value) { if (!value) return "0"; // var intPart = Number(value).toFixed(0) // 获取整数部分 var intPart = parseInt(value); // 获取整数部分 var intPartFormat = intPart .toString() .replace(/(\d)(?=(?:\d{3})+$)/g, "$1,"); // 将整数部分逢三一断 var floatPart = ".00"; // 预定义小数部分 var value2Array = value.toString().split("."); // =2表示数据有小数位 if (value2Array.length === 2) { floatPart = value2Array[1].toString(); // 拿到小数部分 if (floatPart.length === 1) { // 补0 return intPartFormat + "." + floatPart + "0"; } else { floatPart = floatPart.slice(0, 2); return intPartFormat + "." + floatPart; } } else { return intPartFormat; } }, leftEcharts1Fun () { let that = this; this.leftEcharts1 = echarts.init(this.$refs["leftEcharts1"]); option = { title: { text: that.industryProportion == 1 ? "94.4%" : "46.62%", x: "center", y: "center", textStyle: { fontWeight: "normal", color: "#68BDFF", fontSize: "20", }, }, color: ["#68BDFF", "#254F7F"], series: [ { name: "Line 1", type: "pie", clockWise: true, radius: ["80%", "100%"], itemStyle: { normal: { label: { show: false, }, labelLine: { show: false, }, }, }, hoverAnimation: false, data: [ { value: 80, name: "01", itemStyle: { normal: { label: { show: false, }, labelLine: { show: false, }, }, }, }, { name: "02", value: 20, }, ], }, ], }; //轮播 // tools.loopShowTooltip(leftEcharts1, option, { // interval: 2000, // loopSeries: true, // }); //注册 that.leftEcharts1.setOption(option); }, leftEcharts2Fun () { let that = this; this.leftEcharts2 = echarts.init(this.$refs["leftEcharts2"]); let nameList = ["a"]; let valueList = that.industryProportion == 1 ? [1287.5] : [635.84]; let total = 1363.88; // 数据总数 var category = nameList.map((item, index) => { return { value: valueList[index], itemStyle: { color: new echarts.graphic.LinearGradient( 1, 0, 0, 1, [ { offset: 0, color: "#40A9FF50", }, { offset: 1, color: "#40A9FF", }, ], false ), }, }; }); var totalList = []; var totalBorderList = []; nameList.map((item, index) => { totalList.push({ value: total, itemStyle: { color: "rgba(51, 147, 236, 0.29)", }, }); totalBorderList.push({ value: total, itemStyle: { borderColor: "rgba(51, 147, 236, 0.29)", color: "transparent", }, }); }); var datas = []; category.forEach((value) => { datas.push(value.value); }); option = { // backgroundColor: 'rgb(231,238,249)', xAxis: { max: total, splitLine: { show: false, }, axisLine: { show: false, }, axisLabel: { show: false, }, axisTick: { show: false, }, }, grid: { left: "0%", top: "15%", // 设置条形图的边距 right: "15%", bottom: "5%", }, yAxis: [ { type: "category", inverse: false, data: nameList, axisLine: { show: false, }, axisTick: { show: false, }, axisLabel: { show: false, }, }, ], series: [ { // 内 type: "bar", barWidth: 16, barGap: "20%", silent: true, // label: { // normal: { // formatter: (item) => { // return `${item['name']}:${item['value']} `; // }, // textStyle: { // color: 'rgba(105, 120, 136, 1)', // fontSize: 14, // }, // position: [0, '-25px'], // show: true, // }, // }, data: category, z: 1, itemStyle: { normal: { color: new echarts.graphic.LinearGradient( 1, 0, 0, 1, [ { offset: 0, color: "rgba(81, 193, 156, 1)", }, { offset: 1, color: "rgba(234, 177, 100, 1)", }, ], false ), }, }, animationEasing: "elasticOut", }, { // 分隔 type: "pictorialBar", itemStyle: { normal: { color: "#143362", }, }, symbolRepeat: "fixed", symbolMargin: 8, symbol: "rect", symbolClip: false, symbolSize: [4, 20], symbolPosition: "start", symbolOffset: [0, -2], symbolBoundingData: total, data: [total, total, total, total], z: 2, animationEasing: "elasticOut", }, { // label type: "pictorialBar", symbolBoundingData: total, itemStyle: { normal: { color: "none", }, }, label: { normal: { formatter: (params) => { var text; text = `${((params["data"] * 100) / total).toFixed(2)}亿`; return text; }, textStyle: { // 图列内容样式 fontSize: "20", fontWeight: 800, }, position: "right", offset: [0, -3], distance: 10, // 向右偏移位置 show: true, color: "#68BDFF", }, }, data: datas, z: 0, }, { name: "外框", type: "bar", barGap: "-130%", // 设置外框粗细 data: totalBorderList, barWidth: 26, itemStyle: { normal: { // barBorderRadius: [5, 5, 5, 5], borderWidth: 1, // 边框宽度 borderColor: "rgb(51, 147, 236)", // 边框色 color: "rgb(231,238,249)", }, }, z: 0, }, ], }; //轮播 // tools.loopShowTooltip(leftEcharts1, option, { // interval: 2000, // loopSeries: true, // }); //注册 that.leftEcharts2.setOption(option); }, leftEcharts3Fun () { let that = this; this.leftEcharts3 = echarts.init(this.$refs["leftEcharts3"]); option = { title: { text: that.industryProportion == 1 ? "5.6%" : "53.38%", x: "center", y: "center", textStyle: { fontWeight: "normal", color: "#68BDFF", fontSize: "20", }, }, color: ["#5BDCC8", "#254F7F"], series: [ { name: "Line 1", type: "pie", clockWise: true, radius: ["80%", "100%"], itemStyle: { normal: { label: { show: false, }, labelLine: { show: false, }, }, }, hoverAnimation: false, data: [ { value: 80, name: "01", itemStyle: { normal: { label: { show: false, }, labelLine: { show: false, }, }, }, }, { name: "02", value: 20, }, ], }, ], }; //轮播 // tools.loopShowTooltip(leftEcharts1, option, { // interval: 2000, // loopSeries: true, // }); //注册 that.leftEcharts3.setOption(option); }, leftEcharts4Fun () { let that = this; this.leftEcharts4 = echarts.init(this.$refs["leftEcharts4"]); let nameList = ["a"]; let valueList = that.industryProportion == 1 ? [76.38] : [728.04]; let total = 1363.88; // 数据总数 var category = nameList.map((item, index) => { return { value: valueList[index], itemStyle: { color: new echarts.graphic.LinearGradient( 1, 0, 0, 1, [ { offset: 0, color: "#5BDCC850", }, { offset: 1, color: "#5BDCC8", }, ], false ), }, }; }); var totalList = []; var totalBorderList = []; nameList.map((item, index) => { totalList.push({ value: total, itemStyle: { color: "rgba(51, 147, 236, 0.29)", }, }); totalBorderList.push({ value: total, itemStyle: { borderColor: "rgba(51, 147, 236, 0.29)", color: "transparent", }, }); }); var datas = []; category.forEach((value) => { datas.push(value.value); }); option = { // backgroundColor: 'rgb(231,238,249)', xAxis: { max: total, splitLine: { show: false, }, axisLine: { show: false, }, axisLabel: { show: false, }, axisTick: { show: false, }, }, grid: { left: "0%", top: "15%", // 设置条形图的边距 right: "15%", bottom: "5%", }, yAxis: [ { type: "category", inverse: false, data: nameList, axisLine: { show: false, }, axisTick: { show: false, }, axisLabel: { show: false, }, }, ], series: [ { // 内 type: "bar", barWidth: 16, barGap: "20%", silent: true, // label: { // normal: { // formatter: (item) => { // return `${item['name']}:${item['value']} `; // }, // textStyle: { // color: 'rgba(105, 120, 136, 1)', // fontSize: 14, // }, // position: [0, '-25px'], // show: true, // }, // }, data: category, z: 1, itemStyle: { normal: { color: new echarts.graphic.LinearGradient( 1, 0, 0, 1, [ { offset: 0, color: "rgba(81, 193, 156, 1)", }, { offset: 1, color: "rgba(234, 177, 100, 1)", }, ], false ), }, }, animationEasing: "elasticOut", }, { // 分隔 type: "pictorialBar", itemStyle: { normal: { color: "#143362", }, }, symbolRepeat: "fixed", symbolMargin: 8, symbol: "rect", symbolClip: false, symbolSize: [4, 20], symbolPosition: "start", symbolOffset: [0, -2], symbolBoundingData: total, data: [total, total, total, total], z: 2, animationEasing: "elasticOut", }, { // label type: "pictorialBar", symbolBoundingData: total, itemStyle: { normal: { color: "none", }, }, label: { normal: { formatter: (params) => { var text; text = `${((params["data"] * 100) / total).toFixed(2)}亿`; return text; }, textStyle: { // 图列内容样式 fontSize: "20", fontWeight: 800, }, position: "right", offset: [0, -3], distance: 10, // 向右偏移位置 show: true, color: "#68BDFF", }, }, data: datas, z: 0, }, { name: "外框", type: "bar", barGap: "-130%", // 设置外框粗细 data: totalBorderList, barWidth: 26, itemStyle: { normal: { // barBorderRadius: [5, 5, 5, 5], borderWidth: 1, // 边框宽度 borderColor: "rgb(51, 147, 236)", // 边框色 color: "rgb(231,238,249)", }, }, z: 0, }, ], }; //轮播 // tools.loopShowTooltip(leftEcharts1, option, { // interval: 2000, // loopSeries: true, // }); //注册 that.leftEcharts4.setOption(option); }, leftEcharts5Fun () { let that = this; this.leftEcharts5 = echarts.init(this.$refs["leftEcharts5"]); let dataList = []; left1[that.industryLayout].forEach((item, index) => { dataList[index] = { value: item.y, name: item.name, itemStyle: { normal: { color: new echarts.graphic.LinearGradient(1, 0, 0, 1, [ { offset: 0, color: commonColor2[index], //顶部颜色 }, { offset: 1, color: commonColor[index], // 底部颜色 }, ]), borderColor: commonColor[index], borderWidth: 3, }, }, }; }); let option = { tooltip: { trigger: "item", formatter: function (e) { return `${e.name} ${e.percent}%
${e.value}亿 ${left1[that.industryLayout][e.seriesIndex].num }个`; }, backgroundColor: "rgba(50,50,50,0.7)", // 提示框浮层的背景颜色 textStyle: { color: "#fff", fontStyle: "normal", // 文字字体的风格('normal',无样式;'italic',斜体;'oblique',倾斜字体) fontWeight: "normal", // 文字字体的粗细('normal',无样式;'bold',加粗;'bolder',加粗的基础上再加粗;'lighter',变细;数字定义粗细也可以,取值范围100至700) fontSize: "28", // 文字字体大小 }, confine: true }, legend: { top: "center", orient: "vertical", left: "65%", textStyle: { color: "#fff", fontSize: 20, padding: [0, 20], }, }, graphic: { elements: [ { type: "image", //需要填充图片,配置image,如果不需要图片可以配置其他的, text, circle, sector, ring, polygon, polyline, rect, line, bezierCurve, arc, group, style: { image: "./img/whiteCircle.png", //这里添加图片地址 width: 80, height: 80, }, left: "37.7%", // top: "middle", //配置图片居中 }, ], }, series: [ { name: "", type: "pie", radius: ["20%", "90%"], center: ["41%", "50%"], labelLine: { normal: { lineStyle: { width: 1, }, }, }, label: { normal: { show: false, textStyle: { fontSize: 28, color: "#fff", }, }, }, roseType: "area", data: dataList, }, { tooltip: { show: false, }, type: "pie", radius: ["90%", "92%"], center: ["41%", "50%"], hoverAnimation: false, name: "", data: [ { name: "", value: 0, itemStyle: { normal: { color: "#345189", }, }, }, ], }, ], }; //轮播 tools.loopShowTooltip(that.leftEcharts5, option, { interval: 2000, loopSeries: true, }); //注册 that.leftEcharts5.setOption(option); }, leftEcharts6Fun () { let that = this; this.leftEcharts6 = echarts.init(this.$refs["leftEcharts6"]); var dataArr = 44; var colorSet = { color: "#22B95E", }; var color1 = { type: "linear", x: 0, y: 0, x2: 1, y2: 1, colorStops: [ { offset: 0, color: "rgba(255,255,255,0.1)", }, { offset: 1, color: "rgba(255,255,255,0.3)", }, ], global: false, }; var color2 = { type: "linear", x: 0, y: 0, x2: 1, y2: 1, colorStops: [ { offset: 0, color: "#30DBBA", }, { offset: 1, color: "#2DE696", }, ], global: false, }; option = { tooltip: { formatter: "{a}
{b} : {c}%", }, series: [ { name: "内部进度条", type: "gauge", // center: ['20%', '50%'], radius: "50%", splitNumber: 10, axisLine: { lineStyle: { color: [ [dataArr / 100, "rgba(0,0,0,0)"], [1, "rgba(0,0,0,0)"], ], width: 1, }, }, axisLabel: { show: false, }, axisTick: { show: false, }, splitLine: { show: false, }, itemStyle: { color: "#ffffff", }, detail: { formatter: function (value) { if (value !== 0) { var num = Math.round(value); return parseInt(num).toFixed(0) + "%"; } else { return 0; } }, offsetCenter: [0, 117], textStyle: { padding: [0, 0, 0, 0], fontSize: 60, color: "#58F7DF", }, }, title: { //标题 show: true, offsetCenter: [0, 220], // x, y,单位px textStyle: { color: "#40A9FF", fontSize: 34, //表盘上的标题文字大小 fontWeight: 400, fontFamily: "MicrosoftYaHei", }, }, data: [ { name: "总额度:1,834.51亿", value: dataArr, itemStyle: { fontSize: "50", //y轴上方单位的大小 color: "#FFF666", fontFamily: "MicrosoftYaHei", }, }, ], pointer: { show: true, length: "100%", // radius: "20%", width: 80, //指针粗细 // icon: 'path://M2090.36389,615.30999 L2090.36389,615.30999 C2091.48372,615.30999 2092.40383,616.194028 2092.44859,617.312956 L2096.90698,728.755929 C2097.05155,732.369577 2094.2393,735.416212 2090.62566,735.56078 C2090.53845,735.564269 2090.45117,735.566014 2090.36389,735.566014 L2090.36389,735.566014 C2086.74736,735.566014 2083.81557,732.63423 2083.81557,729.017692 C2083.81557,728.930412 2083.81732,728.84314 2083.82081,728.755929 L2088.2792,617.312956 C2088.32396,616.194028 2089.24407,615.30999 2090.36389,615.30999 Z', icon: 'image://data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7' }, animationDuration: 4000, }, { name: "内部阴影", type: "gauge", radius: "75%", splitNumber: 10, axisLine: { show: true, lineStyle: { color: [ [ dataArr / 100, new echarts.graphic.LinearGradient(0, 1, 0, 0, [ { offset: 0, color: "#081947", }, { offset: 0.5, color: "#5DF5A9", }, { offset: 1, color: "#F6F16A", }, ]), ], [1, "#0E4889"], ], width: 70, }, }, axisLabel: { show: false, }, axisTick: { show: false, }, splitLine: { show: false, }, itemStyle: { show: false, }, }, { name: '', type: 'gauge', splitNumber: 5, //刻度数量 min: 0, max: 100, radius: "90%", zlevel: 1, axisLine: { show: true, lineStyle: { width: 0, shadowBlur: 0, color: [ [0.2, '#23AFAF'], [0.4, '#2270DA'], [0.6, '#E99D02'], [1, '#F45656'] ], } }, axisTick: { show: true, lineStyle: { color: 'auto', width: 2 }, length: 10, splitNumber: 5 }, splitLine: { show: true, length: -12, lineStyle: { color: 'auto', width: 2 } }, axisLabel: { show: true, color: "#ffffff", fontSize: 20, fontFamily: "SourceHanSansSC-Regular", // position: "top", distance: -30, formatter: function (v) { switch (v + "") { case "0": return "0"; case "10": return "10"; case "20": return "20"; case "30": return "30"; case "40": return "40"; case "50": return "50"; case "60": return "60"; case "70": return "70"; case "80": return "80"; case "90": return "90"; case "100": return "100"; } }, }, pointer: { //仪表盘指针 show: 0, length: '0%', width: 1 }, anchor: { show: true, showAbove: true, size: 30, itemStyle: { color: '#EAEBF1', } }, detail: { show: false }, data: [] }, { //指针上的圆 type: "pie", tooltip: { show: false, }, hoverAnimation: false, legendHoverLink: false, radius: ["0%", "4%"], center: ["50%", "50%"], label: { normal: { show: false, }, }, labelLine: { normal: { show: false, }, }, data: [ { value: 120, itemStyle: { normal: { color: "#ffffff", }, }, }, ], }, ], }; //轮播 // tools.loopShowTooltip(leftEcharts1, option, { // interval: 2000, // loopSeries: true, // }); //注册 that.leftEcharts6.setOption(option); }, leftEcharts7Fun () { let that = this; this.leftEcharts7 = echarts.init(this.$refs["leftEcharts7"]); let option = { title: { text: "固定资产进度分布", textStyle: { color: "#fff", fontSize: 28, fontWeight: 500, fontFamily: "Microsoft YaHei", }, top: "20", left: "220", }, textStyle: { color: "#fff", }, tooltip: { show: false, trigger: "axis", formatter: function (params) { var tip = params[0].axisValue + "
" + params[0].marker + params[0].data[1] + ":" + params[0].data[2] + "个," + params[0].data[3] + "亿元" + "
" + params[1].marker + params[1].data[1] + ":" + params[1].data[2] + "个," + params[1].data[3] + "亿元"; return tip; }, textStyle: { color: "#ffffff", // 文字的颜色 fontSize: "20", // 文字字体大小 fontFamily: "Microsoft YaHei", }, axisPointer: { // lineStyle: { // type: 'dashed', // width: 2, // color: 'rgba(255,255,255,0.6)' // }, animation: false, }, }, grid: { top: "0%", right: "5%", left: "17%", bottom: "-10%", }, yAxis: { data: ["备案类", "特别监管类"], splitLine: { show: false, lineStyle: { color: "#68b4dd66", type: "dashed", }, }, axisLine: { show: false, }, axisLabel: { show: true, formatter: "{value}", textStyle: { color: function (data) { if (data == "特别监管类") { return "#40A9FF"; } else if (data == "备案类") { return "#5BDCC8"; } }, fontSize: 20, padding: [0, -10, 0, 0], fontFamily: "Microsoft YaHei", }, }, nameTextStyle: { color: "#ebf8ac", fontSize: 16, fontFamily: "Microsoft YaHei", }, }, xAxis: { data: ["项目储备", "项目立项", "可研论证", "投资决策"], axisLine: { show: true, //隐藏X轴轴线 lineStyle: { color: "red", width: 1, }, }, axisTick: { show: false, //隐藏X轴刻度 }, axisLabel: { show: true, textStyle: { color: "#fff", //X轴文字颜色 fontSize: 20, padding: [-80, 0, 0, 0], fontFamily: "Microsoft YaHei", }, }, }, series: [ { name: "特别监管类", type: "scatter", symbol: "circle", //'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow' symbolSize: function (data) { return Math.sqrt(data[2]) * 5; }, // label: { // emphasis: { // show: true, // formatter: function (param) { // return param.data[2]; // }, // position: 'top' // } // }, itemStyle: { normal: { color: "#69c0ff", }, }, // data: left13[0] }, { name: "备案类", type: "scatter", symbol: "circle", //'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow' symbolSize: function (data) { return Math.sqrt(data[2]) * 5; }, // label: { // emphasis: { // show: true, // formatter: function (param) { // return param.data[2]; // }, // position: 'top' // } // }, itemStyle: { normal: { color: "#957DFF", }, }, // data: left13[1] }, ], }; //轮播 // tools.loopShowTooltip(leftEcharts1, option, { // interval: 2000, // loopSeries: true, // }); //注册 that.leftEcharts7.setOption(option); }, leftEcharts8Fun () { let that = this; this.leftEcharts8 = echarts.init(this.$refs["leftEcharts8"]); let option = { title: { text: "股权类项目进度分布", textStyle: { color: "#fff", fontSize: 28, fontWeight: 500, fontFamily: "Microsoft YaHei", }, top: "20", left: "220", }, textStyle: { color: "#fff", }, tooltip: { show: false, trigger: "axis", formatter: function (params) { var tip = params[0].axisValue + "
" + params[0].marker + params[0].data[1] + ":" + params[0].data[2] + "个," + params[0].data[3] + "亿元" + "
" + params[1].marker + params[1].data[1] + ":" + params[1].data[2] + "个," + params[1].data[3] + "亿元"; return tip; }, textStyle: { color: "#ffffff", // 文字的颜色 fontSize: "20", // 文字字体大小 fontFamily: "Microsoft YaHei", }, axisPointer: { // lineStyle: { // type: 'dashed', // width: 2, // color: 'rgba(255,255,255,0.6)' // }, animation: false, }, }, grid: { top: "0%", right: "5%", left: "15%", bottom: "-10%", }, yAxis: { data: ["备案", "特别监管"], splitLine: { show: false, lineStyle: { color: "#68b4dd66", type: "dashed", }, }, axisLine: { show: false, }, axisLabel: { show: false, formatter: "{value}", textStyle: { color: "#fff", fontSize: 20, padding: [0, -10, 0, 0], fontFamily: "Microsoft YaHei", }, }, nameTextStyle: { color: "#ebf8ac", fontSize: 16, fontFamily: "Microsoft YaHei", }, }, xAxis: { data: ["项目储备", "项目立项", "可研论证", "投资决策"], axisLine: { show: true, //隐藏X轴轴线 lineStyle: { color: "red", width: 1, }, }, axisTick: { show: false, //隐藏X轴刻度 }, axisLabel: { show: true, textStyle: { color: "#fff", //X轴文字颜色 fontSize: 20, padding: [-80, 0, 0, 0], fontFamily: "Microsoft YaHei", }, }, }, series: [ { name: "特别监管类", type: "scatter", symbol: "circle", //'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow' symbolSize: function (data) { return Math.sqrt(data[2]) * 5; }, // label: { // emphasis: { // show: true, // formatter: function (param) { // return param.data[2]; // }, // position: 'top' // } // }, itemStyle: { normal: { color: "#69c0ff", }, }, // data: left13[0] }, { name: "备案类", type: "scatter", symbol: "circle", //'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow' symbolSize: function (data) { return Math.sqrt(data[2]) * 5; }, // label: { // emphasis: { // show: true, // formatter: function (param) { // return param.data[2]; // }, // position: 'top' // } // }, itemStyle: { normal: { color: "#957DFF", }, }, // data: left13[1] }, ], }; //轮播 // tools.loopShowTooltip(leftEcharts1, option, { // interval: 2000, // loopSeries: true, // }); //注册 that.leftEcharts8.setOption(option); }, shanxiEchartsFun () { let that = this; this.geoCoordMap = []; /*获取地图数据*/ this.shanxiMap = echarts.init(this.$refs["shanxi"]); // echarts.registerMap('china', china) echarts.registerMap("china", shanxi); // var mapFeatures = echarts.getMap('china').geoJson.features // mapFeatures.forEach(v => { // // 地区名称 // var name = v.properties.name // // 地区经纬度 // this.geoCoordMap[name] = v.properties.cp // data.push({ name: v.properties.name, value: v.properties.cp[0], value2: v.properties.cp[1] }) // }) var data = [ { name: "大同市", value: 65, value2: 28 }, { name: "朔州市", value: 331, value2: 13 }, { name: "忻州市", value: 735, value2: 25 }, { name: "吕梁市", value: 104, value2: 45 }, { name: "太原市", value: 2567, value2: 113 }, { name: "阳泉市", value: 252, value2: 28 }, { name: "晋中市", value: 187, value2: 52 }, { name: "临汾市", value: 155, value2: 30 }, { name: "长治市", value: 100, value2: 23 }, { name: "运城市", value: 416, value2: 23 }, { name: "晋城市", value: 443, value2: 31 }, ]; var geoCoordMap = { 太原市: [112.53, 37.87], 大同市: [113.3, 40.12], 阳泉市: [113.57, 37.85], 长治市: [113.08, 36.18], 晋城市: [112.83, 35.52], 朔州市: [112.43, 39.33], 晋中市: [112.94, 37.4], 运城市: [110.97, 35.03], 忻州市: [112.53, 38.72], 临汾市: [111.5, 36.08], 吕梁市: [111.13, 37.52], }; var convertData = function (data) { var res = []; for (var i = 0; i < data.length; i++) { var geoCoord = geoCoordMap[data[i].name]; if (geoCoord) { res.push({ name: data[i].name, value: geoCoord.concat(data[i].value, data[i].value2), }); } } return res; }; var convertedData = [ convertData(data), convertData( data .sort(function (a, b) { return b.value - a.value; }) .slice(0, 6) ), ]; data.sort(function (a, b) { return a.value - b.value; }); option = { backgroundColor: "#404a5900", animation: true, animationDuration: 1000, animationEasing: "cubicInOut", animationDurationUpdate: 1000, animationEasingUpdate: "cubicInOut", geo: { map: "china", center: [112.53, 37.67], zoom: 4.5, label: { emphasis: { show: false, }, }, roam: false, itemStyle: { normal: { borderColor: "#7fb3ff", borderWidth: 3, areaColor: { type: "radial", x: 0.5, y: 0.5, r: 0.8, colorStops: [ { offset: 0, color: "#468ff8", // 0% 处的颜色 }, { offset: 1, color: "#0a2c6d", // 100% 处的颜色 }, ], globalCoord: false, // 缺省为 false }, // shadowColor: 'rgba(128, 217, 248, 1)', shadowColor: "#468ff8", shadowOffsetX: -2, shadowOffsetY: 2, shadowBlur: 20, }, emphasis: { areaColor: { colorStops: [ { offset: 0, color: "#3844aa", // 0% 处的颜色 }, { offset: 1, color: "#7284fc", // 100% 处的颜色 }, ], }, borderColor: "#b3baff", borderWidth: 5, }, }, tooltip: { trigger: "item", className: "custom-tooltip-box", confine: true, // 不超出当前表 formatter: (params, ticket, callback) => { // 清空所有轮播 for (var k in geoCoordMap) { that.shanxiMap.dispatchAction({ // type: 'geoUnSelect', type: "downplay", name: k, geoIndex: 0, }); that.shanxiMap.dispatchAction({ // type: 'geoUnSelect', type: "downplay", name: k, seriesName: params.seriesName, }); that.shanxiMap.dispatchAction({ // type: 'geoUnSelect', type: "downplay", name: k, seriesName: "series\u00001", }); } that.shanxiMap.dispatchAction({ // type: 'geoSelect', type: "highlight", name: params.name, geoIndex: 0, }); that.shanxiMap.dispatchAction({ // type: 'geoSelect', type: "highlight", name: params.name, seriesName: params.seriesName, }); that.shanxiMap.dispatchAction({ // type: 'geoSelect', type: "highlight", name: params.name, seriesName: "series\u00001", }); if (params.value) { return `
${params.name}
项目数量:${params.value[3]}
投资总额:${params.value[2]}亿
`; } }, }, regions: [ { name: "太原市", value: 2000, itemStyle: { emphasis: { borderColor: "#ffe036", borderWidth: 5, areaColor: { type: "radial", x: 0.5, y: 0.5, r: 0.8, colorStops: [ { offset: 0, color: "#ffe036", // 0% 处的颜色 }, { offset: 1, color: "#7c732a", // 100% 处的颜色 }, ], globalCoord: false, // 缺省为 false }, }, }, }, { name: "南海诸岛", itemStyle: { // 隐藏地图 normal: { opacity: 0, // 为 0 时不绘制该图形 }, }, label: { show: false, // 隐藏文字 }, }, ], }, tooltip: { trigger: "item", className: "custom-tooltip-box", confine: true, // 不超出当前表 formatter: (e) => { console.log('走了这里了', e) } }, xAxis: { type: "value", scale: true, position: "top", boundaryGap: false, splitLine: { show: false, }, axisLine: { show: false, }, axisTick: { show: false, }, axisLabel: { margin: 2, textStyle: { color: "#aaa", }, }, }, yAxis: { type: "category", nameGap: 16, axisLine: { show: false, lineStyle: { color: "#ddd", }, }, axisTick: { show: false, lineStyle: { color: "#ddd", }, }, axisLabel: { interval: 0, textStyle: { color: "#ddd", }, }, data: categoryData, }, series: [ { type: "effectScatter", colorBy: "data", coordinateSystem: "geo", data: convertedData[0], symbolSize: function (val) { return Math.max(val[2] / 500, 8); }, showEffectOn: "emphasis", rippleEffect: { brushType: "stroke", color: "#58F7DF", }, hoverAnimation: true, label: { normal: { formatter: "{b}", position: "right", show: true, fontSize: "30", color: "#fff", }, }, itemStyle: { normal: { color: "#ffc809", shadowBlur: 50, shadowColor: "#ffc809", }, emphasis: { color: "#58F7DF", shadowBlur: 50, shadowColor: "#58F7DF", }, }, zlevel: 99, }, { type: "effectScatter", colorBy: "data", coordinateSystem: "geo", data: [ { name: "太原市", value: [112.53, 37.87, 25167, 113], }, ], symbolSize: function (val) { return Math.max(val[2] / 500, 8); }, showEffectOn: "emphasis", rippleEffect: { brushType: "stroke", color: "#DF62F2", }, hoverAnimation: true, label: { normal: { formatter: "{b}", position: "right", show: false, fontSize: "30", color: "#fff", }, }, itemStyle: { normal: { color: "#ffc809", shadowBlur: 50, shadowColor: "#ffc809", }, emphasis: { color: "#DF62F2", shadowBlur: 50, shadowColor: "#DF62F2", }, }, zlevel: 999, }, ], }; var categoryData = []; var barData = []; var sum = 0; for (var i = 0; i < data.length; i++) { categoryData.push(data[i].name); barData.push(data[i].value); sum += data[i].value; } // this.shanxiMap.on('click', function (params) { // if (params.name == '山西') { // that.shanxiMap.dispose() // that.centerShow = true // setTimeout(() => { // }) // } // }) tools.loopShowTooltip(this.shanxiMap, option, { interval: 2000, loopSeries: false, seriesIndex: 0, }); this.shanxiMap.setOption(option); }, chinaEchartsFun () { let that = this; this.geoCoordMap = []; /*获取地图数据*/ this.chinaMap = echarts.init(this.$refs["china"]); echarts.registerMap("china", china); // var mapFeatures = echarts.getMap('china').geoJson.features // mapFeatures.forEach(v => { // // 地区名称 // var name = v.properties.name // // 地区经纬度 // this.geoCoordMap[name] = v.properties.cp // data.push({ name: v.properties.name, value: v.properties.cp[0], value2: v.properties.cp[1] }) // }) var data = [ { "name": "新疆", value: 2978, value2: 32 }, { "name": "西藏", value: 2186, value2: 21 }, { "name": "内蒙古", value: 1135, value2: 35 }, { "name": "青海", value: 2978, value2: 53 }, { "name": "四川", value: 2568, value2: 23 }, { "name": "黑龙江", value: 2978, value2: 43 }, { "name": "甘肃", value: 6959, value2: 76 }, { "name": "云南", value: 5632, value2: 12 }, { "name": "广西", value: 6707, value2: 76 }, { "name": "湖南", value: 2978, value2: 23 }, { "name": "陕西", value: 1894, value2: 87 }, { "name": "广东", value: 1576, value2: 23 }, { "name": "吉林", value: 8259, value2: 76 }, { "name": "河北", value: 5741, value2: 46 }, { "name": "湖北", value: 3030, value2: 42 }, { "name": "贵州", value: 4542, value2: 12 }, { "name": "山东", value: 1970, value2: 87 }, { "name": "江西", value: 3157, value2: 12 }, { "name": "河南", value: 6690, value2: 56 }, { "name": "辽宁", value: 8678, value2: 12 }, { "name": "山西", value: 9533, value2: 86 }, { "name": "安徽", value: 2970, value2: 33 }, { "name": "福建", value: 1259, value2: 25 }, { "name": "浙江", value: 3016, value2: 15 }, { "name": "江苏", value: 3202, value2: 25 }, { "name": "重庆", value: 4540, value2: 25 }, { "name": "宁夏", value: 1980, value2: 43 }, { "name": "海南", value: 8626, value2: 31 }, { "name": "台湾", value: 4361, value2: 35 }, { "name": "北京", value: 2000, value2: 65 }, { "name": "天津", value: 4080, value2: 80 }, { "name": "上海", value: 1980, value2: 24 }, { "name": "香港", value: 6991, value2: 65 }, { "name": "澳门", value: 1873, value2: 24 }, ]; var geoCoordMap = { "新疆": [86.9023, 41.148], "西藏": [87.8695, 31.6846], "内蒙古": [110.5977, 41.3408], "青海": [95.2402, 35.4199], "四川": [102.9199, 30.1904], "黑龙江": [128.1445, 46.7156], "甘肃": [102.7129, 38.166], "云南": [101.0652, 24.6807], "广西": [108.7813, 23.6426], "湖南": [111.5332, 27.3779], "陕西": [108.5996, 33.7396], "广东": [113.8668, 22.8076], "吉林": [126.1746, 43.5938], "河北": [115.4004, 38.1688], "湖北": [112.2363, 30.8572], "贵州": [106.6113, 26.6385], "山东": [118.2402, 36.2307], "江西": [115.7156, 27.99], "河南": [113.0668, 33.8818], "辽宁": [123.0438, 41.0889], "山西": [112.44, 37.73], "安徽": [117.2461, 31.0361], "福建": [118.3008, 25.9277], "浙江": [120.498, 29.0918], "江苏": [119.8586, 32.915], "重庆": [107.7539, 29.8904], "宁夏": [105.9961, 37.1096], "海南": [109.9512, 19.2041], "台湾": [120.8254, 23.5986], "北京": [116.4551, 40.2539], "天津": [117.4219, 39.4189], "上海": [121.4648, 31.2891], "香港": [114.6178, 22.3242], "澳门": [113.5547, 21.6484], '南海诸岛': [128.8254, 21.5986] }; var convertData = function (data) { var res = []; for (var i = 0; i < data.length; i++) { var geoCoord = geoCoordMap[data[i].name]; if (geoCoord) { res.push({ name: data[i].name, value: geoCoord.concat(data[i].value, data[i].value2), }); } } return res; }; var convertedData = [ convertData(data), convertData( data .sort(function (a, b) { return b.value - a.value; }) .slice(0, 6) ), ]; data.sort(function (a, b) { return a.value - b.value; }); option = { animation: true, animationDuration: 1000, animationEasing: "cubicInOut", animationDurationUpdate: 1000, animationEasingUpdate: "cubicInOut", geo: { map: "china", zoom: 0.9, label: { emphasis: { show: false, }, }, roam: false, itemStyle: { normal: { borderColor: "#7fb3ff", borderWidth: 3, areaColor: { type: "radial", x: 0.5, y: 0.5, r: 1, colorStops: [ { offset: 0, color: "#468ff850", // 0% 处的颜色 }, { offset: 1, color: "#0a2c6d50", // 100% 处的颜色 }, ], globalCoord: false, // 缺省为 false }, // shadowColor: 'rgba(128, 217, 248, 1)', shadowColor: "#468ff8", shadowOffsetX: -2, shadowOffsetY: 2, shadowBlur: 10, }, emphasis: { areaColor: { colorStops: [ { offset: 0, color: "#3844aa", // 0% 处的颜色 }, { offset: 1, color: "#7284fc", // 100% 处的颜色 }, ], }, borderColor: "#b3baff", borderWidth: 5, }, }, tooltip: { trigger: "item", className: "custom-tooltip-box", confine: true, // 不超出当前表 formatter: (params, ticket, callback) => { // console.log(params, '走了这里了') // 清空所有轮播 for (var k in geoCoordMap) { that.chinaMap.dispatchAction({ // type: 'geoUnSelect', type: "downplay", name: k, geoIndex: 0, }); that.chinaMap.dispatchAction({ // type: 'geoUnSelect', type: "downplay", name: k, seriesName: params.seriesName, }); that.chinaMap.dispatchAction({ // type: 'geoUnSelect', type: "downplay", name: k, seriesName: "series\u00001", }); } that.chinaMap.dispatchAction({ // type: 'geoSelect', type: "highlight", name: params.name, geoIndex: 0, }); that.chinaMap.dispatchAction({ // type: 'geoSelect', type: "highlight", name: params.name, seriesName: params.seriesName, }); that.chinaMap.dispatchAction({ // type: 'geoSelect', type: "highlight", name: params.name, seriesName: "series\u00001", }); if (params.value) { return `
${params.name}
项目数量:${params.value[3]}
投资总额:${params.value[2]}亿
`; } }, }, regions: [ { name: "山西", value: 2000, itemStyle: { emphasis: { borderColor: "#ffe036", borderWidth: 5, areaColor: { type: "radial", x: 0.5, y: 0.5, r: 0.8, colorStops: [ { offset: 0, color: "#ffe036", // 0% 处的颜色 }, { offset: 1, color: "#7c732a", // 100% 处的颜色 }, ], globalCoord: false, // 缺省为 false }, }, }, }, ], }, tooltip: { trigger: "item", className: "custom-tooltip-box", confine: true, // 不超出当前表 }, xAxis: { type: "value", scale: true, position: "top", boundaryGap: false, splitLine: { show: false, }, axisLine: { show: false, }, axisTick: { show: false, }, axisLabel: { margin: 2, textStyle: { color: "#aaa", }, }, }, yAxis: { type: "category", nameGap: 16, axisLine: { show: false, lineStyle: { color: "#ddd", }, }, axisTick: { show: false, lineStyle: { color: "#ddd", }, }, axisLabel: { interval: 0, textStyle: { color: "#ddd", }, }, data: categoryData, }, series: [ { type: "effectScatter", colorBy: "data", coordinateSystem: "geo", data: convertedData[0], symbolSize: function (val) { return Math.max(val[2] / 100, 8); }, showEffectOn: "emphasis", rippleEffect: { brushType: "stroke", color: "#58F7DF", }, hoverAnimation: true, label: { normal: { formatter: "{b}", position: "right", show: true, fontSize: "30", color: "#fff", }, }, itemStyle: { normal: { color: "#ffc809", shadowBlur: 50, shadowColor: "#ffc809", }, emphasis: { color: "#58F7DF", shadowBlur: 50, shadowColor: "#58F7DF", }, }, zlevel: 99, }, { type: "effectScatter", colorBy: "data", coordinateSystem: "geo", data: [ { name: "山西", value: [112.43, 37.73, 53003, 80], }, ], symbolSize: function (val) { return Math.max(val[2] / 500, 8); }, showEffectOn: "emphasis", rippleEffect: { brushType: "stroke", color: "#DF62F2", }, hoverAnimation: true, label: { normal: { formatter: "{b}", position: "right", show: false, fontSize: "30", color: "#fff", }, }, itemStyle: { normal: { color: "#ffc809", shadowBlur: 50, shadowColor: "#ffc809", }, emphasis: { color: "#DF62F2", shadowBlur: 50, shadowColor: "#DF62F2", }, }, zlevel: 999, }, ], }; var categoryData = []; var barData = []; var sum = 0; for (var i = 0; i < data.length; i++) { categoryData.push(data[i].name); barData.push(data[i].value); sum += data[i].value; } this.chinaMap.on('click', function (params) { if (params.name == '山西') { that.chinaMap.dispose() that.leftEcharts16.dispose() that.mapShow = true setTimeout(() => { that.leftEcharts12Fun() that.leftEcharts17Fun() that.leftEcharts14Fun() that.leftEcharts9Fun() that.leftEcharts15Fun() that.leftEcharts13Fun() that.shanxiEchartsFun() }) } }) tools.loopShowTooltip(this.chinaMap, option, { interval: 2000, loopSeries: false, seriesIndex: 0, }); this.chinaMap.setOption(option); }, leftEcharts9Fun () { let that = this; this.leftEcharts9 = echarts.init(this.$refs["leftEcharts9"]); // var ROOT_PATH = 'https://echarts.apache.org/examples'; let option = { backgroundColor: "#00000000", globe: { globeRadius: 55, baseTexture: "./img/3D/world1.jpg", heightTexture: "./img/3D/world1.jpg", displacementScale: 0.04, shading: "realistic", // environment: './img/3D/world2.jpg', realisticMaterial: { roughness: 0.9, }, postEffect: { enable: true, }, light: { main: { intensity: 3, shadow: true, }, }, }, }; that.leftEcharts9.setOption(option); }, leftEcharts10Fun () { let that = this; this.leftEcharts10 = echarts.init(this.$refs["leftEcharts10"]); option = { grid: { top: 45, right: 0, left: 80, bottom: 80, }, tooltip: { show: true, trigger: "axis", // showContent formatter: (data) => { return `${data[0].name }
${data[0].seriesName}:${that.numFormat( data[0].value )}亿
${data[1].seriesName}:${that.numFormat( data[1].value )}亿`; }, axisPointer: { // 坐标轴指示器,坐标轴触发有效 type: "line", // 默认为直线,可选为:'line' | 'shadow' label: { margin: 100, } }, backgroundColor: "rgba(50,50,50,0.7)", // 提示框浮层的背景颜色 borderColor: "rgba(50,50,50,0.7)", textStyle: { color: "#fff", fontStyle: "normal", // 文字字体的风格('normal',无样式;'italic',斜体;'oblique',倾斜字体) fontWeight: "normal", // 文字字体的粗细('normal',无样式;'bold',加粗;'bolder',加粗的基础上再加粗;'lighter',变细;数字定义粗细也可以,取值范围100至700) fontSize: "28", // 文字字体大小 }, }, xAxis: { data: commonCompany, axisTick: { show: false, }, // x轴的字体颜色 axisLabel: { rotate: 40, textStyle: { color: "white", fontSize: "20", fontFamily: "Microsoft YaHei", }, }, //y轴线的颜色以及宽度 axisLine: { show: true, lineStyle: { color: "#1E5389", width: 1, type: "solid", }, }, }, yAxis: { name: "亿", axisTick: { lineStyle: { color: "#18416F", }, }, // y轴的字体颜色 axisLabel: { textStyle: { color: "white", fontSize: "20", fontFamily: "Microsoft YaHei", }, }, splitLine: { show: true, lineStyle: { color: "#68b4dd66", width: 1, type: "dashed", }, }, //y轴线的颜色以及宽度 axisLine: { show: true, lineStyle: { color: "#1E5389", width: 1, type: "solid", }, }, nameTextStyle: { color: "#fff", fontSize: 20, fontFamily: "Microsoft YaHei", }, }, series: [ { name: "已用额度", type: "pictorialBar", symbol: "fixed", symbolSize: [20, 5], symbolMargin: 2, symbolRepeat: "repeat", data: [ 407.46, 603.02, 52.27, 67.02, 20.85, 0.00, 4.00, 8.02, 20.98, 0.00, 80.01, 11.62, 50.09, 52.17, 0.00, 0.00, 0.00, 0.00 ], showBackground: false, barWidth: "15", itemStyle: { color: "#40A9FF", }, zlevel: 1, }, { name: "总额度", type: "pictorialBar", symbol: "fixed", symbolSize: [30, 5], symbolMargin: 2, symbolRepeat: "repeat", data: [ 457.46, 613.02, 152.27, 267.02, 30.85, 0.00, 24.00, 18.02, 24.98, 0.00, 87.01, 18.62, 59.09, 82.17, 0.00, 0.00, 0.00, 0.00 ], barGap: "-130%", barWidth: "25", itemStyle: { color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [ { offset: 0, color: "#b9b7c030", }, { offset: 1, color: "#b9b7c030", }, ]), }, }, ], }; //轮播 tools.loopShowTooltip(that.leftEcharts10, option, { interval: 2000, loopSeries: true, }); //注册 that.leftEcharts10.setOption(option); }, // 重点项目两线指标轮播方法 scrollChange (index) { if (index == 18) { this.count = -1; } else { this.count = index; } if (this.count > 12 && this.count != 18) { this.countType = 1; } else { this.countType = 0; } for (var i = 0; i < this.list.length; i++) { if (i == 2) { this.list[i].classList.add("light"); } else { this.list[i].classList.remove("light"); } } this.leftEcharts11 ? this.leftEcharts11.dispose() : ""; this.leftEcharts11Fun(); }, leftEcharts11Fun () { let that = this; this.leftEcharts11 = echarts.init(this.$refs["leftEcharts11"]); option = { tooltip: { trigger: "axis", formatter: "指标:" + "{c0}" + "
" + "发展线:" + "{c1}" + "
" + "生存线:" + "{c2}", //+ '
'+ '{a1}:{c1}' + '%', axisPointer: { type: "shadow", }, backgroundColor: "rgba(50,50,50,0.7)", borderColor: "rgba(50,50,50,0.7)", textStyle: { color: "#fff", fontStyle: "normal", // 文字字体的风格('normal',无样式;'italic',斜体;'oblique',倾斜字体) fontWeight: "normal", // 文字字体的粗细('normal',无样式;'bold',加粗;'bolder',加粗的基础上再加粗;'lighter',变细;数字定义粗细也可以,取值范围100至700) fontSize: "28", // 文字字体大小 } }, grid: { top: "10%", right: "5%", left: "15%", bottom: "20%", }, xAxis: { data: [ "总投资收益率", "销售利润率", "成本费用利润率", "总资产周转率", "财务内部收益率", ], // data: left15[this.countType], axisLine: { show: true, //隐藏X轴轴线 lineStyle: { color: "#005094", width: 1, }, }, axisTick: { show: true, //隐藏X轴刻度 }, axisLabel: { show: true, rotate: 30, textStyle: { color: "#fff", //X轴文字颜色 fontSize: 20, fontFamily: "Microsoft YaHei", }, }, }, yAxis: [ { type: "value", splitLine: { show: true, lineStyle: { color: "#68b4dd66", type: "dashed", }, }, axisLine: { show: false, }, axisLabel: { show: true, formatter: "{value}%", textStyle: { color: "#fff", fontSize: 20, fontFamily: "Microsoft YaHei", }, }, nameTextStyle: { color: "#ebf8ac", fontSize: 16, fontFamily: "Microsoft YaHei", }, }, ], series: [ { name: "实际值", type: "bar", barWidth: 20, itemStyle: { normal: { color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ { offset: 0, color: "#69c0ff", }, { offset: 1, color: "#082550", }, ]), }, }, data: dataList[this.count + 1][1], // data: this.storageRecordConfig.data.length == 0 ? [] : this.storageRecordConfig.data.length == 1 ? left12[this.count][2] : left12[this.count + 1][2] }, { name: "", type: "line", barWidth: 15, itemStyle: { normal: { color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ { offset: 0, color: "#69c0ff", }, { offset: 1, color: "green", }, ]), }, }, data: dataList[this.count + 1][1], // data: this.storageRecordConfig.data.length == 0 ? [] : this.storageRecordConfig.data.length == 1 ? left12[this.count][1] : left12[this.count + 1][1] }, { name: "", type: "line", barWidth: 15, itemStyle: { normal: { color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ { offset: 0, color: "#69c0ff", }, { offset: 1, color: "yellow", }, ]), }, }, data: dataList[this.count + 1][0], // data: this.storageRecordConfig.data.length == 0 ? [] : this.storageRecordConfig.data.length == 1 ? left12[this.count][0] : left12[this.count + 1][0] }, ], }; //轮播 tools.loopShowTooltip(that.leftEcharts11, option, { interval: 2000, loopSeries: true, }); //注册 that.leftEcharts11.setOption(option); }, leftEcharts12Fun () { let that = this; this.leftEcharts12 = echarts.init(this.$refs["leftEcharts12"]); var totalData = [{ name: '传统产业', value: 12, radio: 0.13 }, { name: '战略新兴产业', value: 52, radio: 0.01 }, { name: '特色优势产业', value: 15, radio: 3.9 }, { name: '公共基础产业', value: 56, radio: 10.5 }]; var data = []; for (var i = 0; i < totalData.length; i++) { data.push({ value: totalData[i].value, name: totalData[i].name, itemStyle: { normal: { borderWidth: 8, shadowBlur: 0, borderColor: commonColor[i], shadowColor: commonColor[i] } } }, { value: 5, name: '', tooltip: { show: false }, itemStyle: { normal: { label: { show: false }, labelLine: { show: false }, color: 'rgba(0, 0, 0, 0)', borderColor: 'rgba(0, 0, 0, 0)', borderWidth: 0 } } } ); } var seriesOption = [ { name: '', type: 'pie', clockWise: false, radius: [160, 170], center: [340, 250], hoverAnimation: true, itemStyle: { normal: { label: { show: false, } } }, data: data }, ]; option = { color: commonColor, title: { show: false, text: '风险类型123', top: '48%', textAlign: "center", left: "49%", textStyle: { color: '#fff', fontSize: 18, fontWeight: '400' } }, tooltip: { show: true, formatter: function (params) { that.leftEcharts17.dispose() that.leftEcharts17Fun() left2[0] = that.numDiv(params.percent + 3.2, 100) if (params.seriesIndex === 2) { return null; // 隐藏部分2的tooltip } else { that.stageTitle4 = params.name that.stageTitle3 = params.percent + '%' return `${params.name}:
金额:${totalData[params.seriesIndex].radio}亿
数量:${params.value}个` } }, confine: true, backgroundColor: "rgba(50,50,50,0.7)", // 提示框浮层的背景颜色 borderColor: "rgba(50,50,50,0.7)", textStyle: { color: "#fff", fontStyle: "normal", // 文字字体的风格('normal',无样式;'italic',斜体;'oblique',倾斜字体) fontWeight: "normal", // 文字字体的粗细('normal',无样式;'bold',加粗;'bolder',加粗的基础上再加粗;'lighter',变细;数字定义粗细也可以,取值范围100至700) fontSize: "28", // 文字字体大小 } }, legend: { icon: "circle", orient: 'vertical', data: ['传统产业', '战略新兴产业', '特色优势产业', '公共基础产业'], left: '5%', bottom: 0, align: 'left', textStyle: { color: '#FFF', // 文字的颜色 fontSize: '20', // 文字字体大小 fontFamily: 'Microsoft YaHei' }, itemGap: 20 }, toolbox: { show: false }, graphic: [{ type: 'image', id: 'background', left: 210, top: "center", zlevel: 0, silent: true, style: { width: 260, // 设置图片宽度 height: 260, // 设置图片高度 image: "data:image/png;base64,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" } }], series: seriesOption } function _pie3 () { let dataArr = []; for (var i = 0; i < 100; i++) { if (i % 2 === 0) { dataArr.push({ name: (i + 1).toString(), value: 25, tooltip: { show: false }, itemStyle: { normal: { color: "#5A5DE0", borderWidth: 1, borderColor: "#5A5DE0" } } }) } else { dataArr.push({ name: (i + 1).toString(), value: 20, tooltip: { show: false }, itemStyle: { normal: { color: "rgba(0,0,0,0)", borderWidth: 0, borderColor: "rgba(0,0,0,0)" } } }) } } console.log(dataArr); return dataArr } //轮播 tools.loopShowTooltip(that.leftEcharts12, option, { interval: 1000, loopSeries: true, }); //注册 that.leftEcharts12.setOption(option); }, leftEcharts17Fun () { let that = this; this.leftEcharts17 = echarts.init(this.$refs["leftEcharts17"]); return var seriesOption = [ { type: "liquidFill", radius: "40%", tooltip: { show: false }, data: [left2[0]], center: [350, 260], backgroundStyle: { color: { type: "radial", x: 0.5, y: 0.5, r: 0.5, // 水球体颜色 colorStops: [ { offset: 0, color: "#010a11", }, { offset: 0.75, // color: "#203852", color: "#1a2f45", }, { offset: 1, // color: "#354e6d", color: "#2b405a", // color: "#314967", }, ], globalCoord: false, }, }, outline: { borderDistance: 0, itemStyle: { borderWidth: 0, borderColor: { type: "linear", x: 0, y: 0, x2: 0, y2: 1, colorStops: [ ], globalCoord: false, }, }, }, color: [ { x: 0, y: 0, x2: 0, y2: 1, colorStops: [{ offset: 0, color: '#237386', }, { offset: 1, color: '#0078C8', },], }, { x: 0, y: 0, x2: 0, y2: 1, colorStops: [{ offset: 0, color: '#2F97A9', }, { offset: 1, color: '#0078C8', },], }, { x: 0, y: 0, x2: 0, y2: 1, colorStops: [{ offset: 0, color: '#48E0ED', }, { offset: 1, color: '#0078C8', },], } ], label: { normal: { textStyle: { fontSize: '50', color: "#58E6F7", // x轴文字颜色 }, }, }, }, ]; option = { color: commonColor, title: { show: false, text: '', top: '48%', textAlign: "center", left: "49%", textStyle: { color: '#fff', fontSize: 18, fontWeight: '400' } }, series: seriesOption } //注册 that.leftEcharts17.setOption(option); }, leftEcharts13Fun () { let that = this; this.leftEcharts13 = echarts.init(this.$refs["leftEcharts13"]); var totalData = [{ name: '特别监管类', value: 12, radio: 0.13 }, { name: '备案类', value: 52, radio: 0.01 }, ]; var data = []; for (var i = 0; i < totalData.length; i++) { data.push({ value: totalData[i].value, name: totalData[i].name, itemStyle: { normal: { borderWidth: 8, shadowBlur: 0, borderColor: commonColor[i], shadowColor: commonColor[i] } } }, { value: 5, name: '', tooltip: { show: false }, itemStyle: { normal: { label: { show: false }, labelLine: { show: false }, color: 'rgba(0, 0, 0, 0)', borderColor: 'rgba(0, 0, 0, 0)', borderWidth: 0 } } } ); } var seriesOption = [ { name: '', type: 'pie', clockWise: false, radius: [160, 170], center: [350, 250], hoverAnimation: true, itemStyle: { normal: { label: { show: false, } } }, data: data }, { type: 'pie', tooltip: { show: false }, radius: [120, 120], center: [350, 250], zlevel: 3, silent: true, label: { normal: { show: false }, }, labelLine: { normal: { show: false } }, data: _pie3() } ]; option = { color: commonColor, title: { show: false, text: '35%', top: '40%', textAlign: "center", left: "50%", textStyle: { fontWeight: '600', fontFamily: 'Microsoft YaHei', fontSize: '50', color: "#58E6F7", // x轴文字颜色 } }, tooltip: { show: true, backgroundColor: "rgba(50,50,50,0.7)", // 提示框浮层的背景颜色 borderColor: "rgba(50,50,50,0.7)", confine: true, textStyle: { color: "#fff", fontStyle: "normal", // 文字字体的风格('normal',无样式;'italic',斜体;'oblique',倾斜字体) fontWeight: "normal", // 文字字体的粗细('normal',无样式;'bold',加粗;'bolder',加粗的基础上再加粗;'lighter',变细;数字定义粗细也可以,取值范围100至700) fontSize: "28", // 文字字体大小 }, formatter: (params) => { that.stageTitle = params.name that.stageTitle2 = params.percent + '%' return `${params.name}:
金额:${totalData[params.seriesIndex].radio}亿
数量:${params.value}个` } }, legend: { icon: "circle", orient: 'vertical', data: ['特别监管类', '备案类'], right: 0, bottom: 0, align: 'left', textStyle: { color: '#FFF', // 文字的颜色 fontSize: '20', // 文字字体大小 }, itemGap: 20 }, toolbox: { show: false }, series: seriesOption } function _pie3 () { let dataArr = []; for (var i = 0; i < 1; i++) { if (i % 2 === 0) { dataArr.push({ name: (i + 1).toString(), value: 25, tooltip: { show: false }, itemStyle: { normal: { color: "#5A5DE0", borderWidth: 1, borderColor: "#5A5DE0" } } }) } else { dataArr.push({ name: (i + 1).toString(), value: 20, tooltip: { show: false }, itemStyle: { normal: { color: "rgba(0,0,0,0)", borderWidth: 0, borderColor: "rgba(0,0,0,0)" } } }) } } return dataArr } //轮播 tools.loopShowTooltip(that.leftEcharts13, option, { interval: 1000, loopSeries: true, }); //注册 that.leftEcharts13.setOption(option); }, leftEcharts14Fun () { let that = this; this.leftEcharts14 = echarts.init(this.$refs["leftEcharts14"]); that.leftEcharts14.on("showTip", (params) => { // 如果是7或者15并且满足防抖则切换 if ( (params.dataIndex == 5 || params.dataIndex == 11) && that.echartC1Fd1 ) { that.echartC1Fd1 = false; setTimeout(() => { option.dataZoom[0].endValue = option.dataZoom[0].endValue + 6; option.dataZoom[0].startValue = option.dataZoom[0].startValue + 6; that.leftEcharts14.setOption(option); // 防止勿刷新做的防抖 setTimeout(() => { that.echartC1Fd1 = true; }, 2000); }, 1900); // 如果是17表示到了最后一个,那么重新来一遍 } else if (params.dataIndex == 17 && that.echartC1Fd1) { that.echartC1Fd1 = false; setTimeout(() => { option.dataZoom[0].endValue = 0; option.dataZoom[0].startValue = 5; that.leftEcharts14.setOption(option); // 防止勿刷新做的防抖 setTimeout(() => { that.echartC1Fd1 = true; }, 2000); }, 1900); } }); let option = { dataZoom: [ { // start: 9,//默认为@ // end: 100,//黑认认为1@0 type: "slider", show: false, yAxisIndex: 0, handlesize: 0, //滑动条的 左右2个滑动条的大小 startValue: 5, // 初始显示值 endValue: 0, // 结束显示值 height: 10, //组件高度 left: "5%", right: "4%", //右边的距离 bottom: "25%", //底边的距离 borderColor: "#939", fillerColor: "#269cdb", borderRadius: 5, backgroundColor: "#33384b", //两边未选中的滑动条区域的额色 showDataShadow: false, //是否显示数据阴影 showDetail: false, //即拖拽时候是否显示详细数值信息 truerealtime: true, //是否实时更新 filterMode: "filter", } ], tooltip: { show: true, trigger: "axis", // formatter: (data) => { // return `${data[0].name // }
${data[0].seriesName}:${that.numFormat( // data[0].value // )}亿
${data[1].seriesName}:${that.numFormat( // data[1].value // )}亿`; // }, axisPointer: { // 坐标轴指示器,坐标轴触发有效 type: "shadow", // 默认为直线,可选为:'line' | 'shadow' }, backgroundColor: "rgba(50,50,50,0.7)", // 提示框浮层的背景颜色 borderColor: "rgba(50,50,50,0.7)", textStyle: { color: "#fff", fontStyle: "normal", // 文字字体的风格('normal',无样式;'italic',斜体;'oblique',倾斜字体) fontWeight: "normal", // 文字字体的粗细('normal',无样式;'bold',加粗;'bolder',加粗的基础上再加粗;'lighter',变细;数字定义粗细也可以,取值范围100至700) fontSize: "28", // 文字字体大小 }, }, legend: { top: "top", textStyle: { color: "#fff", fontSize: 20, padding: [0, 20], }, }, grid: { left: '3%', right: '7%', bottom: '3%', containLabel: true }, xAxis: { name: '亿', nameTextStyle: { color: '#fff', fontSize: 20, fontFamily: 'Microsoft YaHei' }, type: 'value', axisLabel: { textStyle: { color: "white", fontSize: '20', fontFamily: 'Microsoft YaHei' }, }, splitLine: { show: true, lineStyle: { color: "#68b4dd66", width: 1, type: "dashed", }, }, }, yAxis: { type: 'category', inverse: true, axisTick: { lineStyle: { color: "#18416F", }, }, // y轴的字体颜色 axisLabel: { textStyle: { color: "white", fontSize: '20', fontFamily: 'Microsoft YaHei' }, }, splitLine: { show: false, lineStyle: { color: "#68b4dd66", width: 1, type: "dashed", }, }, //y轴线的颜色以及宽度 axisLine: { show: true, lineStyle: { color: "#1E5389", width: 1, type: "solid", }, }, nameTextStyle: { color: '#fff', fontSize: 20, fontFamily: 'Microsoft YaHei' }, data: that.riskData1.x }, series: [ { name: '实际投资', type: 'bar', data: that.riskData1.y1, barGap: '-145%', barWidth: "15", zlevel: 10, itemStyle: { barBorderRadius: [0, 20, 20, 0], color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [ { offset: 0, color: '#0F357C', }, { offset: 1, color: '#B78CFF', }, ]), }, }, { name: '计划投资', type: 'bar', data: that.riskData1.y2, barWidth: "30", itemStyle: { barBorderRadius: [0, 50, 50, 0], borderColor: '#B78CFF', color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [ { offset: 0, color: '#0F357C80', }, { offset: 1, color: '#10417F80', }, ]), }, } ] }; //轮播 tools.loopShowTooltip(that.leftEcharts14, option, { interval: 2000, loopSeries: true, }); //注册 that.leftEcharts14.setOption(option); }, leftEcharts15Fun () { let that = this; this.leftEcharts15 = echarts.init(this.$refs["leftEcharts15"]); var xdata = ['煤炭和煤电', '煤电和新能源', '煤炭和化工', '煤炭和数字', '煤炭和降碳']; var data = statusList; option = { tooltip: { show: true, trigger: "axis", formatter: data => { return `${data[0].name}
投资金额:${data[0].value}亿
项目数量:${statusList[data[0].dataIndex].num}个` }, axisPointer: { // 坐标轴指示器,坐标轴触发有效 type: "shadow", // 默认为直线,可选为:'line' | 'shadow' }, backgroundColor: "rgba(50,50,50,0.7)", // 提示框浮层的背景颜色 borderColor: "rgba(50,50,50,0.7)", textStyle: { color: "#fff", fontStyle: "normal", // 文字字体的风格('normal',无样式;'italic',斜体;'oblique',倾斜字体) fontWeight: "normal", // 文字字体的粗细('normal',无样式;'bold',加粗;'bolder',加粗的基础上再加粗;'lighter',变细;数字定义粗细也可以,取值范围100至700) fontSize: "28", // 文字字体大小 }, }, grid: { left: "4%", right: "4%", bottom: "3%", top: "15%", containLabel: true }, xAxis: { data: xdata, triggerEvent: true, axisTick: { show: false }, axisLine: { show: false }, axisLabel: { show: true, rotate: 0, interval: 0, textStyle: { padding: [14, 0, 0, 0], fontSize: 20, color: "rgba(255,255,255,1)" } } }, yAxis: { name: "单位:个数", triggerEvent: true, nameTextStyle: { color: "#fff", fontSize: 16, padding: [0, 0, 10, -20] }, splitLine: { show: true, lineStyle: { color: 'rgba(255,255,255,.1)' } }, axisTick: { show: false }, axisLine: { show: true, lineStyle: { color: 'rgba(255,255,255,.1)' } }, axisLabel: { show: true, textStyle: { color: "#fff", fontSize: 20 } } }, series: [ { name: "数量", type: "pictorialBar", barCategoryGap: "60%", // symbol: 'path://M0,10 L10,10 L5,0 L0,10 z', symbol: "path://M0,10 L10,10 C5.5,10 5.5,5 5,0 C4.5,5 4.5,10 0,10 z", itemStyle: { normal: { //渐变色 color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{ offset: 0, color: "#01EAED" }, { offset: 0.5, color: "#02C4DD" }, { offset: 1, color: "#029ED9" } ]) } }, label: { normal: { show: false, position: "top", textStyle: { color: "#fff", fontSize: 20 } } }, data: data, } ] } //轮播 tools.loopShowTooltip(that.leftEcharts15, option, { interval: 2000, loopSeries: true, }); //注册 that.leftEcharts15.setOption(option); }, leftEcharts16Fun () { let that = this; this.leftEcharts16 = echarts.init(this.$refs["leftEcharts16"]); // var ROOT_PATH = 'https://echarts.apache.org/examples'; let option = { backgroundColor: "#00000000", globe: { globeRadius: 85, baseTexture: "./img/3D/world1.jpg", heightTexture: "./img/3D/world1.jpg", displacementScale: 0.04, shading: "realistic", // environment: './img/3D/world2.jpg', realisticMaterial: { roughness: 0.9, }, postEffect: { enable: true, }, light: { main: { intensity: 1, shadow: true, }, }, }, }; that.leftEcharts16.setOption(option); }, // 回到中国地图 backChina () { let that = this if (!this.mapShow) { return } this.mapShow = false that.leftEcharts12.dispose() that.leftEcharts14.dispose() that.leftEcharts9.dispose() that.leftEcharts15.dispose() that.leftEcharts13.dispose() that.shanxiMap.dispose() setTimeout(() => { that.chinaEchartsFun() that.leftEcharts16Fun() }); }, tipShow1Fun (e, name) { this.closeTap() this.titleUrl = e this.titleName = name this.$nextTick(() => { this.tipShow1 = true }) }, // 关闭所有弹窗的方法 closeTap () { this.tipShow1 = false }, //点击弹窗左半部分 popLeftClick () { if (this.titleUrl == '2.png') { this.titleUrl = '3.png' } else if (this.titleUrl == '7.png') { this.titleUrl = '8.png' } else if (this.titleUrl == '3.png') { this.titleUrl = '2.png' } else if (this.titleUrl == '8.png') { this.titleUrl = '7.png' } else if (this.titleUrl == '5.png') { this.titleUrl = '2.png' } else if (this.titleUrl == '10.png') { this.titleUrl = '7.png' } }, //点击弹窗右半部分 poprightClick () { if (this.titleUrl == '2.png') { this.titleUrl = '5.png' } else if (this.titleUrl == '7.png') { this.titleUrl = '10.png' } else if (this.titleUrl == '5.png') { this.titleUrl = '2.png' } else if (this.titleUrl == '10.png') { this.titleUrl = '7.png' } else if (this.titleUrl == '3.png') { this.titleUrl = '2.png' } else if (this.titleUrl == '8.png') { this.titleUrl = '7.png' } }, // 单个柱状图的弹窗 showChartLTipSingle (e, location, type, param, mdnb_textfield11, mdnb_textfield13, mdnb_textfield16, mdnb_textfield23, typeCTwo, paramCTwo, portType, num) { this.projectNum = num this.closeTap() this.titleName = e this.echartSingleTipShow = true if (this.versions) { if (location == 'center') { this.centerPenetrateOne(type, param, 1, typeCTwo, paramCTwo, portType) } if (location == 'left') { this.leftPenetrateOne(mdnb_textfield11, mdnb_textfield13, mdnb_textfield16, mdnb_textfield23, 1, type, param) } } else { setTimeout(() => { this.initChartLTip(location) }) } }, initChartLTip (location, mdnb_textfield11, mdnb_textfield13, mdnb_textfield16, mdnb_textfield23, typeCTwo, paramCTwo, portType) { this.myChartTip1 = echarts.init(document.getElementById("echartSingleTip")); if (!(this.titleName == '项目数量' || this.titleName == '项目总数')) { common3 = common3.map((item) => Number(item) + 1) } let option = { grid: { top: 40, right: 0, left: 60, bottom: 70, }, tooltip: { show: true, trigger: "axis", axisPointer: { // 坐标轴指示器,坐标轴触发有效 type: "shadow", // 默认为直线,可选为:'line' | 'shadow' }, formatter: data => { if (this.titleName == '项目数量' || this.titleName == '项目总数') { return `${data[0].name}
${data[0].seriesName}:${that.numFormat(data[0].value)}个` } else { return `${data[0].name}
${data[0].seriesName}:${that.numFormat(that.numSub(data[0].value, 1))}亿` } }, textStyle: { color: '#FFF', // 文字的颜色 fontSize: '20', // 文字字体大小 fontFamily: 'Microsoft YaHei' }, }, xAxis: { data: commonCompany, axisTick: { show: false, }, // x轴的字体颜色 axisLabel: { rotate: 40, textStyle: { color: "white", fontSize: '20', fontFamily: 'Microsoft YaHei' }, }, //y轴线的颜色以及宽度 axisLine: { show: true, lineStyle: { color: "#1E5389", width: 1, type: "solid", }, }, }, yAxis: { minInterval: 1, // onZero:true, name: (this.titleName == '项目数量' || this.titleName == '项目总数') ? '个' : '亿', nameTextStyle: {//y轴上方单位的颜色 color: '#fff', fontSize: '20', fontFamily: 'Microsoft YaHei' }, axisTick: { lineStyle: { color: "#18416F", }, }, // y轴的字体颜色 axisLabel: { textStyle: { color: "white", fontSize: '20' }, formatter: function (value) { if (that.titleName == '项目数量' || that.titleName == '项目总数') { return value } else { return value === 1 ? 0 : value } } }, splitLine: { show: true, lineStyle: { color: '#68b4dd66', type: 'dashed', }, }, //y轴线的颜色以及宽度 axisLine: { show: true, lineStyle: { color: "#1E5389", width: 1, type: "solid", }, }, }, series: [ { name: (this.titleName == '项目数量' || this.titleName == '项目总数') ? '总数量' : "总额度", type: "bar", data: common3, showBackground: false, backgroundStyle: { color: "#18416F", }, barWidth: "30%", itemStyle: { // barBorderRadius: [10, 10, 0, 0], color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [ { offset: 0, color: '#082550', }, { offset: 1, color: '#957DFF', }, ]), }, }, ], legend: { // data: ["2022年额度", "2023年额度"], data: (this.titleName == '项目数量' || this.titleName == '项目总数') ? ["总数量"] : ["总额度"], textStyle: { // 图列内容样式 color: "#fff", // 字体颜色 fontSize: "20", fontFamily: 'Microsoft YaHei' }, right: 'center', y: 5, // 小图标的宽高 }, }; if (!(this.titleName == '项目数量' || this.titleName == '项目总数')) { option.yAxis.min = 1 option.yAxis.type = 'log' option.yAxis.logBase = 5 } tools.loopShowTooltip(this.myChartTip1, option, { interval: 2000, loopSeries: true, }) let that = this that.myChartTip1.on('click', function (param) { if (that.versions) { if (location == 'right') { that.rightPenetrateTwo(that.rightPenetrateTwo.modelName, '', that.findCode(param.name)) } else if (location == 'left') { that.leftPenetrateTwo(mdnb_textfield11, mdnb_textfield13, mdnb_textfield16, mdnb_textfield23, param.name, that.projectNum) } else if (location == 'center') { that.centerPenetrateTwo(typeCTwo, paramCTwo, that.findCode(param.name), portType) } } else { that.projectListTipShow = true } }) that.myChartTip1.setOption(option); }, chooseTime (value) { let that = this // this.backChina() // this.year = value // that.fling = false // that.destroyCharts() // that.closeTap() this.pullShow = false setTimeout(item => { // that.comeIn() }) }, changeTopColor () { this.list = document.getElementsByClassName('row-item') for (var i = 0; i < this.list.length; i++) { if (i == 1) { this.list[i].classList.add('light') } else { this.list[i].classList.remove('light') } } this.leftEcharts11Fun() }, }, });