瀏覽代碼

将上下限统一到chartLimit内维护

cxmo 1 年之前
父節點
當前提交
4f79b3c26f
共有 1 個文件被更改,包括 68 次插入43 次删除
  1. 68 43
      src/hooks/chart/useChartRender.ts

+ 68 - 43
src/hooks/chart/useChartRender.ts

@@ -42,12 +42,13 @@ interface StateProps {
     max?: number;
     x_min?:number;
     x_max?:number;
+    rightMin?:number;
+    rightMax?:number;
+    rightTwoMin?:number;
+    rightTwoMax?:number;
   }
   dataList: any[];
   chartInfo: any;
-  leftLimitData:any[];
-  rightLimitData:any[];
-  rightTwoLimitData:any[];
 }
 
 /**
@@ -72,10 +73,14 @@ interface StateProps {
 const state = reactive<StateProps>({
   chartInfo: {},
   dataList: [],
-  chartLimit: {},
-  leftLimitData:[0,0],//左轴上下限
-  rightLimitData:[0,0],//右轴上下限
-  rightTwoLimitData:[0,0],//右二轴上下限
+  chartLimit: {
+    min:0, //左轴上下限
+    max:0,
+    rightMin:0,//右轴上下限
+    rightMax:0,
+    rightTwoMin:0,//右二轴上下限
+    rightTwoMax:0,
+  },
 })
 const language = ref('')
 const routeQuery = ref<any>({});//路由参
@@ -156,12 +161,14 @@ const setDefaultLineOptions = () => {
     let minLimit = 0,maxLimit = 0
     if(isETASource){
         const limitMap = {
-            0:state.rightLimitData||[],
-            1:state.leftLimitData||[],
-            2:state.rightTwoLimitData||[]
+            0:['rightMin','rightMax'],
+            1:['min','max'],
+            2:['rightTwoMin','rightTwoMax']
+        }
+        if(limitMap[item.IsAxis]){
+            minLimit = state.chartLimit[`${limitMap[item.IsAxis][0]}`]||0
+            maxLimit = state.chartLimit[`${limitMap[item.IsAxis][1]}`]||0
         }
-        minLimit = limitMap[item.IsAxis][1]||0
-        maxLimit = limitMap[item.IsAxis][0]||0
     }else{
         minLimit = dataList[sameSideIndex].MinData
         maxLimit = dataList[sameSideIndex].MaxData
@@ -329,8 +336,8 @@ const setSeasonOptions = () => {
 
     //获取对应轴的上下限
     let minLimit = 0,maxLimit = 0
-    minLimit = state.leftLimitData[1]||0
-    maxLimit = state.leftLimitData[0]||0
+    minLimit = state.chartLimit.min||0
+    maxLimit = state.chartLimit.max||0
 
     /* 主题样式*/
   const chartTheme =  state.chartInfo.ChartThemeStyle ? JSON.parse(state.chartInfo.ChartThemeStyle) : null;
