//安全防范设施改造情况数据 let aqsecurity = ( chartData = [ { value: 800, name: '主料' }, { value: 200, name: '辅料' }, { value: 300, name: '包装材料' } ] ) => { var color = ['#92cd76', '#5370c7', '#ee6666'] const sum = chartData.reduce((per, cur) => per + cur.value, 0) let option = { background: '#fff', title: { show: true, text: ' ', subtext: sum + '家', x: '29%', y: '33%', textStyle: { color: '#778CA2', fontSize: 20, fontWeight: '400' }, subtextStyle: { color: 'rgba(0,0,0,0.85)', fontSize: 20, fontWeight: '400' }, textAlign: 'center' }, legend: { orient: 'vertical', // icon: "diamond", left: '55%', icon: 'circle', textStyle: { color: '#373737', rich: { name: { color: 'rgba(0,0,0,0.65)' }, symbol: { color: 'rgba(0,0,0,0.45)' }, percent: { color: 'rgba(0,0,0,0.45)' }, value: { color: 'rgba(0,0,0,0.65)' } } }, top: 'center', right: '5%', itemGap: 14, itemHeight: 24, itemWidth: 24, data: chartData.name, formatter: function (name) { let obj = {} if (name) { obj = chartData.find(item => item.name === name) } return `{name|${name}}{symbol| }{value|${obj.value || 0}家}{percent|${ obj.value && ((obj.value / sum) * 100).toFixed(0) }%}` } }, series: [ { name: '', type: 'pie', roundCap: true, radius: ['40%', '70%'], center: ['30%', '50%'], startAngle: 180, //起始角度 data: chartData, itemStyle: { borderColor: '#fff', borderWidth: 1, color: function (params) { return color[params.dataIndex] } }, labelLine: { length: 8, length2: 16, lineStyle: { width: 1 } }, label: { show: false, fontFamily: 'ysbth', position: 'outside', padding: [0, -4, 0, -4], formatter(params) { if (params.name === '') { return '' } return `${params.percent.toFixed(0)}%` }, color: '#fff', fontSize: '14px', lineHeight: 10 } } ] } return option } //柱状图堆叠 let ddsecurity = ( data = { bankingGa38: [1, 2, 3], offlineGa38: [1, 2, 3], onlineGa38: [1, 2, 3] } ) => { let option = { tooltip: { trigger: 'axis', axisPointer: { type: 'shadow' // 'shadow' as default; can also be 'line' or 'shadow' } }, grid: { left: '3%', right: '4%', bottom: '3%', containLabel: true }, xAxis: { type: 'value', axisLine: { lineStyle: { color: '#51688a' } } }, yAxis: { type: 'category', data: ['在行式自助银行', '离行式自助银行', '营业网点'] }, series: [ { name: '在行式自助银行', type: 'bar', color: '#5370c7', stack: 'total', label: { show: true }, emphasis: { focus: 'series' }, data: data.onlineGa38 }, { name: '离行式自助银行', type: 'bar', stack: 'total', color: '#92cd76', label: { show: true }, emphasis: { focus: 'series' }, data: data.offlineGa38 }, { name: '营业网点', type: 'bar', stack: 'total', color: '#ee6666', label: { show: true }, emphasis: { focus: 'series' }, data: data.bankingGa38 } ] } return option } let securityPrecautions = (data = []) => { var colors = ['#ee6666', '#5370c7'] let option = { title: { text: '', left: 'left' }, tooltip: { trigger: 'item' }, legend: { orient: 'vertical', top: 'center', left: '58%', data: data, formatter: function (name) { var data = option.series[0].data var total = 0 var tarValue for (var i = 0; i < data.length; i++) { total += data[i].value if (data[i].name == name) { tarValue = data[i].value } } var v = tarValue var p = Math.round((tarValue / total) * 100) return `${name} ${v}家 ${p}%` } }, series: [ { center: ['30%', '50%'], type: 'pie', radius: '70%', data: data, itemStyle: { normal: { shadowBlur: 1, color: function (param) { // console.log(param.dataIndex) return colors[param.dataIndex] } } }, label: { position: 'inner', textStyle: { fontSize: 14, color: '#181818' }, formatter: params => { return `${params.value}` } }, labelLine: { show: false }, emphasis: { itemStyle: { shadowBlur: 10, shadowOffsetX: 0 } } } ] } return option } //网点业务总览 // [ // { value: 666, name: '巡查上报' }, // { value: 193, name: '自行处置' }, // { value: 300, name: '微信市民举报' }, // { value: 200, name: '微治理上报' }, // { value: 100, name: '视频抓拍' } // ] //保安情况 let dotData = ( title = '', data = [], num = 0, listNames= ['一类库', '二类库', '三类库', '四类库'] ) => { var colors = ['#146de0', '#27ef5e', '#ffc140', '#d151d8', 'red'] let option = { xAxis: { type: 'category', data: listNames }, yAxis: { type: 'value' }, series: [ { show: true, data: data, type: 'bar', label: { show:true, //数值展示的位置 textStyle: { color: 'black', fontSize: 12 }, position: 'top', // 顶部显示 formatter: function(params) { return data[params.dataIndex] + '(' + ((data[params .dataIndex] /num*100)).toFixed(0) + '%)' } }, barWidth: 40, color: '#5370c7', backgroundStyle: { color: 'rgba(220, 220, 220, 0.8)' } } ] } return option } var get = function (e) { var newStr = ' ' var start, end var name_len = e.name.length //每个内容名称的长度 var max_name = 5 //每行最多显示的字数 var new_row = Math.ceil(name_len / max_name) // 最多能显示几行,向上取整比如2.1就是3行 if (name_len > max_name) { //如果长度大于每行最多显示的字数 for (var i = 0; i < new_row; i++) { //循环次数就是行数 var old = '' //每次截取的字符 start = i * max_name //截取的起点 end = start + max_name //截取的终点 if (i == new_row - 1) { //最后一行就不换行了 old = e.name.substring(start) } else { old = e.name.substring(start, end) + '\n' } newStr += old //拼接字符串 } } else { //如果小于每行最多显示的字数就返回原来的字符串 newStr = e.name } return newStr + `(${e.value})` } //在行式自助银行 let ZHSData = ( title = '在行式自助银行', data = [ // { value: 666, name: '穿墙式设备' }, // { value: 193, name: '大堂式设备' } ] ) => { let option = { series: [ { color: ['#5470c6', '#91cc75', '#ee6666', '#73c0de'], name: '', type: 'pie', radius: '50%', center: ['50%', '50%'], data: data, label: { normal: { formatter: get, rich: { b: { width: 20, fontSize: 12 } }, textStyle: { color: '#656565' // 改变标示文字的颜色 } } }, emphasis: { itemStyle: { shadowBlur: 10, shadowOffsetX: 0, shadowColor: 'rgba(0, 0, 0, 0.5)' } } } ] } return option } //日常履职完成率 let resumption = (data, type = 0) => { var getzszy = [] //数据点名称 var getzswcl = [] //招生完成率 var getzswcl2 = [] //招生完成率 var getzswclzd = [] //招生完成率100% if (type == 0) { if (data && data.length > 0) { getzszy = data.map(item => item.orgName) getzswcl = data.map(item => parseInt(item.rate * 100)) getzswcl2 = data.map(item => parseInt(item.rate * 100) + '%') } } else { if (data && data.length > 0) { getzszy = data.map(item => item.orgName) getzswcl = data.map(item => { if (item.isNo) { return parseInt(item.rate * 100) } else { return parseInt(item.rate) } }) getzswcl2 = data.map(item => { if (item.isNo) { return parseInt(item.rate * 100) + '%' } else { return item.rate + '项' } }) } } for (let i = 0; i < getzswcl.length; i++) { if (getzswcl[i] > 100) { getzswcl[i] = 100 } getzswclzd.push(100) } var num = type == 0 ? '18%' : '25%' var numleft = type == 0 ? '35%' : '25%' let option = { grid: { right: num, bottom: '3%', left: numleft, top: '3%' }, tooltip: { trigger: 'axis', axisPointer: { type: 'none' }, formatter: function (params) { return getzszy[params[0].dataIndex] + '
完成率: ' + getzswcl2[params[0].dataIndex] } }, xAxis: { show: false, type: 'value' }, yAxis: [ { type: 'category', inverse: true, axisLabel: { show: true, textStyle: { color: '#666666', fontSize: '13' } }, splitLine: { show: false }, axisTick: { show: false }, axisLine: { show: false }, data: getzszy }, { type: 'category', inverse: true, axisTick: 'none', axisLine: 'none', show: true, axisLabel: { textStyle: { color: '#333333', fontSize: '13' }, // formatter: '{value}%' formatter: function (value, index) { return value } }, data: getzswcl2 } ], series: [ { name: '值', type: 'bar', zlevel: 1, itemStyle: { normal: { barBorderRadius: 5, color: '#4E7BFE' } }, barWidth: 10, data: getzswcl }, { name: '背景', type: 'bar', barWidth: 10, barGap: '-100%', data: getzswclzd, itemStyle: { normal: { color: 'rgba(103,150,253,0.3)', barBorderRadius: 5 } } } ] } return option } export { securityPrecautions, resumption, dotData, ZHSData, aqsecurity, ddsecurity }