diff --git a/src/api/MonitoringAnalysis.js b/src/api/MonitoringAnalysis.js
index 3a6a7ad..556a8ff 100644
--- a/src/api/MonitoringAnalysis.js
+++ b/src/api/MonitoringAnalysis.js
@@ -144,4 +144,11 @@
     method: 'get',
     params,
   });
+}
+export function monitorAnalysisRiskTimeBetween(params) {
+  return request({
+    url: `business/monitorAnalysis/riskTimeBetween`,
+    method: 'get',
+    params,
+  });
 }
\ No newline at end of file

diff --git a/src/api/MonitoringAnalysis.js b/src/api/MonitoringAnalysis.js
index 3a6a7ad..556a8ff 100644
--- a/src/api/MonitoringAnalysis.js
+++ b/src/api/MonitoringAnalysis.js
@@ -144,4 +144,11 @@
     method: 'get',
     params,
   });
+}
+export function monitorAnalysisRiskTimeBetween(params) {
+  return request({
+    url: `business/monitorAnalysis/riskTimeBetween`,
+    method: 'get',
+    params,
+  });
 }
\ No newline at end of file
diff --git a/src/views/pictureOnMap/page/components/DialogTabs/component/dxssrfxJCFX.vue b/src/views/pictureOnMap/page/components/DialogTabs/component/dxssrfxJCFX.vue
index 7a2052f..ec5aaa5 100644
--- a/src/views/pictureOnMap/page/components/DialogTabs/component/dxssrfxJCFX.vue
+++ b/src/views/pictureOnMap/page/components/DialogTabs/component/dxssrfxJCFX.vue
@@ -28,7 +28,10 @@
 import { ref, reactive, toRefs, onMounted, nextTick } from "vue";
 import * as echarts from "echarts";
 import { getEchart } from "@/api/MonitorAssetsOnMap";
-import { riskAnalysisReason } from "@/api/MonitoringAnalysis";
+import {
+  riskAnalysisReason,
+  monitorAnalysisRiskTimeBetween,
+} from "@/api/MonitoringAnalysis";
 import { rainCalendar } from "@/api/FloodControlAndDrainage";
 
 import moment from "moment";
@@ -65,6 +68,7 @@
   TLK: "",
   WTRQ: "",
   TQ: "",
+  FenXianTimer: [],
 });
 const Timers = ref([
   moment().subtract(3, "day").format("YYYY-MM-DD HH:mm:ss"),
@@ -265,6 +269,15 @@
               { offset: 1, color: "#19D6FF" },
             ]), // 数据点颜色
           },
+          markArea: {
+            label: {
+              color: "#fb6061",
+            },
+            itemStyle: {
+              color: "#fb606150",
+            },
+            data: AllData.FenXianTimer,
+          },
         },
         {
           name: AllData.yAxis2_Name,
@@ -351,7 +364,8 @@
             break;
         }
       });
-      init();
+
+      getFengXianTimer();
     }
   });
 };
@@ -409,6 +423,20 @@
     });
   });
 };
+const getFengXianTimer = () => {
+  monitorAnalysisRiskTimeBetween({
+    startTime: Timers.value[0],
+    endTime: Timers.value[1],
+    stCode: props.Getproperties.stCode,
+    dataCode: props.Getproperties.dataCode,
+    menuType: "dxssrfxJCFX",
+  }).then((res) => {
+    if (res && res.code == 200) {
+      AllData.FenXianTimer = res.data;
+      init();
+    }
+  });
+};
 onMounted(() => {
   nextTick(() => {
     if (props.Getproperties.daterange) {
@@ -427,7 +455,9 @@
   width: 100%;
   height: 100%;
   #HeaderEcharts {
-    width: 1198px;
+    // width: 1198px;
+    // height: 320px;
+    width: 100%;
     height: 320px;
   }
   #BodyFenXi {

diff --git a/src/api/MonitoringAnalysis.js b/src/api/MonitoringAnalysis.js
index 3a6a7ad..556a8ff 100644
--- a/src/api/MonitoringAnalysis.js
+++ b/src/api/MonitoringAnalysis.js
@@ -144,4 +144,11 @@
     method: 'get',
     params,
   });
+}
+export function monitorAnalysisRiskTimeBetween(params) {
+  return request({
+    url: `business/monitorAnalysis/riskTimeBetween`,
+    method: 'get',
+    params,
+  });
 }
\ No newline at end of file
diff --git a/src/views/pictureOnMap/page/components/DialogTabs/component/dxssrfxJCFX.vue b/src/views/pictureOnMap/page/components/DialogTabs/component/dxssrfxJCFX.vue
index 7a2052f..ec5aaa5 100644
--- a/src/views/pictureOnMap/page/components/DialogTabs/component/dxssrfxJCFX.vue
+++ b/src/views/pictureOnMap/page/components/DialogTabs/component/dxssrfxJCFX.vue
@@ -28,7 +28,10 @@
 import { ref, reactive, toRefs, onMounted, nextTick } from "vue";
 import * as echarts from "echarts";
 import { getEchart } from "@/api/MonitorAssetsOnMap";
-import { riskAnalysisReason } from "@/api/MonitoringAnalysis";
+import {
+  riskAnalysisReason,
+  monitorAnalysisRiskTimeBetween,
+} from "@/api/MonitoringAnalysis";
 import { rainCalendar } from "@/api/FloodControlAndDrainage";
 
 import moment from "moment";
@@ -65,6 +68,7 @@
   TLK: "",
   WTRQ: "",
   TQ: "",
+  FenXianTimer: [],
 });
 const Timers = ref([
   moment().subtract(3, "day").format("YYYY-MM-DD HH:mm:ss"),
@@ -265,6 +269,15 @@
               { offset: 1, color: "#19D6FF" },
             ]), // 数据点颜色
           },
+          markArea: {
+            label: {
+              color: "#fb6061",
+            },
+            itemStyle: {
+              color: "#fb606150",
+            },
+            data: AllData.FenXianTimer,
+          },
         },
         {
           name: AllData.yAxis2_Name,
@@ -351,7 +364,8 @@
             break;
         }
       });
-      init();
+
+      getFengXianTimer();
     }
   });
 };
@@ -409,6 +423,20 @@
     });
   });
 };
