From b85755ed335839413cbd6dc8e6c6e424bffc523d Mon Sep 17 00:00:00 2001 From: xbx <1827135378@qq.com> Date: Sat, 20 Apr 2024 20:57:10 +0800 Subject: [PATCH] =?UTF-8?q?=E9=A6=96=E9=A1=B5=E4=BC=98=E5=8C=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/cet/cet-ana-1.vue | 19 +++--- src/views/dashboard/Analysis/index.vue | 92 ++++++++++++-------------- 2 files changed, 52 insertions(+), 59 deletions(-) diff --git a/src/views/cet/cet-ana-1.vue b/src/views/cet/cet-ana-1.vue index 1bd2719..fda3e71 100644 --- a/src/views/cet/cet-ana-1.vue +++ b/src/views/cet/cet-ana-1.vue @@ -64,7 +64,7 @@
-
+
@@ -196,10 +196,12 @@ export default { seriesData.push({ name: i + '级累计总通过率', type: 'bar', - // barWidth: '30%', + //设置柱状图大小 + barWidth: "10%", data: yData, + //柱子间距 + barGap: '30%', //颜色 - itemStyle: { normal: { label: { @@ -208,7 +210,7 @@ export default { formatter: '{c}%', textStyle: { //数值样式 color: 'black', - fontSize: 13 + fontSize: 10 }, }, color: colors[j++] @@ -253,9 +255,6 @@ export default { title: { text: "本批次学院通过率排名", }, - - - tooltip: { trigger: 'axis', axisPointer: { @@ -290,7 +289,7 @@ export default { left: '3%', right: '4%', bottom: '3%', - containLabel: true + containLabel: true, }, xAxis: [ { @@ -323,7 +322,9 @@ export default { name: '累计总通过率', type: 'bar', data: seriesData[0].data, - barWidth: '60%', + //设置柱状图大小 + barWidth: 20, + // barWidth: '60%', itemStyle: { normal: { label: { diff --git a/src/views/dashboard/Analysis/index.vue b/src/views/dashboard/Analysis/index.vue index f3d400e..810ea3e 100644 --- a/src/views/dashboard/Analysis/index.vue +++ b/src/views/dashboard/Analysis/index.vue @@ -14,14 +14,14 @@
- 学院 / 专业总人数: {{ total }} + {{ this.totalName }}总人数:{{ total }} 累计通过人数: {{ passNumberBottom }} 累计总通过率: {{ passRateBottom }}
@@ -52,7 +52,7 @@ export default { dataSourceCet4: [], columns: [ { - title: '年级', + title: '学年', dataIndex: 'grade', key: 'grade', align: 'center', @@ -73,7 +73,7 @@ export default { align: 'center', }, { - title: '新通过人数', + title: '通过人数', dataIndex: 'passNumber', key: 'passNumber', align: 'center', @@ -101,6 +101,7 @@ export default { getCollegeMajor: '/cet/getCollegeMajor' }, total: 0, + totalName: '', passNumberBottom: 0, passRateBottom: 0, passRatePie: [], @@ -187,10 +188,11 @@ export default { console.log("tableData", tableData); this.dataSourceCet4 = tableData;//表格数据 this.total = result.total;//总人数 + this.totalName = result.totalName;//总人数名称 this.passNumberBottom = result.passNumber;//通过人数 this.passRateBottom = (result.passRate * 100).toFixed(1) + '%';//通过率 //内置饼图 - this.passRatePie =[]//清空数据 + this.passRatePie = []//清空数据 this.passRatePie.push({ value: result.passRate, name: '已通过' }); this.passRatePie.push({ value: 1 - result.passRate, name: '未通过' }) piedata.push({ value: (1 - passrate).toFixed(3), name: '未通过' });//外置饼图 @@ -215,11 +217,11 @@ export default { trigger: 'item', confine: false, //字体大小 - itemStyle:{ - fontSize:100 + itemStyle: { + fontSize: 100 } }, - + title: { text: '四级通过率分析', left: 'left', @@ -232,70 +234,60 @@ export default { top: '5%', left: 'center' }, + color: ['#ff2d51', '#ff4777', '#f47983', '#ffb3a7', '#91cc75'], series: [ //内圈饼图 - { - name: '四级通过率', - type: 'pie', - radius: ['0', '30%'], - avoidLabelOverlap: false, - itemStyle: { - borderRadius: 3, - borderColor: '#fff', - borderWidth: 2, - normal: { - color: function (colors) { - var colorList = ['#00CD66', '#FF6A6A']; - return colorList[colors.dataIndex]; - } - }, - }, - label: { - position: 'inner', - fontSize: 14 - }, - emphasis: { - label: { - show: true, - fontSize: 20, - fontWeight: 'bold' - } - }, - data: this.passRatePie - }, + // { + // name: '四级通过率', + // type: 'pie', + // radius: ['0', '30%'], + // avoidLabelOverlap: false, + // itemStyle: { + // borderRadius: 3, + // borderColor: '#fff', + // borderWidth: 2, + // }, + // label: { + // position: 'inner', + // fontSize: 14 + // }, + // emphasis: { + // label: { + // show: true, + // fontSize: 20, + // fontWeight: 'bold' + // } + // }, + // data: this.passRatePie + // }, //外圈饼图 { name: '四级通过率', type: 'pie', - radius: ['40%', '60%'], - avoidLabelOverlap: false, + radius: ['35%', '60%'], itemStyle: { borderRadius: 10, borderColor: '#fff', borderWidth: 2, - normal: { - color: function (colors) { - var colorList = ['#008B45', '#00CD66', '#00EE76', '#baf5bf', '#FF6A6A']; - return colorList[colors.dataIndex]; - } - }, }, label: { show: true, - fontSize:14, + fontSize: 14, overflow: 'truncate' }, emphasis: { + itemStyle: { + shadowBlur: 10, + shadowOffsetX: 0, + shadowColor: 'rgba(0, 0, 0, 0.5)' + }, label: { show: true, - fontSize: 20, + fontSize: 15, fontWeight: 'bold' } }, - // labelLine: { - // show: false - // }, data: piedata } ]