@@ -480,13 +487,14 @@ const setStackOrCombinChart = () => {
     //获取对应轴的上下限
     let minLimit = 0,maxLimit = 0
     const limitMap = {
-        0:state.rightLimitData||[],
-        1:state.leftLimitData||[],
-        2:state.rightTwoLimitData||[]
+        0:['rightMin','rightMax'],
+        1:['min','max'],
+        2:['rightTwoMin','rightTwoMax']
+    }
+    if(limitMap[item.IsAxis]){
+        minLimit = state.chartLimit[`${limitMap[item.IsAxis][0]}`]||0
+        maxLimit = state.chartLimit[`${limitMap[item.IsAxis][1]}`]||0
     }
-    minLimit = limitMap[item.IsAxis][1]||0
-    maxLimit = limitMap[item.IsAxis][0]||0
-    console.log('min?max',minLimit,maxLimit)
     //y轴
     const textZh = item.ConvertUnit||item.Unit
     const textEn = textZh?item.ConvertEnUnit||item.UnitEn||item.ConvertUnit||item.Unit:''
@@ -664,8 +672,8 @@ const setScatterChartOptions = () => {
   const textXEn = textX?dataList[0].ConvertEnUnit||dataList[0].UnitEn||dataList[0].ConvertUnit||dataList[0].Unit:''
   //获取对应轴的上下限
   let minLimit = 0,maxLimit = 0
-  minLimit = state.leftLimitData[1]||0
-  maxLimit = state.leftLimitData[0]||0
+  minLimit = state.chartLimit.min||0
+  maxLimit = state.chartLimit.max||0
   //y轴
   let yAxis = {
     title: {
@@ -1979,9 +1987,12 @@ const setLimitData = (tableData:any=[])=>{
         MinMaxSave
     } = state.chartInfo
     if(MinMaxSave){
-        state.leftLimitData = [Number(LeftMax),Number(LeftMin)]
-        state.rightLimitData = [Number(RightMax),Number(RightMin)]
-        state.rightTwoLimitData = [Number(Right2Max),Number(Right2Min)]
+        state.chartLimit.min = Number(LeftMin)
+        state.chartLimit.max = Number(LeftMax)
+        state.chartLimit.rightMin = Number(RightMin)
+        state.chartLimit.rightMax = Number(RightMax)
+        state.chartLimit.rightTwoMin = Number(Right2Min)
+        state.chartLimit.rightTwoMax = Number(Right2Max)
         //若用户修改过,则检测轴的上下限是否为空,若为空,则需要计算对应轴的上下限
         checkLimit(tableData)
     }else{
@@ -1992,38 +2003,45 @@ const checkLimit = (tableData:any=[])=>{
     //散点图单独处理
     if(state.chartInfo.ChartType===5){
         if(tableData[1]){
-            if(Number(state.leftLimitData[0])===0&&Number(state.leftLimitData[1])===0){
-                state.leftLimitData = [tableData[1].MaxData,tableData[1].MinData]
+            if(Number(state.chartLimit.min)===0&&Number(state.chartLimit.max)===0){
+                state.chartLimit.min = tableData[1].MinData
+                state.chartLimit.max = tableData[1].MaxData
             }
         }
         return 
     }
     //若轴的上下限均为0,则不管用户有没有修改过,都重新赋值
-    if(Number(state.leftLimitData[0])===0&&Number(state.leftLimitData[1])===0){
+    if(Number(state.chartLimit.min)===0&&Number(state.chartLimit.max)===0){
         const leftData = tableData.filter((i:IDataProps)=>i.IsAxis===1).map((i:IDataProps)=>[Number(i.MinData),Number(i.MaxData)])
         if(leftData.length){
             const {Max,Min} = calcLimit(leftData.flat())
-            state.leftLimitData = [Max,Min]
+            state.chartLimit.min = Min
+            state.chartLimit.max = Max
         }else{
-            state.leftLimitData = [0,0]
+            state.chartLimit.min = 0
+            state.chartLimit.max = 0
         }
     }
-    if(Number(state.rightLimitData[0])===0&&Number(state.rightLimitData[1])===0){
+    if(Number(state.chartLimit.rightMin)===0&&Number(state.chartLimit.rightMax)===0){
         const rightData = tableData.filter((i:IDataProps) => !i.IsAxis).map((i:IDataProps)=>[Number(i.MinData),Number(i.MaxData)])
         if(rightData.length){
             const {Max,Min} = calcLimit(rightData.flat())
-            state.rightLimitData = [Max,Min]
+            state.chartLimit.rightMin = Min
+            state.chartLimit.rightMax = Max
         }else{
-            state.rightLimitData = [0,0]
+            state.chartLimit.rightMin = 0
+            state.chartLimit.rightMax = 0
         }
     }
-    if(Number(state.rightTwoLimitData[0])===0&&Number(state.rightTwoLimitData[1])===0){
+    if(Number(state.chartLimit.rightTwoMin)===0&&Number(state.chartLimit.rightTwoMax)===0){
         const rightTwoData = tableData.filter((i:IDataProps)=>i.IsAxis===2).map((i:IDataProps)=>[Number(i.MinData),Number(i.MaxData)])
         if(rightTwoData.length){
             const {Max,Min} = calcLimit(rightTwoData.flat())
-            state.rightTwoLimitData = [Max,Min]
+            state.chartLimit.rightTwoMin = Min
+            state.chartLimit.rightTwoMax = Max
         }else{
-            state.rightTwoLimitData = [0,0]
+            state.chartLimit.rightTwoMin = 0
+            state.chartLimit.rightTwoMax = 0
         }
     }
 }
@@ -2032,7 +2050,8 @@ const calcYAxislimit = (tableData:any=[])=>{
     //散点图单独处理
     if(state.chartInfo.ChartType===5){
         if(tableData[1]){
-            state.leftLimitData = [tableData[1].MaxData,tableData[1].MinData]
+            state.chartLimit.min = tableData[1].MinData
+            state.chartLimit.max = tableData[1].MaxData
         }
         return 
     }
@@ -2046,27 +2065,33 @@ const calcYAxislimit = (tableData:any=[])=>{
             Max,
             Min
         } = calcLimit(leftData.flat())
-        state.leftLimitData = [Max, Min]
+        state.chartLimit.min = Min
+        state.chartLimit.max = Max
     } else {
-        state.leftLimitData = [0, 0]
+        state.chartLimit.min = 0
+        state.chartLimit.max = 0
     }
     if (rightData.length) {
         const {
             Max,
             Min
         } = calcLimit(rightData.flat())
-        state.rightLimitData = [Max, Min]
+        state.chartLimit.rightMin = Min
+        state.chartLimit.rightMax = Max
     } else {
-        state.rightLimitData = [0, 0]
+        state.chartLimit.rightMin = 0
+        state.chartLimit.rightMax = 0
     }
     if (rightTwoData.length) {
         const {
             Max,
             Min
         } = calcLimit(rightTwoData.flat())
-        state.rightTwoLimitData = [Max, Min]
+        state.chartLimit.rightTwoMin = Min
+        state.chartLimit.rightTwoMax = Max
     } else {
-        state.rightTwoLimitData = [0, 0]
+        state.chartLimit.rightTwoMin = 0
+        state.chartLimit.rightTwoMax = 0
     }
 }
 const calcLimit = (arr:any)=>{