From 3f0d3ffb8a64b7eff32cde91a0ab13922a2a3729 Mon Sep 17 00:00:00 2001
From: 疯狂的狮子li <15040126243@163.com>
Date: 星期四, 28 十月 2021 09:40:02 +0800
Subject: [PATCH] Merge branch 'master' of https://gitee.com/y_project/RuoYi-Vue into dev
---
ruoyi-ui/src/views/dashboard/RaddarChart.vue | 232 +++++++++++++++++++++++++++++-----------------------------
1 files changed, 116 insertions(+), 116 deletions(-)
diff --git a/ruoyi-ui/src/views/dashboard/RaddarChart.vue b/ruoyi-ui/src/views/dashboard/RaddarChart.vue
index 9831abf..6823af3 100644
--- a/ruoyi-ui/src/views/dashboard/RaddarChart.vue
+++ b/ruoyi-ui/src/views/dashboard/RaddarChart.vue
@@ -1,116 +1,116 @@
-<template>
- <div :class="className" :style="{height:height,width:width}" />
-</template>
-
-<script>
-import echarts from 'echarts'
-require('echarts/theme/macarons') // echarts theme
-import resize from './mixins/resize'
-
-const animationDuration = 3000
-
-export default {
- mixins: [resize],
- props: {
- className: {
- type: String,
- default: 'chart'
- },
- width: {
- type: String,
- default: '100%'
- },
- height: {
- type: String,
- default: '300px'
- }
- },
- data() {
- return {
- chart: null
- }
- },
- mounted() {
- this.$nextTick(() => {
- this.initChart()
- })
- },
- beforeDestroy() {
- if (!this.chart) {
- return
- }
- this.chart.dispose()
- this.chart = null
- },
- methods: {
- initChart() {
- this.chart = echarts.init(this.$el, 'macarons')
-
- this.chart.setOption({
- tooltip: {
- trigger: 'axis',
- axisPointer: { // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
- type: 'shadow' // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
- }
- },
- radar: {
- radius: '66%',
- center: ['50%', '42%'],
- splitNumber: 8,
- splitArea: {
- areaStyle: {
- color: 'rgba(127,95,132,.3)',
- opacity: 1,
- shadowBlur: 45,
- shadowColor: 'rgba(0,0,0,.5)',
- shadowOffsetX: 0,
- shadowOffsetY: 15
- }
- },
- indicator: [
- { name: 'Sales', max: 10000 },
- { name: 'Administration', max: 20000 },
- { name: 'Information Techology', max: 20000 },
- { name: 'Customer Support', max: 20000 },
- { name: 'Development', max: 20000 },
- { name: 'Marketing', max: 20000 }
- ]
- },
- legend: {
- left: 'center',
- bottom: '10',
- data: ['Allocated Budget', 'Expected Spending', 'Actual Spending']
- },
- series: [{
- type: 'radar',
- symbolSize: 0,
- areaStyle: {
- normal: {
- shadowBlur: 13,
- shadowColor: 'rgba(0,0,0,.2)',
- shadowOffsetX: 0,
- shadowOffsetY: 10,
- opacity: 1
- }
- },
- data: [
- {
- value: [5000, 7000, 12000, 11000, 15000, 14000],
- name: 'Allocated Budget'
- },
- {
- value: [4000, 9000, 15000, 15000, 13000, 11000],
- name: 'Expected Spending'
- },
- {
- value: [5500, 11000, 12000, 15000, 12000, 12000],
- name: 'Actual Spending'
- }
- ],
- animationDuration: animationDuration
- }]
- })
- }
- }
-}
-</script>
+<template>
+ <div :class="className" :style="{height:height,width:width}" />
+</template>
+
+<script>
+import echarts from 'echarts'
+require('echarts/theme/macarons') // echarts theme
+import resize from './mixins/resize'
+
+const animationDuration = 3000
+
+export default {
+ mixins: [resize],
+ props: {
+ className: {
+ type: String,
+ default: 'chart'
+ },
+ width: {
+ type: String,
+ default: '100%'
+ },
+ height: {
+ type: String,
+ default: '300px'
+ }
+ },
+ data() {
+ return {
+ chart: null
+ }
+ },
+ mounted() {
+ this.$nextTick(() => {
+ this.initChart()
+ })
+ },
+ beforeDestroy() {
+ if (!this.chart) {
+ return
+ }
+ this.chart.dispose()
+ this.chart = null
+ },
+ methods: {
+ initChart() {
+ this.chart = echarts.init(this.$el, 'macarons')
+
+ this.chart.setOption({
+ tooltip: {
+ trigger: 'axis',
+ axisPointer: { // 鍧愭爣杞存寚绀哄櫒锛屽潗鏍囪酱瑙﹀彂鏈夋晥
+ type: 'shadow' // 榛樿涓虹洿绾匡紝鍙�変负锛�'line' | 'shadow'
+ }
+ },
+ radar: {
+ radius: '66%',
+ center: ['50%', '42%'],
+ splitNumber: 8,
+ splitArea: {
+ areaStyle: {
+ color: 'rgba(127,95,132,.3)',
+ opacity: 1,
+ shadowBlur: 45,
+ shadowColor: 'rgba(0,0,0,.5)',
+ shadowOffsetX: 0,
+ shadowOffsetY: 15
+ }
+ },
+ indicator: [
+ { name: 'Sales', max: 10000 },
+ { name: 'Administration', max: 20000 },
+ { name: 'Information Techology', max: 20000 },
+ { name: 'Customer Support', max: 20000 },
+ { name: 'Development', max: 20000 },
+ { name: 'Marketing', max: 20000 }
+ ]
+ },
+ legend: {
+ left: 'center',
+ bottom: '10',
+ data: ['Allocated Budget', 'Expected Spending', 'Actual Spending']
+ },
+ series: [{
+ type: 'radar',
+ symbolSize: 0,
+ areaStyle: {
+ normal: {
+ shadowBlur: 13,
+ shadowColor: 'rgba(0,0,0,.2)',
+ shadowOffsetX: 0,
+ shadowOffsetY: 10,
+ opacity: 1
+ }
+ },
+ data: [
+ {
+ value: [5000, 7000, 12000, 11000, 15000, 14000],
+ name: 'Allocated Budget'
+ },
+ {
+ value: [4000, 9000, 15000, 15000, 13000, 11000],
+ name: 'Expected Spending'
+ },
+ {
+ value: [5500, 11000, 12000, 15000, 12000, 12000],
+ name: 'Actual Spending'
+ }
+ ],
+ animationDuration: animationDuration
+ }]
+ })
+ }
+ }
+}
+</script>
--
Gitblit v1.9.3