From 8b295d4ad2ae8e853e0e2f254f45703e5892bc3f Mon Sep 17 00:00:00 2001 From: unitwk Date: Wed, 24 May 2023 14:25:54 +0800 Subject: [PATCH] Feat: chart support 10 min --- src/app/service/chart_option.js | 58 +++++++++++++++++++++++++++++---- src/app/views/Services.vue | 4 +-- src/language/en_us.json | 4 ++- src/language/zh_cn.json | 4 ++- 4 files changed, 60 insertions(+), 10 deletions(-) diff --git a/src/app/service/chart_option.js b/src/app/service/chart_option.js index 9e83d50f..0fac9a47 100755 --- a/src/app/service/chart_option.js +++ b/src/app/service/chart_option.js @@ -16,9 +16,25 @@ export function getDefaultOption() { series: [ { type: "line", - areaStyle: {}, + smooth: true, - symbol: "none" + symbol: "none", + lineStyle: { + color: "rgb(67, 145, 250,0.9)", + width: 1 + }, + areaStyle: { + color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ + { + offset: 0, + color: "rgb(67, 145, 250,0.8)" + }, + { + offset: 1, + color: "rgb(17, 95, 200,0)" + } + ]) + } } ] }; @@ -39,9 +55,24 @@ export function getStatusChartOption1() { series: [ { type: "line", - areaStyle: {}, smooth: true, - symbol: "none" + symbol: "none", + lineStyle: { + color: "rgb(67, 145, 250,0.9)", + width: 1 + }, + areaStyle: { + color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ + { + offset: 0, + color: "rgb(67, 145, 250,0.8)" + }, + { + offset: 1, + color: "rgb(17, 95, 200,0)" + } + ]) + } } ] }; @@ -63,9 +94,24 @@ export function getStatusChartOption2() { { name: "Running", type: "line", - areaStyle: {}, smooth: true, - symbol: "none" + symbol: "none", + lineStyle: { + color: "rgb(67, 145, 250,0.9)", + width: 1 + }, + areaStyle: { + color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ + { + offset: 0, + color: "rgb(67, 145, 250,0.8)" + }, + { + offset: 1, + color: "rgb(17, 95, 200,0)" + } + ]) + } } ] }; diff --git a/src/app/views/Services.vue b/src/app/views/Services.vue index 5041d146..cd810f3d 100755 --- a/src/app/views/Services.vue +++ b/src/app/views/Services.vue @@ -136,7 +136,7 @@
-

CPU

+

{{ $t("services.cpuChartTip") }}

-

{{ $t("overview.mem") }}

+

{{ $t("services.memChartTip") }}