+const getFengXianTimer = () => {
+  monitorAnalysisRiskTimeBetween({
+    startTime: Timers.value[0],
+    endTime: Timers.value[1],
+    stCode: props.Getproperties.stCode,
+    dataCode: props.Getproperties.dataCode,
+    menuType: "dxssrfxJCFX",
+  }).then((res) => {
+    if (res && res.code == 200) {
+      AllData.FenXianTimer = res.data;
+      init();
+    }
+  });
+};
 onMounted(() => {
   nextTick(() => {
     if (props.Getproperties.daterange) {
@@ -427,7 +455,9 @@
   width: 100%;
   height: 100%;
   #HeaderEcharts {
-    width: 1198px;
+    // width: 1198px;
+    // height: 320px;
+    width: 100%;
     height: 320px;
   }
   #BodyFenXi {
diff --git a/src/views/pictureOnMap/page/components/DialogTabs/component/szycfxJCFX.vue b/src/views/pictureOnMap/page/components/DialogTabs/component/szycfxJCFX.vue
index ecf503b..564c510 100644
--- a/src/views/pictureOnMap/page/components/DialogTabs/component/szycfxJCFX.vue
+++ b/src/views/pictureOnMap/page/components/DialogTabs/component/szycfxJCFX.vue
@@ -28,7 +28,10 @@
 import { ref, reactive, toRefs, onMounted, nextTick } from "vue";
 import * as echarts from "echarts";
 import { getEchart } from "@/api/MonitorAssetsOnMap";
-import { riskAnalysisReason } from "@/api/MonitoringAnalysis";
+import {
+  riskAnalysisReason,
+  monitorAnalysisRiskTimeBetween,
+} from "@/api/MonitoringAnalysis";
 import { rainCalendar } from "@/api/FloodControlAndDrainage";
 
 import moment from "moment";
@@ -67,6 +70,7 @@
   TQ: "",
   JKSZ: 0,
   PFBZ: 0,
+  FenXianTimer: [],
 });
 const Timers = ref([
   moment().subtract(3, "day").format("YYYY-MM-DD HH:mm:ss"),
@@ -238,6 +242,15 @@
               { offset: 1, color: "#19D6FF" },
             ]), // 数据点颜色
           },
+          markArea: {
+            label: {
+              color: "#fb6061",
+            },
+            itemStyle: {
+              color: "#fb606150",
+            },
+            data: AllData.FenXianTimer,
+          },
         },
         {
           name: AllData.yAxis2_Name,
@@ -351,7 +364,8 @@
             break;
         }
       });
-      init();
+
+      getFengXianTimer();
     }
   });
 };
@@ -408,6 +422,20 @@
     });
   });
 };
+const getFengXianTimer = () => {
+  monitorAnalysisRiskTimeBetween({
+    startTime: Timers.value[0],
+    endTime: Timers.value[1],
+    stCode: props.Getproperties.stCode,
+    dataCode: props.Getproperties.dataCode,
+    menuType: "szycfxJCFX",
+  }).then((res) => {
+    if (res && res.code == 200) {
+      AllData.FenXianTimer = res.data;
+      init();
+    }
+  });
+};
 onMounted(() => {
   nextTick(() => {
     if (props.Getproperties.daterange) {
@@ -430,7 +458,9 @@
     color: white !important;
   }
   #HeaderEcharts {
-    width: 1198px;
+    // width: 1198px;
+    // height: 320px;
+    width: 100%;
     height: 320px;
   }
   #BodyFenXi {

diff --git a/src/api/MonitoringAnalysis.js b/src/api/MonitoringAnalysis.js
index 3a6a7ad..556a8ff 100644
--- a/src/api/MonitoringAnalysis.js
+++ b/src/api/MonitoringAnalysis.js
@@ -144,4 +144,11 @@
     method: 'get',
     params,
   });
+}
+export function monitorAnalysisRiskTimeBetween(params) {
+  return request({
+    url: `business/monitorAnalysis/riskTimeBetween`,
+    method: 'get',
+    params,
+  });
 }
\ No newline at end of file
diff --git a/src/views/pictureOnMap/page/components/DialogTabs/component/dxssrfxJCFX.vue b/src/views/pictureOnMap/page/components/DialogTabs/component/dxssrfxJCFX.vue
index 7a2052f..ec5aaa5 100644
--- a/src/views/pictureOnMap/page/components/DialogTabs/component/dxssrfxJCFX.vue
+++ b/src/views/pictureOnMap/page/components/DialogTabs/component/dxssrfxJCFX.vue
@@ -28,7 +28,10 @@
 import { ref, reactive, toRefs, onMounted, nextTick } from "vue";
 import * as echarts from "echarts";
 import { getEchart } from "@/api/MonitorAssetsOnMap";
-import { riskAnalysisReason } from "@/api/MonitoringAnalysis";
+import {
+  riskAnalysisReason,
+  monitorAnalysisRiskTimeBetween,
+} from "@/api/MonitoringAnalysis";
 import { rainCalendar } from "@/api/FloodControlAndDrainage";
 
 import moment from "moment";
@@ -65,6 +68,7 @@
   TLK: "",
   WTRQ: "",
   TQ: "",
+  FenXianTimer: [],
 });
 const Timers = ref([
   moment().subtract(3, "day").format("YYYY-MM-DD HH:mm:ss"),
@@ -265,6 +269,15 @@
               { offset: 1, color: "#19D6FF" },
             ]), // 数据点颜色
           },
+          markArea: {
+            label: {
+              color: "#fb6061",
+            },
+            itemStyle: {
+              color: "#fb606150",
+            },
+            data: AllData.FenXianTimer,
+          },
         },
         {
           name: AllData.yAxis2_Name,
@@ -351,7 +364,8 @@
             break;
         }
       });
-      init();
+
+      getFengXianTimer();
     }
   });
 };
@@ -409,6 +423,20 @@
     });
   });
 };
+const getFengXianTimer = () => {
+  monitorAnalysisRiskTimeBetween({
+    startTime: Timers.value[0],
+    endTime: Timers.value[1],
+    stCode: props.Getproperties.stCode,
+    dataCode: props.Getproperties.dataCode,
+    menuType: "dxssrfxJCFX",
+  }).then((res) => {
+    if (res && res.code == 200) {
+      AllData.FenXianTimer = res.data;
+      init();
+    }
+  });
+};
 onMounted(() => {
   nextTick(() => {
     if (props.Getproperties.daterange) {
@@ -427,7 +455,9 @@
   width: 100%;
   height: 100%;
   #HeaderEcharts {
-    width: 1198px;
+    // width: 1198px;
+    // height: 320px;
+    width: 100%;
     height: 320px;
   }
   #BodyFenXi {
diff --git a/src/views/pictureOnMap/page/components/DialogTabs/component/szycfxJCFX.vue b/src/views/pictureOnMap/page/components/DialogTabs/component/szycfxJCFX.vue
index ecf503b..564c510 100644
--- a/src/views/pictureOnMap/page/components/DialogTabs/component/szycfxJCFX.vue
+++ b/src/views/pictureOnMap/page/components/DialogTabs/component/szycfxJCFX.vue
@@ -28,7 +28,10 @@
 import { ref, reactive, toRefs, onMounted, nextTick } from "vue";
 import * as echarts from "echarts";
 import { getEchart } from "@/api/MonitorAssetsOnMap";
-import { riskAnalysisReason } from "@/api/MonitoringAnalysis";
+import {
+  riskAnalysisReason,
+  monitorAnalysisRiskTimeBetween,
+} from "@/api/MonitoringAnalysis";
 import { rainCalendar } from "@/api/FloodControlAndDrainage";
 
 import moment from "moment";
@@ -67,6 +70,7 @@
   TQ: "",
   JKSZ: 0,
   PFBZ: 0,
+  FenXianTimer: [],
 });
 const Timers = ref([
   moment().subtract(3, "day").format("YYYY-MM-DD HH:mm:ss"),
@@ -238,6 +242,15 @@
               { offset: 1, color: "#19D6FF" },
             ]), // 数据点颜色
           },
+          markArea: {
+            label: {
+              color: "#fb6061",
+            },
+            itemStyle: {
+              color: "#fb606150",
+            },
+            data: AllData.FenXianTimer,
+          },
         },
         {
           name: AllData.yAxis2_Name,
@@ -351,7 +364,8 @@
             break;
         }
       });
-      init();
+
+      getFengXianTimer();
     }
   });
 };
@@ -408,6 +422,20 @@
     });
   });
 };
