diff --git a/src/views/board/board4/index.vue b/src/views/board/board4/index.vue index 66c2b09..011a494 100644 --- a/src/views/board/board4/index.vue +++ b/src/views/board/board4/index.vue @@ -107,6 +107,9 @@
+
+ +
@@ -221,6 +224,70 @@ export default { }, ] }) + this.$refs.chart4.setData({ + radar: { + center: ["30%", "50%"], + radius: '40%', + shape: 'circle', + splitNumber: 1, + splitLine: { + lineStyle: { + color: '#fff4', // 最外圈颜色 + width: 1 + } + }, + splitArea: { + show: false + }, + axisLine: { + show: false + }, + axisNameGap: 3, + axisName: { + rotation: 90, + rotate: 90, + fontSize: 8, + color: '#ddd', + }, + indicator: Array(8).fill(0).map((item, index) => { + return {name: '产品' + (index + 1), index, max: 100} + }), + }, + series: [ + { + name: ' ', + type: 'radar', + symbolSize: 3, + itemStyle: { + color: '#FBFCFC' + }, + lineStyle: { + color: '#478EEE', + width: 1, + }, + data: [ + { + value: Array(8).fill(0).map((item, index) => { + return 90 + Math.floor(Math.random() * 10); + }), + name: 'Allocated Budget', + areaStyle: { + color: { + type: 'radial', + x: 0.5, + y: 0.5, + r: 0.5, + colorStops: [ + {offset: 0, color: '#fff0'}, + {offset: 1, color: '#4C92F266'} + ] + }, + } + } + ] + } + ] + }) let barData = Array(8).fill(0).map((item, index) => { return 5 + Math.floor(Math.random() * 8); }) @@ -647,4 +714,12 @@ export default { width: 23.8%; height: 29%; } + +.chart4 { + position: absolute; + top: 66%; + left: 3.3%; + width: 23.8%; + height: 29%; +} \ No newline at end of file diff --git a/src/views/board/board5/index.vue b/src/views/board/board5/index.vue index 03c022c..19979c9 100644 --- a/src/views/board/board5/index.vue +++ b/src/views/board/board5/index.vue @@ -63,8 +63,13 @@
+
+
+ 切换显示 +
+
-
+
{{ i }}
SC-228NE
@@ -88,7 +93,9 @@ export default { }, name: "Liner", data() { - return {} + return { + toggle: false + } }, mounted() { let data = [ @@ -640,4 +647,27 @@ export default { } } } + +.toggle { + position: absolute; + top: 55.2%; + left: 80.2%; + width: 10vw; + height: 5vw; + + .btn { + display: none; + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + } + + &:hover { + .btn { + display: inline-block; + } + } + +} \ No newline at end of file