Răsfoiți Sursa

perf(views): 优化“设备工况”模块参数的历史数据曲线,添加数据缩放

wangcong 1 săptămână în urmă
părinte
comite
7550657a1a
1 a modificat fișierele cu 31 adăugiri și 2 ștergeri
  1. 31 2
      src/views/device-work-status/DevWorkParamData.vue

+ 31 - 2
src/views/device-work-status/DevWorkParamData.vue

@@ -6,6 +6,7 @@ import { LineChart } from 'echarts/charts';
 import {
   AxisPointerComponent,
   DatasetComponent,
+  DataZoomComponent,
   GridComponent,
   LegendComponent,
   MarkLineComponent,
@@ -26,6 +27,7 @@ import type { Dayjs } from 'dayjs';
 import type { LineSeriesOption } from 'echarts/charts';
 import type {
   DatasetComponentOption,
+  DataZoomComponentOption,
   GridComponentOption,
   LegendComponentOption,
   TooltipComponentOption,
@@ -42,10 +44,16 @@ use([
   DatasetComponent,
   GridComponent,
   LineChart,
+  DataZoomComponent,
 ]);
 
 type EChartsOption = ComposeOption<
-  LegendComponentOption | TooltipComponentOption | DatasetComponentOption | GridComponentOption | LineSeriesOption
+  | LegendComponentOption
+  | TooltipComponentOption
+  | DatasetComponentOption
+  | GridComponentOption
+  | LineSeriesOption
+  | DataZoomComponentOption
 >;
 
 interface Props {
@@ -188,10 +196,31 @@ const option = computed<EChartsOption>(() => {
     grid: {
       top: 10,
       right: 30,
-      bottom: 20,
+      bottom: 90,
       left: 30,
       containLabel: true,
     },
+    dataZoom: [
+      {
+        type: 'inside',
+        start: 0,
+        end: 100,
+        bottom: 35,
+        handleStyle: {
+          label: { show: false },
+        },
+        showDetail: false,
+      },
+      {
+        start: 0,
+        end: 100,
+        bottom: 35,
+        handleStyle: {
+          label: { show: false },
+        },
+        showDetail: false,
+      },
+    ],
   };
 });