+const getFengXianTimer = () => {
+  monitorAnalysisRiskTimeBetween({
+    startTime: Timers.value[0],
+    endTime: Timers.value[1],
+    stCode: props.Getproperties.stCode,
+    dataCode: props.Getproperties.dataCode,
+    menuType: "szycfxJCFX",
+  }).then((res) => {
+    if (res && res.code == 200) {
+      AllData.FenXianTimer = res.data;
+      init();
+    }
+  });
+};
 onMounted(() => {
   nextTick(() => {
     if (props.Getproperties.daterange) {
@@ -430,7 +458,9 @@
     color: white !important;
   }
   #HeaderEcharts {
-    width: 1198px;
+    // width: 1198px;
+    // height: 320px;
+    width: 100%;
     height: 320px;
   }
   #BodyFenXi {
diff --git a/src/views/pictureOnMap/page/components/DialogTabs/component/wszrfxJCFX.vue b/src/views/pictureOnMap/page/components/DialogTabs/component/wszrfxJCFX.vue
index 1431eda..060da46 100644
--- a/src/views/pictureOnMap/page/components/DialogTabs/component/wszrfxJCFX.vue
+++ b/src/views/pictureOnMap/page/components/DialogTabs/component/wszrfxJCFX.vue
@@ -28,7 +28,10 @@
 import { ref, reactive, toRefs, onMounted, nextTick } from "vue";
 import * as echarts from "echarts";
 import { getEchart } from "@/api/MonitorAssetsOnMap";
-import { riskAnalysisReason } from "@/api/MonitoringAnalysis";
+import {
+  riskAnalysisReason,
+  monitorAnalysisRiskTimeBetween,
+} from "@/api/MonitoringAnalysis";
 import { rainCalendar } from "@/api/FloodControlAndDrainage";
 
 import moment from "moment";
@@ -66,6 +69,7 @@
   TLK: "",
   WTRQ: "",
   TQ: "",
+  FenXianTimer: [],
 });
 const Timers = ref([
   moment().subtract(3, "day").format("YYYY-MM-DD HH:mm:ss"),
@@ -266,6 +270,15 @@
               { offset: 1, color: "#19D6FF" },
             ]), // 数据点颜色
           },
+          markArea: {
+            label: {
+              color: "#fb6061",
+            },
+            itemStyle: {
+              color: "#fb606150",
+            },
+            data: AllData.FenXianTimer,
+          },
         },
         {
           name: AllData.yAxis2_Name,
@@ -351,7 +364,8 @@
             break;
         }
       });
-      init();
+
+      getFengXianTimer();
     }
   });
 };
@@ -409,6 +423,21 @@
     });
   });
 };
+
+const getFengXianTimer = () => {
+  monitorAnalysisRiskTimeBetween({
+    startTime: Timers.value[0],
+    endTime: Timers.value[1],
+    stCode: props.Getproperties.stCode,
+    dataCode: props.Getproperties.dataCode,
+    menuType: "wszrfxJCFX",
+  }).then((res) => {
+    if (res && res.code == 200) {
+      AllData.FenXianTimer = res.data;
+      init();
+    }
+  });
+};
 onMounted(() => {
   nextTick(() => {
     if (props.Getproperties.daterange) {
@@ -427,7 +456,9 @@
   width: 100%;
   height: 100%;
   #HeaderEcharts {
-    width: 1198px;
+    // width: 1198px;
+    // height: 320px;
+    width: 100%;
     height: 320px;
   }
   #BodyFenXi {

diff --git a/src/api/MonitoringAnalysis.js b/src/api/MonitoringAnalysis.js
index 3a6a7ad..556a8ff 100644
--- a/src/api/MonitoringAnalysis.js
+++ b/src/api/MonitoringAnalysis.js
@@ -144,4 +144,11 @@
     method: 'get',
     params,
   });
+}
+export function monitorAnalysisRiskTimeBetween(params) {
+  return request({
+    url: `business/monitorAnalysis/riskTimeBetween`,
+    method: 'get',
+    params,
+  });
 }
\ No newline at end of file
diff --git a/src/views/pictureOnMap/page/components/DialogTabs/component/dxssrfxJCFX.vue b/src/views/pictureOnMap/page/components/DialogTabs/component/dxssrfxJCFX.vue
index 7a2052f..ec5aaa5 100644
--- a/src/views/pictureOnMap/page/components/DialogTabs/component/dxssrfxJCFX.vue
+++ b/src/views/pictureOnMap/page/components/DialogTabs/component/dxssrfxJCFX.vue
@@ -28,7 +28,10 @@
 import { ref, reactive, toRefs, onMounted, nextTick } from "vue";
 import * as echarts from "echarts";
 import { getEchart } from "@/api/MonitorAssetsOnMap";
-import { riskAnalysisReason } from "@/api/MonitoringAnalysis";
+import {
+  riskAnalysisReason,
+  monitorAnalysisRiskTimeBetween,
+} from "@/api/MonitoringAnalysis";
 import { rainCalendar } from "@/api/FloodControlAndDrainage";
 
 import moment from "moment";
@@ -65,6 +68,7 @@
   TLK: "",
   WTRQ: "",
   TQ: "",
+  FenXianTimer: [],
 });
 const Timers = ref([
   moment().subtract(3, "day").format("YYYY-MM-DD HH:mm:ss"),
@@ -265,6 +269,15 @@
               { offset: 1, color: "#19D6FF" },
             ]), // 数据点颜色
           },
+          markArea: {
+            label: {
+              color: "#fb6061",
+            },
+            itemStyle: {
+              color: "#fb606150",
+            },
+            data: AllData.FenXianTimer,
+          },
         },
         {
           name: AllData.yAxis2_Name,
@@ -351,7 +364,8 @@
             break;
         }
       });
-      init();
+
+      getFengXianTimer();
     }
   });
 };
@@ -409,6 +423,20 @@
     });
   });
 };
+const getFengXianTimer = () => {
+  monitorAnalysisRiskTimeBetween({
+    startTime: Timers.value[0],
+    endTime: Timers.value[1],
+    stCode: props.Getproperties.stCode,
+    dataCode: props.Getproperties.dataCode,
+    menuType: "dxssrfxJCFX",
+  }).then((res) => {
+    if (res && res.code == 200) {
+      AllData.FenXianTimer = res.data;
+      init();
+    }
+  });
+};
 onMounted(() => {
   nextTick(() => {
     if (props.Getproperties.daterange) {
@@ -427,7 +455,9 @@
   width: 100%;
   height: 100%;
   #HeaderEcharts {
-    width: 1198px;
+    // width: 1198px;
+    // height: 320px;
+    width: 100%;
     height: 320px;
   }
   #BodyFenXi {
diff --git a/src/views/pictureOnMap/page/components/DialogTabs/component/szycfxJCFX.vue b/src/views/pictureOnMap/page/components/DialogTabs/component/szycfxJCFX.vue
index ecf503b..564c510 100644
--- a/src/views/pictureOnMap/page/components/DialogTabs/component/szycfxJCFX.vue
+++ b/src/views/pictureOnMap/page/components/DialogTabs/component/szycfxJCFX.vue
@@ -28,7 +28,10 @@
 import { ref, reactive, toRefs, onMounted, nextTick } from "vue";
 import * as echarts from "echarts";
 import { getEchart } from "@/api/MonitorAssetsOnMap";
-import { riskAnalysisReason } from "@/api/MonitoringAnalysis";
+import {
+  riskAnalysisReason,
+  monitorAnalysisRiskTimeBetween,
+} from "@/api/MonitoringAnalysis";
 import { rainCalendar } from "@/api/FloodControlAndDrainage";
 
 import moment from "moment";
@@ -67,6 +70,7 @@
   TQ: "",
   JKSZ: 0,
   PFBZ: 0,
+  FenXianTimer: [],
 });
 const Timers = ref([
   moment().subtract(3, "day").format("YYYY-MM-DD HH:mm:ss"),
@@ -238,6 +242,15 @@
               { offset: 1, color: "#19D6FF" },
             ]), // 数据点颜色
           },
+          markArea: {
+            label: {
+              color: "#fb6061",
+            },
+            itemStyle: {
+              color: "#fb606150",
+            },
+            data: AllData.FenXianTimer,
+          },
         },
         {
           name: AllData.yAxis2_Name,
@@ -351,7 +364,8 @@
             break;
         }
       });
