From da4d9e70d2c37f59a365b0fb88ad70e8c1ba79b4 Mon Sep 17 00:00:00 2001 From: yangfeng <wanwan926_4@163.com> Date: 星期一, 11 十二月 2023 10:25:01 +0800 Subject: [PATCH] 机器开机率优化 --- src/views/cockpitPage/components/DeviceChart.vue | 50 +++++++++++++++++++++++++++++++++++++++++--------- 1 files changed, 41 insertions(+), 9 deletions(-) diff --git a/src/views/cockpitPage/components/DeviceChart.vue b/src/views/cockpitPage/components/DeviceChart.vue index 79d1705..a39f3d6 100644 --- a/src/views/cockpitPage/components/DeviceChart.vue +++ b/src/views/cockpitPage/components/DeviceChart.vue @@ -57,13 +57,22 @@ myChart = echarts.init(chartDom); let option; let lineColor = "#35ddc74d"; + let spirit = "/cockpitPage/order-bg.png"; if (data) { option = { - color: ["#00FFFF", "#dcb018"], + color: ["#00FFFF", "#fccd1d"], tooltip: { trigger: "axis", axisPointer: { type: "none", + }, + textStyle: { + color: "#00FFFF", + }, + borderColor: "#00FFFF", + backgroundColor: "#238d8d6b", + valueFormatter: function (value) { + return value + "%"; }, }, grid: { @@ -79,6 +88,9 @@ show: false, startValue: that.startValue, // 浠庡ご寮�濮� endValue: that.endValue, // 涓�娆℃�у睍绀哄嚑涓� + zoomOnMouseWheel: false, + moveOnMouseWheel: true, + moveOnMouseMove: true, }, ], legend: { @@ -104,10 +116,10 @@ // rotate:45, margin: 10, show: true, - fontSize:12, + fontSize: 12, textStyle: { color: function (params, index) { - let colorList = ["#dcb018", "#00FFFF"]; + let colorList = ["#fccd1d", "#00FFFF"]; if (index % 2 == 0) { return colorList[0]; } else { @@ -154,31 +166,51 @@ axisTick: { show: false, }, - axisLabel: { textStyle: { color: "#00FFFF", }, - formatter: "{value}%", + formatter: function (value) { + return `${value}%`; + }, }, }, ], series: [ { - type: "bar", + type: "pictorialBar", name: "", - barWidth: "15", + symbol: spirit, + symbolRepeat: true, + symbolMargin: "25%", + symbolClip: true, + symbolSize: [4, 11], + barCategoryGap: "40%", label: { show: true, position: "right", - color: "#00FFFF", + formatter: function (params) { + if (params.dataIndex % 2 == 0) { + return `{a|${params.value}%}`; + } else { + return `{b|${params.value}%}`; + } + }, + rich: { + a: { + color: "#00FFFF", + }, + b: { + color: "#fccd1d", + }, + }, }, itemStyle: { normal: { //鏌卞舰鍥惧渾瑙掞紝鍒濆鍖栨晥鏋� barBorderRadius: [4, 4, 0, 0], color: function (params) { - let colorList = ["#dcb018", "#00FFFF"]; + let colorList = ["#fccd1d", "#00FFFF"]; if (params.dataIndex % 2 == 0) { return colorList[0]; } else { -- Gitblit v1.8.0