diff --git a/src/views/3DOverview/components/RightContentFaultAnalysis.vue b/src/views/3DOverview/components/RightContentFaultAnalysis.vue index 1eea1c5..4e7ef0d 100644 --- a/src/views/3DOverview/components/RightContentFaultAnalysis.vue +++ b/src/views/3DOverview/components/RightContentFaultAnalysis.vue @@ -1,6 +1,11 @@ @@ -101,8 +106,8 @@ export default { configs: { title: { textAlign: 'center', - left: '63%', - top: '35%', + left: '64%', + top: '48%', text: demoData.reduce((prev, curr) => prev + curr.value, 0), textStyle: { color: '#fff', @@ -117,10 +122,11 @@ export default { fontWeight: 'lighter' } }, + legend: { top: 0, bottom: 0, - left: -15, + left: 0, orient: 'vertical', icon: 'none', itemGap: 8, @@ -204,8 +210,8 @@ export default { { name: 'PieForm', type: 'pie', - center: ['65%', '50%'], - radius: ['60%', '80%'], + center: ['65%', '60%'], + radius: ['42%', '60%'], avoidLabelOverlap: true, label: { formatter: params => { @@ -287,19 +293,21 @@ export default { const fs5 = this.calcFontsize(5 /** px*/) const fs8 = this.calcFontsize(8 /** px*/) const fs10 = this.calcFontsize(10 /** px*/) - const fs14 = this.calcFontsize(14 /** px*/) + const fs12 = this.calcFontsize(12 /** px*/) const fs16 = this.calcFontsize(16 /** px*/) + const titleSize = this.calcFontsize(22 /** px*/) + const subtitleSize = this.calcFontsize(14 /** px*/) - this.configs.title.textStyle.fontSize = fs14 - this.configs.title.subtextStyle.fontSize = fs10 + this.configs.title.textStyle.fontSize = titleSize + this.configs.title.subtextStyle.fontSize = subtitleSize - this.configs.legend.top = '10%' - this.configs.legend.itemGap = 0 + this.configs.legend.top = '24%' + this.configs.legend.itemGap = fs8 this.configs.legend.itemWidth = fs8 - this.configs.legend.textStyle.rich.a.fontSize = fs10 + this.configs.legend.textStyle.rich.a.fontSize = fs12 this.configs.legend.textStyle.rich.a.lineHeight = fs16 - this.configs.legend.textStyle.rich.b.fontSize = fs10 + this.configs.legend.textStyle.rich.b.fontSize = fs12 // this.configs.legend.textStyle.rich.b.lineHeight = fs16 this.configs.legend.textStyle.rich.c.width = fs8 this.configs.legend.textStyle.rich.c.height = fs8 @@ -317,11 +325,11 @@ export default { this.configs.legend.textStyle.rich.g.height = fs8 this.configs.legend.textStyle.rich.g.borderRadius = fs5 - this.configs.series[0].label.rich.first.fontSize = fs10 - this.configs.series[0].label.rich.second.fontSize = fs10 - this.configs.series[0].label.rich.third.fontSize = fs10 - this.configs.series[0].label.rich.fourth.fontSize = fs10 - this.configs.series[0].label.rich.fifth.fontSize = fs10 + this.configs.series[0].label.rich.first.fontSize = fs12 + this.configs.series[0].label.rich.second.fontSize = fs12 + this.configs.series[0].label.rich.third.fontSize = fs12 + this.configs.series[0].label.rich.fourth.fontSize = fs12 + this.configs.series[0].label.rich.fifth.fontSize = fs12 this.chart.setOption(this.configs) } @@ -330,9 +338,9 @@ export default {