-      init();
+
+      getFengXianTimer();
     }
   });
 };
@@ -408,6 +422,20 @@
     });
   });
 };
+const getFengXianTimer = () => {
+  monitorAnalysisRiskTimeBetween({
+    startTime: Timers.value[0],
+    endTime: Timers.value[1],
+    stCode: props.Getproperties.stCode,
+    dataCode: props.Getproperties.dataCode,
+    menuType: "szycfxJCFX",
+  }).then((res) => {
+    if (res && res.code == 200) {
+      AllData.FenXianTimer = res.data;
+      init();
+    }
+  });
+};
 onMounted(() => {
   nextTick(() => {
     if (props.Getproperties.daterange) {
@@ -430,7 +458,9 @@
     color: white !important;
   }
   #HeaderEcharts {
-    width: 1198px;
+    // width: 1198px;
+    // height: 320px;
+    width: 100%;
     height: 320px;
   }
   #BodyFenXi {
diff --git a/src/views/pictureOnMap/page/components/DialogTabs/component/wszrfxJCFX.vue b/src/views/pictureOnMap/page/components/DialogTabs/component/wszrfxJCFX.vue
index 1431eda..060da46 100644
--- a/src/views/pictureOnMap/page/components/DialogTabs/component/wszrfxJCFX.vue
+++ b/src/views/pictureOnMap/page/components/DialogTabs/component/wszrfxJCFX.vue
@@ -28,7 +28,10 @@
 import { ref, reactive, toRefs, onMounted, nextTick } from "vue";
 import * as echarts from "echarts";
 import { getEchart } from "@/api/MonitorAssetsOnMap";
-import { riskAnalysisReason } from "@/api/MonitoringAnalysis";
+import {
+  riskAnalysisReason,
+  monitorAnalysisRiskTimeBetween,
+} from "@/api/MonitoringAnalysis";
 import { rainCalendar } from "@/api/FloodControlAndDrainage";
 
 import moment from "moment";
@@ -66,6 +69,7 @@
   TLK: "",
   WTRQ: "",
   TQ: "",
+  FenXianTimer: [],
 });
 const Timers = ref([
   moment().subtract(3, "day").format("YYYY-MM-DD HH:mm:ss"),
@@ -266,6 +270,15 @@
               { offset: 1, color: "#19D6FF" },
             ]), // 数据点颜色
           },
+          markArea: {
+            label: {
+              color: "#fb6061",
+            },
+            itemStyle: {
+              color: "#fb606150",
+            },
+            data: AllData.FenXianTimer,
+          },
         },
         {
           name: AllData.yAxis2_Name,
@@ -351,7 +364,8 @@
             break;
         }
       });
-      init();
+
+      getFengXianTimer();
     }
   });
 };
@@ -409,6 +423,21 @@
     });
   });
 };
+
+const getFengXianTimer = () => {
+  monitorAnalysisRiskTimeBetween({
+    startTime: Timers.value[0],
+    endTime: Timers.value[1],
+    stCode: props.Getproperties.stCode,
+    dataCode: props.Getproperties.dataCode,
+    menuType: "wszrfxJCFX",
+  }).then((res) => {
+    if (res && res.code == 200) {
+      AllData.FenXianTimer = res.data;
+      init();
+    }
+  });
+};
 onMounted(() => {
   nextTick(() => {
     if (props.Getproperties.daterange) {
@@ -427,7 +456,9 @@
   width: 100%;
   height: 100%;
   #HeaderEcharts {
-    width: 1198px;
+    // width: 1198px;
+    // height: 320px;
+    width: 100%;
     height: 320px;
   }
   #BodyFenXi {
diff --git a/src/views/pictureOnMap/page/components/DialogTabs/component/ydfxfxJCFX.vue b/src/views/pictureOnMap/page/components/DialogTabs/component/ydfxfxJCFX.vue
index e98ba4e..2092ec9 100644
--- a/src/views/pictureOnMap/page/components/DialogTabs/component/ydfxfxJCFX.vue
+++ b/src/views/pictureOnMap/page/components/DialogTabs/component/ydfxfxJCFX.vue
@@ -28,7 +28,10 @@
 import { ref, reactive, toRefs, onMounted, nextTick } from "vue";
 import * as echarts from "echarts";
 import { getEchart } from "@/api/MonitorAssetsOnMap";
-import { riskAnalysisReason } from "@/api/MonitoringAnalysis";
+import {
+  riskAnalysisReason,
+  monitorAnalysisRiskTimeBetween,
+} from "@/api/MonitoringAnalysis";
 import { rainCalendar } from "@/api/FloodControlAndDrainage";
 
 import moment from "moment";
@@ -64,6 +67,7 @@
   TLK: "",
   WTRQ: "",
   TQ: "",
+  FenXianTimer: [],
 });
 const Timers = ref([
   moment().subtract(3, "day").format("YYYY-MM-DD HH:mm:ss"),
@@ -233,6 +237,15 @@
               { offset: 1, color: "#19D6FF" },
             ]), // 数据点颜色
           },
+          markArea: {
+            label: {
+              color: "#fb6061",
+            },
+            itemStyle: {
+              color: "#fb606150",
+            },
+            data: AllData.FenXianTimer,
+          },
         },
         {
           name: AllData.yAxis2_Name,
@@ -301,7 +314,7 @@
             break;
         }
       });
-      init();
+      getFengXianTimer();
     }
   });
 };
@@ -359,6 +372,20 @@
     });
   });
 };
