diff --git a/src/components/olmap/core/Controls/HistoryDataPanel.tsx b/src/components/olmap/core/Controls/HistoryDataPanel.tsx
index 1e15def..92665a8 100644
--- a/src/components/olmap/core/Controls/HistoryDataPanel.tsx
+++ b/src/components/olmap/core/Controls/HistoryDataPanel.tsx
@@ -26,7 +26,6 @@ import { Close, PlayArrow, Refresh, ShowChart, TableChart } from "@mui/icons-mat
 import { DataGrid, GridColDef } from "@mui/x-data-grid";
 import { zhCN } from "@mui/x-data-grid/locales";
 import ReactECharts from "echarts-for-react";
-import * as echarts from "echarts";
 import "dayjs/locale/zh-cn"; // 引入中文包
 import dayjs, { Dayjs } from "dayjs";
 import utc from "dayjs/plugin/utc";
@@ -587,8 +586,8 @@ const SCADADataPanel: React.FC<SCADADataPanelProps> = ({
                 ? "circle"
                 : metadata.source === "scada_raw"
                   ? "diamond"
-                  : "none",
-            symbolSize: isObserved ? 7 : 0,
+                  : "circle",
+            symbolSize: isObserved ? 7 : 5,
             showSymbol: isObserved,
             sampling: "lttb",
             connectNulls: false,
@@ -602,22 +601,10 @@ const SCADADataPanel: React.FC<SCADADataPanelProps> = ({
               .map((point) => [
                 new Date(point.timestamp).getTime(), point.values[key] ?? null,
               ]),
-            lineStyle: isObserved ? { width: 0 } : undefined,
-            areaStyle: isObserved
-              ? undefined
-              : {
-                  color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
-                    {
-                      offset: 0,
-                      color: colors[index % colors.length],
-                    },
-                    {
-                      offset: 1,
-                      color: "rgba(255, 255, 255, 0)",
-                    },
-                  ]),
-                  opacity: 0.3,
-                },
+            lineStyle: {
+              width: isObserved ? 0 : 2,
+              type: metadata.source === "analysis_simulation" ? "dashed" : "solid",
+            },
           },
         ];
       });
@@ -628,20 +615,34 @@ const SCADADataPanel: React.FC<SCADADataPanelProps> = ({
       tooltip: {
         trigger: "axis",
         confine: true,
-        position: function (pt: any[]) {
-          return [pt[0], "10%"];
-        },
+        axisPointer: { type: "line", lineStyle: { color: "#94a3b8", type: "dashed" } },
+        valueFormatter: (value: number | string) => typeof value === "number"
+          ? value.toLocaleString("zh-CN", { maximumSignificantDigits: 6, useGrouping: false })
+          : String(value ?? "--"),
       },
       legend: {
-        top: "top",
+        type: "scroll",
+        top: 8,
+        left: 20,
+        width: "90%",
+        itemWidth: 20,
+        itemHeight: 8,
+        itemGap: 20,
+        textStyle: { color: "#475569", fontSize: 12 },
       },
       grid: {
-        left: "5%",
-        right: "5%",
-        bottom: "11%",
+        top: 120,
+        left: 20,
+        right: 24,
+        bottom: 76,
         containLabel: true,
       },
       toolbox: {
+        top: 36,
+        right: 16,
+        itemSize: 15,
+        itemGap: 16,
+        iconStyle: { borderColor: "#64748b" },
         feature: {
           dataZoom: {
             yAxisIndex: "none",
@@ -659,7 +660,14 @@ const SCADADataPanel: React.FC<SCADADataPanelProps> = ({
         axisLabel: {
           formatter: (value: number) => dayjs(value).tz("Asia/Shanghai").format("MM-DD\nHH:mm"),
           hideOverlap: true,
+          color: "#64748b",
+          fontSize: 12,
+          lineHeight: 16,
+          margin: 12,
         },
+        splitNumber: 6,
+        axisLine: { lineStyle: { color: "#cbd5e1" } },
+        axisTick: { show: false },
       },
       yAxis: [
         ...(hasFlowSeries
@@ -668,6 +676,9 @@ const SCADADataPanel: React.FC<SCADADataPanelProps> = ({
                 type: "value",
                 scale: true,
                 name: `流量 (${FLOW_DISPLAY_UNIT})`,
+                nameTextStyle: { color: "#64748b", fontSize: 12 },
+                axisLabel: { color: "#64748b", fontSize: 12 },
+                splitLine: { lineStyle: { color: "#e2e8f0", type: "dashed" } },
               },
             ]
           : []),
@@ -677,6 +688,9 @@ const SCADADataPanel: React.FC<SCADADataPanelProps> = ({
                 type: "value",
                 scale: true,
                 name: `压力 (${PRESSURE_DISPLAY_UNIT})`,
+                nameTextStyle: { color: "#64748b", fontSize: 12 },
+                axisLabel: { color: "#64748b", fontSize: 12 },
+                splitLine: { show: !hasFlowSeries, lineStyle: { color: "#e2e8f0", type: "dashed" } },
               },
             ]
           : []),
@@ -688,8 +702,23 @@ const SCADADataPanel: React.FC<SCADADataPanelProps> = ({
           end: 100,
         },
         {
+          type: "slider",
           start: 0,
           end: 100,
+          bottom: 12,
+          height: 24,
+          showDetail: false,
+          borderColor: "transparent",
+          backgroundColor: "#f5f7fa",
+          fillerColor: "rgba(25, 118, 210, 0.08)",
+          dataBackground: {
+            lineStyle: { color: "#94a3b8" },
+            areaStyle: { opacity: 0 },
+          },
+          selectedDataBackground: {
+            lineStyle: { color: "#1976d2" },
+            areaStyle: { opacity: 0 },
+          },
         },
       ],
       series: getSeries().map((series, index) => ({
@@ -698,7 +727,13 @@ const SCADADataPanel: React.FC<SCADADataPanelProps> = ({
           ? {
               markArea: {
                 silent: true,
-                itemStyle: { color: "rgba(255, 152, 0, 0.10)" },
+                itemStyle: { color: "rgba(255, 152, 0, 0.06)" },
+                label: {
+                  position: "insideTop",
+                  distance: 10,
+                  color: "#996515",
+                  fontSize: 11,
+                },
                 data: [[
                   { name: "事件方案时段", xAxis: Date.parse(eventRange.start) },
                   { xAxis: Date.parse(eventRange.end) },