+const getFengXianTimer = () => {
+  monitorAnalysisRiskTimeBetween({
+    startTime: Timers.value[0],
+    endTime: Timers.value[1],
+    stCode: props.Getproperties.stCode,
+    dataCode: props.Getproperties.dataCode,
+    menuType: "ydfxfxJCFX",
+  }).then((res) => {
+    if (res && res.code == 200) {
+      AllData.FenXianTimer = res.data;
+      init();
+    }
+  });
+};
 onMounted(() => {
   nextTick(() => {
     if (props.Getproperties.daterange) {
@@ -377,7 +404,9 @@
   width: 100%;
   height: 100%;
   #HeaderEcharts {
-    width: 1198px;
+    // width: 1198px;
+    // height: 320px;
+    width: 100%;
     height: 320px;
   }
   #BodyFenXi {

diff --git a/src/api/MonitoringAnalysis.js b/src/api/MonitoringAnalysis.js
index 3a6a7ad..556a8ff 100644
--- a/src/api/MonitoringAnalysis.js
+++ b/src/api/MonitoringAnalysis.js
@@ -144,4 +144,11 @@
     method: 'get',
     params,
   });
+}
+export function monitorAnalysisRiskTimeBetween(params) {
+  return request({
+    url: `business/monitorAnalysis/riskTimeBetween`,
+    method: 'get',
+    params,
+  });
 }
\ No newline at end of file
diff --git a/src/views/pictureOnMap/page/components/DialogTabs/component/dxssrfxJCFX.vue b/src/views/pictureOnMap/page/components/DialogTabs/component/dxssrfxJCFX.vue
index 7a2052f..ec5aaa5 100644
--- a/src/views/pictureOnMap/page/components/DialogTabs/component/dxssrfxJCFX.vue
+++ b/src/views/pictureOnMap/page/components/DialogTabs/component/dxssrfxJCFX.vue
@@ -28,7 +28,10 @@
 import { ref, reactive, toRefs, onMounted, nextTick } from "vue";
 import * as echarts from "echarts";
 import { getEchart } from "@/api/MonitorAssetsOnMap";
-import { riskAnalysisReason } from "@/api/MonitoringAnalysis";
+import {
+  riskAnalysisReason,
+  monitorAnalysisRiskTimeBetween,
+} from "@/api/MonitoringAnalysis";
 import { rainCalendar } from "@/api/FloodControlAndDrainage";
 
 import moment from "moment";
@@ -65,6 +68,7 @@
   TLK: "",
   WTRQ: "",
   TQ: "",
+  FenXianTimer: [],
 });
 const Timers = ref([
   moment().subtract(3, "day").format("YYYY-MM-DD HH:mm:ss"),
@@ -265,6 +269,15 @@
               { offset: 1, color: "#19D6FF" },
             ]), // 数据点颜色
           },
+          markArea: {
+            label: {
+              color: "#fb6061",
+            },
+            itemStyle: {
+              color: "#fb606150",
+            },
+            data: AllData.FenXianTimer,
+          },
         },
         {
           name: AllData.yAxis2_Name,
@@ -351,7 +364,8 @@
             break;
         }
       });
-      init();
+
+      getFengXianTimer();
     }
   });
 };
@@ -409,6 +423,20 @@
     });
   });
 };
+const getFengXianTimer = () => {
+  monitorAnalysisRiskTimeBetween({
+    startTime: Timers.value[0],
+    endTime: Timers.value[1],
+    stCode: props.Getproperties.stCode,
+    dataCode: props.Getproperties.dataCode,
+    menuType: "dxssrfxJCFX",
+  }).then((res) => {
+    if (res && res.code == 200) {
+      AllData.FenXianTimer = res.data;
+      init();
+    }
+  });
+};
 onMounted(() => {
   nextTick(() => {
     if (props.Getproperties.daterange) {
@@ -427,7 +455,9 @@
   width: 100%;
   height: 100%;
   #HeaderEcharts {
-    width: 1198px;
+    // width: 1198px;
+    // height: 320px;
+    width: 100%;
     height: 320px;
   }
   #BodyFenXi {
diff --git a/src/views/pictureOnMap/page/components/DialogTabs/component/szycfxJCFX.vue b/src/views/pictureOnMap/page/components/DialogTabs/component/szycfxJCFX.vue
index ecf503b..564c510 100644
--- a/src/views/pictureOnMap/page/components/DialogTabs/component/szycfxJCFX.vue
+++ b/src/views/pictureOnMap/page/components/DialogTabs/component/szycfxJCFX.vue
@@ -28,7 +28,10 @@
 import { ref, reactive, toRefs, onMounted, nextTick } from "vue";
 import * as echarts from "echarts";
 import { getEchart } from "@/api/MonitorAssetsOnMap";
-import { riskAnalysisReason } from "@/api/MonitoringAnalysis";
+import {
+  riskAnalysisReason,
+  monitorAnalysisRiskTimeBetween,
+} from "@/api/MonitoringAnalysis";
 import { rainCalendar } from "@/api/FloodControlAndDrainage";
 
 import moment from "moment";
@@ -67,6 +70,7 @@
   TQ: "",
   JKSZ: 0,
   PFBZ: 0,
+  FenXianTimer: [],
 });
 const Timers = ref([
   moment().subtract(3, "day").format("YYYY-MM-DD HH:mm:ss"),
@@ -238,6 +242,15 @@
               { offset: 1, color: "#19D6FF" },
             ]), // 数据点颜色
           },
+          markArea: {
+            label: {
+              color: "#fb6061",
+            },
+            itemStyle: {
+              color: "#fb606150",
+            },
+            data: AllData.FenXianTimer,
+          },
         },
         {
           name: AllData.yAxis2_Name,
@@ -351,7 +364,8 @@
             break;
         }
       });
-      init();
+
+      getFengXianTimer();
     }
   });
 };
@@ -408,6 +422,20 @@
     });
   });
 };
+const getFengXianTimer = () => {
+  monitorAnalysisRiskTimeBetween({
+    startTime: Timers.value[0],
+    endTime: Timers.value[1],
+    stCode: props.Getproperties.stCode,
+    dataCode: props.Getproperties.dataCode,
+    menuType: "szycfxJCFX",
+  }).then((res) => {
+    if (res && res.code == 200) {
+      AllData.FenXianTimer = res.data;
+      init();
+    }
+  });
+};
 onMounted(() => {
   nextTick(() => {
     if (props.Getproperties.daterange) {
@@ -430,7 +458,9 @@
     color: white !important;
   }
   #HeaderEcharts {
-    width: 1198px;
+    // width: 1198px;
+    // height: 320px;
+    width: 100%;
     height: 320px;
   }
   #BodyFenXi {
diff --git a/src/views/pictureOnMap/page/components/DialogTabs/component/wszrfxJCFX.vue b/src/views/pictureOnMap/page/components/DialogTabs/component/wszrfxJCFX.vue
index 1431eda..060da46 100644
--- a/src/views/pictureOnMap/page/components/DialogTabs/component/wszrfxJCFX.vue
+++ b/src/views/pictureOnMap/page/components/DialogTabs/component/wszrfxJCFX.vue
@@ -28,7 +28,10 @@
 import { ref, reactive, toRefs, onMounted, nextTick } from "vue";
 import * as echarts from "echarts";
 import { getEchart } from "@/api/MonitorAssetsOnMap";
-import { riskAnalysisReason } from "@/api/MonitoringAnalysis";
+import {
+  riskAnalysisReason,
+  monitorAnalysisRiskTimeBetween,
+} from "@/api/MonitoringAnalysis";
 import { rainCalendar } from "@/api/FloodControlAndDrainage";
 
 import moment from "moment";
@@ -66,6 +69,7 @@
   TLK: "",
   WTRQ: "",
   TQ: "",
+  FenXianTimer: [],
 });
 const Timers = ref([
   moment().subtract(3, "day").format("YYYY-MM-DD HH:mm:ss"),
@@ -266,6 +270,15 @@
               { offset: 1, color: "#19D6FF" },
             ]), // 数据点颜色
           },
+          markArea: {
+            label: {
+              color: "#fb6061",
+            },
+            itemStyle: {
+              color: "#fb606150",
+            },
+            data: AllData.FenXianTimer,
+          },
         },
         {
           name: AllData.yAxis2_Name,
@@ -351,7 +364,8 @@
             break;
         }
       });
-      init();
+
+      getFengXianTimer();
     }
   });
 };
@@ -409,6 +423,21 @@
     });
   });
 };
+
+const getFengXianTimer = () => {
+  monitorAnalysisRiskTimeBetween({
+    startTime: Timers.value[0],
+    endTime: Timers.value[1],
+    stCode: props.Getproperties.stCode,
+    dataCode: props.Getproperties.dataCode,
+    menuType: "wszrfxJCFX",
+  }).then((res) => {
+    if (res && res.code == 200) {
+      AllData.FenXianTimer = res.data;
+      init();
+    }
+  });
+};
 onMounted(() => {
   nextTick(() => {
     if (props.Getproperties.daterange) {
@@ -427,7 +456,9 @@
   width: 100%;
   height: 100%;
   #HeaderEcharts {
-    width: 1198px;
+    // width: 1198px;
+    // height: 320px;
+    width: 100%;
     height: 320px;
   }
   #BodyFenXi {
diff --git a/src/views/pictureOnMap/page/components/DialogTabs/component/ydfxfxJCFX.vue b/src/views/pictureOnMap/page/components/DialogTabs/component/ydfxfxJCFX.vue
index e98ba4e..2092ec9 100644
--- a/src/views/pictureOnMap/page/components/DialogTabs/component/ydfxfxJCFX.vue
+++ b/src/views/pictureOnMap/page/components/DialogTabs/component/ydfxfxJCFX.vue
@@ -28,7 +28,10 @@
 import { ref, reactive, toRefs, onMounted, nextTick } from "vue";
 import * as echarts from "echarts";
 import { getEchart } from "@/api/MonitorAssetsOnMap";
-import { riskAnalysisReason } from "@/api/MonitoringAnalysis";
+import {
+  riskAnalysisReason,
+  monitorAnalysisRiskTimeBetween,
+} from "@/api/MonitoringAnalysis";
 import { rainCalendar } from "@/api/FloodControlAndDrainage";
 
 import moment from "moment";
@@ -64,6 +67,7 @@
   TLK: "",
   WTRQ: "",
   TQ: "",
+  FenXianTimer: [],
 });
 const Timers = ref([
   moment().subtract(3, "day").format("YYYY-MM-DD HH:mm:ss"),
@@ -233,6 +237,15 @@
               { offset: 1, color: "#19D6FF" },
             ]), // 数据点颜色
           },
+          markArea: {
+            label: {
+              color: "#fb6061",
+            },
+            itemStyle: {
+              color: "#fb606150",
+            },
+            data: AllData.FenXianTimer,
+          },
         },
         {
           name: AllData.yAxis2_Name,
@@ -301,7 +314,7 @@
             break;
         }
       });
-      init();
+      getFengXianTimer();
     }
   });
 };
@@ -359,6 +372,20 @@
     });
   });
 };
+const getFengXianTimer = () => {
+  monitorAnalysisRiskTimeBetween({
+    startTime: Timers.value[0],
+    endTime: Timers.value[1],
+    stCode: props.Getproperties.stCode,
+    dataCode: props.Getproperties.dataCode,
+    menuType: "ydfxfxJCFX",
+  }).then((res) => {
+    if (res && res.code == 200) {
+      AllData.FenXianTimer = res.data;
+      init();
+    }
+  });
+};
 onMounted(() => {
   nextTick(() => {
     if (props.Getproperties.daterange) {
@@ -377,7 +404,9 @@
   width: 100%;
   height: 100%;
   #HeaderEcharts {
-    width: 1198px;
+    // width: 1198px;
+    // height: 320px;
+    width: 100%;
     height: 320px;
   }
   #BodyFenXi {
diff --git a/src/views/pictureOnMap/page/components/DialogTabs/component/ylfxJCFX.vue b/src/views/pictureOnMap/page/components/DialogTabs/component/ylfxJCFX.vue
index 91045c0..5355b13 100644
--- a/src/views/pictureOnMap/page/components/DialogTabs/component/ylfxJCFX.vue
+++ b/src/views/pictureOnMap/page/components/DialogTabs/component/ylfxJCFX.vue
@@ -47,6 +47,7 @@
 import { ref, reactive, toRefs, onMounted, nextTick } from "vue";
 import * as echarts from "echarts";
 import { drainageDispatchRainAnalysisByGwjcd, getEchart } from "@/api/MonitorAssetsOnMap";
+import { monitorAnalysisRiskTimeBetween } from "@/api/MonitoringAnalysis";
 import moment from "moment";
 
 const props = defineProps({
@@ -79,6 +80,7 @@
   GSW: 0,
   MG: 0,
   YL: 0,
+  FenXianTimer: [],
 });
 const Timers = ref([
   moment().subtract(3, "day").format("YYYY-MM-DD HH:mm:ss"),
@@ -225,6 +227,15 @@
               { offset: 1, color: "#19D6FF" },
             ]), // 数据点颜色
           },
+          markArea: {
+            label: {
+              color: "#fb6061",
+            },
+            itemStyle: {
+              color: "#fb606150",
+            },
+            data: AllData.FenXianTimer,
+          },
         },
         {
           name: AllData.yAxis3_Name,
@@ -361,7 +372,7 @@
             break;
         }
       });
-      init();
+      getFengXianTimer();
     }
   });
 };
@@ -409,6 +420,20 @@
   }
   return text;
 }
+const getFengXianTimer = () => {
+  monitorAnalysisRiskTimeBetween({
+    startTime: Timers.value[0],
+    endTime: Timers.value[1],
+    stCode: props.Getproperties.stCode,
+    dataCode: props.Getproperties.dataCode,
+    menuType: "ylfxJCFX",
+  }).then((res) => {
+    if (res && res.code == 200) {
+      AllData.FenXianTimer = res.data;
+      init();
+    }
+  });
+};
 onMounted(() => {
   nextTick(() => {
     if (props.Getproperties.daterange) {
@@ -426,7 +451,9 @@
   width: 100%;
   height: 100%;
   #HeaderEcharts {
-    width: 1198px;
+    // width: 1198px;
+    // height: 320px;
+    width: 100%;
     height: 320px;
   }
   #BodyFenXi {

diff --git a/src/api/MonitoringAnalysis.js b/src/api/MonitoringAnalysis.js
index 3a6a7ad..556a8ff 100644
--- a/src/api/MonitoringAnalysis.js
+++ b/src/api/MonitoringAnalysis.js
@@ -144,4 +144,11 @@
     method: 'get',
     params,
   });
+}
+export function monitorAnalysisRiskTimeBetween(params) {
+  return request({
+    url: `business/monitorAnalysis/riskTimeBetween`,
+    method: 'get',
+    params,
+  });
 }
\ No newline at end of file
diff --git a/src/views/pictureOnMap/page/components/DialogTabs/component/dxssrfxJCFX.vue b/src/views/pictureOnMap/page/components/DialogTabs/component/dxssrfxJCFX.vue
index 7a2052f..ec5aaa5 100644
--- a/src/views/pictureOnMap/page/components/DialogTabs/component/dxssrfxJCFX.vue
+++ b/src/views/pictureOnMap/page/components/DialogTabs/component/dxssrfxJCFX.vue
@@ -28,7 +28,10 @@
 import { ref, reactive, toRefs, onMounted, nextTick } from "vue";
 import * as echarts from "echarts";
 import { getEchart } from "@/api/MonitorAssetsOnMap";
-import { riskAnalysisReason } from "@/api/MonitoringAnalysis";
+import {
+  riskAnalysisReason,
+  monitorAnalysisRiskTimeBetween,
+} from "@/api/MonitoringAnalysis";
 import { rainCalendar } from "@/api/FloodControlAndDrainage";
 
 import moment from "moment";
@@ -65,6 +68,7 @@
   TLK: "",
   WTRQ: "",
   TQ: "",
+  FenXianTimer: [],
 });
 const Timers = ref([
   moment().subtract(3, "day").format("YYYY-MM-DD HH:mm:ss"),
@@ -265,6 +269,15 @@
               { offset: 1, color: "#19D6FF" },
             ]), // 数据点颜色
           },
+          markArea: {
+            label: {
+              color: "#fb6061",
+            },
+            itemStyle: {
+              color: "#fb606150",
+            },
+            data: AllData.FenXianTimer,
+          },
         },
         {
           name: AllData.yAxis2_Name,
@@ -351,7 +364,8 @@
             break;
         }
       });
-      init();
+
+      getFengXianTimer();
     }
   });
 };
@@ -409,6 +423,20 @@
     });
   });
 };
+const getFengXianTimer = () => {
+  monitorAnalysisRiskTimeBetween({
+    startTime: Timers.value[0],
+    endTime: Timers.value[1],
+    stCode: props.Getproperties.stCode,
+    dataCode: props.Getproperties.dataCode,
+    menuType: "dxssrfxJCFX",
+  }).then((res) => {
+    if (res && res.code == 200) {
+      AllData.FenXianTimer = res.data;
+      init();
+    }
+  });
+};
 onMounted(() => {
   nextTick(() => {
     if (props.Getproperties.daterange) {
@@ -427,7 +455,9 @@
   width: 100%;
   height: 100%;
   #HeaderEcharts {
-    width: 1198px;
+    // width: 1198px;
+    // height: 320px;
+    width: 100%;
     height: 320px;
   }
   #BodyFenXi {
diff --git a/src/views/pictureOnMap/page/components/DialogTabs/component/szycfxJCFX.vue b/src/views/pictureOnMap/page/components/DialogTabs/component/szycfxJCFX.vue
index ecf503b..564c510 100644
--- a/src/views/pictureOnMap/page/components/DialogTabs/component/szycfxJCFX.vue
+++ b/src/views/pictureOnMap/page/components/DialogTabs/component/szycfxJCFX.vue
@@ -28,7 +28,10 @@
 import { ref, reactive, toRefs, onMounted, nextTick } from "vue";
 import * as echarts from "echarts";
 import { getEchart } from "@/api/MonitorAssetsOnMap";
-import { riskAnalysisReason } from "@/api/MonitoringAnalysis";
+import {
+  riskAnalysisReason,
+  monitorAnalysisRiskTimeBetween,
+} from "@/api/MonitoringAnalysis";
 import { rainCalendar } from "@/api/FloodControlAndDrainage";
 
 import moment from "moment";
@@ -67,6 +70,7 @@
   TQ: "",
   JKSZ: 0,
   PFBZ: 0,
+  FenXianTimer: [],
 });
 const Timers = ref([
   moment().subtract(3, "day").format("YYYY-MM-DD HH:mm:ss"),
@@ -238,6 +242,15 @@
               { offset: 1, color: "#19D6FF" },
             ]), // 数据点颜色
           },
+          markArea: {
+            label: {
+              color: "#fb6061",
+            },
+            itemStyle: {
+              color: "#fb606150",
+            },
+            data: AllData.FenXianTimer,
+          },
         },
         {
           name: AllData.yAxis2_Name,
@@ -351,7 +364,8 @@
             break;
         }
       });
-      init();
+
+      getFengXianTimer();
     }
   });
 };
@@ -408,6 +422,20 @@
     });
   });
 };
+const getFengXianTimer = () => {
+  monitorAnalysisRiskTimeBetween({
+    startTime: Timers.value[0],
+    endTime: Timers.value[1],
+    stCode: props.Getproperties.stCode,
+    dataCode: props.Getproperties.dataCode,
+    menuType: "szycfxJCFX",
+  }).then((res) => {
+    if (res && res.code == 200) {
+      AllData.FenXianTimer = res.data;
+      init();
+    }
+  });
+};
 onMounted(() => {
   nextTick(() => {
     if (props.Getproperties.daterange) {
@@ -430,7 +458,9 @@
     color: white !important;
   }
   #HeaderEcharts {
-    width: 1198px;
+    // width: 1198px;
+    // height: 320px;
+    width: 100%;
     height: 320px;
   }
   #BodyFenXi {
diff --git a/src/views/pictureOnMap/page/components/DialogTabs/component/wszrfxJCFX.vue b/src/views/pictureOnMap/page/components/DialogTabs/component/wszrfxJCFX.vue
index 1431eda..060da46 100644
--- a/src/views/pictureOnMap/page/components/DialogTabs/component/wszrfxJCFX.vue
+++ b/src/views/pictureOnMap/page/components/DialogTabs/component/wszrfxJCFX.vue
@@ -28,7 +28,10 @@
 import { ref, reactive, toRefs, onMounted, nextTick } from "vue";
 import * as echarts from "echarts";
 import { getEchart } from "@/api/MonitorAssetsOnMap";
-import { riskAnalysisReason } from "@/api/MonitoringAnalysis";
+import {
+  riskAnalysisReason,
+  monitorAnalysisRiskTimeBetween,
+} from "@/api/MonitoringAnalysis";
 import { rainCalendar } from "@/api/FloodControlAndDrainage";
 
 import moment from "moment";
@@ -66,6 +69,7 @@
   TLK: "",
   WTRQ: "",
   TQ: "",
+  FenXianTimer: [],
 });
 const Timers = ref([
   moment().subtract(3, "day").format("YYYY-MM-DD HH:mm:ss"),
@@ -266,6 +270,15 @@
               { offset: 1, color: "#19D6FF" },
             ]), // 数据点颜色
           },
+          markArea: {
+            label: {
+              color: "#fb6061",
+            },
+            itemStyle: {
+              color: "#fb606150",
+            },
+            data: AllData.FenXianTimer,
+          },
         },
         {
           name: AllData.yAxis2_Name,
@@ -351,7 +364,8 @@
             break;
         }
       });
-      init();
+
+      getFengXianTimer();
     }
   });
 };
@@ -409,6 +423,21 @@
     });
   });
 };
+
+const getFengXianTimer = () => {
+  monitorAnalysisRiskTimeBetween({
+    startTime: Timers.value[0],
+    endTime: Timers.value[1],
+    stCode: props.Getproperties.stCode,
+    dataCode: props.Getproperties.dataCode,
+    menuType: "wszrfxJCFX",
+  }).then((res) => {
+    if (res && res.code == 200) {
+      AllData.FenXianTimer = res.data;
+      init();
+    }
+  });
+};
 onMounted(() => {
   nextTick(() => {
     if (props.Getproperties.daterange) {
@@ -427,7 +456,9 @@
   width: 100%;
   height: 100%;
   #HeaderEcharts {
-    width: 1198px;
+    // width: 1198px;
+    // height: 320px;
+    width: 100%;
     height: 320px;
   }
   #BodyFenXi {
diff --git a/src/views/pictureOnMap/page/components/DialogTabs/component/ydfxfxJCFX.vue b/src/views/pictureOnMap/page/components/DialogTabs/component/ydfxfxJCFX.vue
index e98ba4e..2092ec9 100644
--- a/src/views/pictureOnMap/page/components/DialogTabs/component/ydfxfxJCFX.vue
+++ b/src/views/pictureOnMap/page/components/DialogTabs/component/ydfxfxJCFX.vue
@@ -28,7 +28,10 @@
 import { ref, reactive, toRefs, onMounted, nextTick } from "vue";
 import * as echarts from "echarts";
 import { getEchart } from "@/api/MonitorAssetsOnMap";
-import { riskAnalysisReason } from "@/api/MonitoringAnalysis";
+import {
+  riskAnalysisReason,
+  monitorAnalysisRiskTimeBetween,
+} from "@/api/MonitoringAnalysis";
 import { rainCalendar } from "@/api/FloodControlAndDrainage";
 
 import moment from "moment";
@@ -64,6 +67,7 @@
   TLK: "",
   WTRQ: "",
   TQ: "",
+  FenXianTimer: [],
 });
 const Timers = ref([
   moment().subtract(3, "day").format("YYYY-MM-DD HH:mm:ss"),
@@ -233,6 +237,15 @@
               { offset: 1, color: "#19D6FF" },
             ]), // 数据点颜色
           },
+          markArea: {
+            label: {
+              color: "#fb6061",
+            },
+            itemStyle: {
+              color: "#fb606150",
+            },
+            data: AllData.FenXianTimer,
+          },
         },
         {
           name: AllData.yAxis2_Name,
@@ -301,7 +314,7 @@
             break;
         }
       });
-      init();
+      getFengXianTimer();
     }
   });
 };
@@ -359,6 +372,20 @@
     });
   });
 };
+const getFengXianTimer = () => {
+  monitorAnalysisRiskTimeBetween({
+    startTime: Timers.value[0],
+    endTime: Timers.value[1],
+    stCode: props.Getproperties.stCode,
+    dataCode: props.Getproperties.dataCode,
+    menuType: "ydfxfxJCFX",
+  }).then((res) => {
+    if (res && res.code == 200) {
+      AllData.FenXianTimer = res.data;
+      init();
+    }
+  });
+};
 onMounted(() => {
   nextTick(() => {
     if (props.Getproperties.daterange) {
@@ -377,7 +404,9 @@
   width: 100%;
   height: 100%;
   #HeaderEcharts {
-    width: 1198px;
+    // width: 1198px;
+    // height: 320px;
+    width: 100%;
     height: 320px;
   }
   #BodyFenXi {
diff --git a/src/views/pictureOnMap/page/components/DialogTabs/component/ylfxJCFX.vue b/src/views/pictureOnMap/page/components/DialogTabs/component/ylfxJCFX.vue
index 91045c0..5355b13 100644
--- a/src/views/pictureOnMap/page/components/DialogTabs/component/ylfxJCFX.vue
+++ b/src/views/pictureOnMap/page/components/DialogTabs/component/ylfxJCFX.vue
@@ -47,6 +47,7 @@
 import { ref, reactive, toRefs, onMounted, nextTick } from "vue";
 import * as echarts from "echarts";
 import { drainageDispatchRainAnalysisByGwjcd, getEchart } from "@/api/MonitorAssetsOnMap";
+import { monitorAnalysisRiskTimeBetween } from "@/api/MonitoringAnalysis";
 import moment from "moment";
 
 const props = defineProps({
@@ -79,6 +80,7 @@
   GSW: 0,
   MG: 0,
   YL: 0,
+  FenXianTimer: [],
 });
 const Timers = ref([
   moment().subtract(3, "day").format("YYYY-MM-DD HH:mm:ss"),
@@ -225,6 +227,15 @@
               { offset: 1, color: "#19D6FF" },
             ]), // 数据点颜色
           },
+          markArea: {
+            label: {
+              color: "#fb6061",
+            },
+            itemStyle: {
+              color: "#fb606150",
+            },
+            data: AllData.FenXianTimer,
+          },
         },
         {
           name: AllData.yAxis3_Name,
@@ -361,7 +372,7 @@
             break;
         }
       });
-      init();
+      getFengXianTimer();
     }
   });
 };
@@ -409,6 +420,20 @@
   }
   return text;
 }
+const getFengXianTimer = () => {
+  monitorAnalysisRiskTimeBetween({
+    startTime: Timers.value[0],
+    endTime: Timers.value[1],
+    stCode: props.Getproperties.stCode,
+    dataCode: props.Getproperties.dataCode,
+    menuType: "ylfxJCFX",
+  }).then((res) => {
+    if (res && res.code == 200) {
+      AllData.FenXianTimer = res.data;
+      init();
+    }
+  });
+};
 onMounted(() => {
   nextTick(() => {
     if (props.Getproperties.daterange) {
@@ -426,7 +451,9 @@
   width: 100%;
   height: 100%;
   #HeaderEcharts {
-    width: 1198px;
+    // width: 1198px;
+    // height: 320px;
+    width: 100%;
     height: 320px;
   }
   #BodyFenXi {
diff --git a/src/views/pictureOnMap/page/components/DialogTabs/component/yszrfxJCFX.vue b/src/views/pictureOnMap/page/components/DialogTabs/component/yszrfxJCFX.vue
index 4fac233..6dc1e18 100644
--- a/src/views/pictureOnMap/page/components/DialogTabs/component/yszrfxJCFX.vue
+++ b/src/views/pictureOnMap/page/components/DialogTabs/component/yszrfxJCFX.vue
@@ -28,7 +28,10 @@
 import { ref, reactive, toRefs, onMounted, nextTick } from "vue";
 import * as echarts from "echarts";
 import { getEchart } from "@/api/MonitorAssetsOnMap";
-import { riskAnalysisReason } from "@/api/MonitoringAnalysis";
+import {
+  riskAnalysisReason,
+  monitorAnalysisRiskTimeBetween,
+} from "@/api/MonitoringAnalysis";
 import { rainCalendar } from "@/api/FloodControlAndDrainage";
 
 import moment from "moment";
@@ -66,6 +69,7 @@
   TLK: "",
   WTRQ: "",
   TQ: "",
+  FenXianTimer: [],
 });
 
 const Timers = ref([
@@ -267,6 +271,15 @@
               { offset: 1, color: "#19D6FF" },
             ]), // 数据点颜色
           },
+          markArea: {
+            label: {
+              color: "#fb6061",
+            },
+            itemStyle: {
+              color: "#fb606150",
+            },
+            data: AllData.FenXianTimer,
+          },
         },
         {
           name: AllData.yAxis2_Name,
@@ -352,7 +365,7 @@
             break;
         }
       });
-      init();
+      getFengXianTimer();
     }
   });
 };
@@ -410,6 +423,20 @@
     });
   });
 };
+const getFengXianTimer = () => {
+  monitorAnalysisRiskTimeBetween({
+    startTime: Timers.value[0],
+    endTime: Timers.value[1],
+    stCode: props.Getproperties.stCode,
+    dataCode: props.Getproperties.dataCode,
+    menuType: "yszrfxJCFX",
+  }).then((res) => {
+    if (res && res.code == 200) {
+      AllData.FenXianTimer = res.data;
+      init();
+    }
+  });
+};
 onMounted(() => {
   nextTick(() => {
     if (props.Getproperties.daterange) {
@@ -429,7 +456,9 @@
   width: 100%;
   height: 100%;
   #HeaderEcharts {
-    width: 1198px;
+    // width: 1198px;
+    // height: 320px;
+    width: 100%;
     height: 320px;
   }
   #BodyFenXi {