浏览代码

ppt内季节性图显示右轴及同期设置

cxmo 9 月之前
父节点
当前提交
f417f0735a
共有 2 个文件被更改,包括 131 次插入3 次删除
  1. 125 2
      src/views/ppt_manage/mixins/mixins.js
  2. 6 1
      src/views/ppt_manage/mixins/pptMixins.js

+ 125 - 2
src/views/ppt_manage/mixins/mixins.js

@@ -439,7 +439,7 @@ export default {
     setSeasonChart() {
       /* 季节性图的图表配置 */
       const chartData = this.dataList[0];
-
+      const {SeasonRightConfig={}} = this.chartInfo
        /* 主题样式*/
       const chartTheme =  this.chartInfo.ChartThemeStyle ? JSON.parse(this.chartInfo.ChartThemeStyle) : null;
 
@@ -456,9 +456,14 @@ export default {
         seasonData = []
 
         //获取对应轴的上下限
-        let minLimit = 0,maxLimit = 0
+        let minLimit = 0,maxLimit = 0,rightMin=0,rightMax=0
         minLimit = this.chartLimit.min||0
         maxLimit = this.chartLimit.max||0
+        //右轴
+        if(SeasonRightConfig.IsShow){
+            rightMin = this.chartLimit.rightMin||0
+            rightMax = this.chartLimit.rightMax||0
+        }
       //数据列
       for (let index in chartDataHandle) {
         let j = chartDataHandle[index]
@@ -488,6 +493,79 @@ export default {
         seasonData.push(serie_item);
       }
 
+      //数据列-同期上下限/均线/标准差
+      const {MaxMinLimits={},SamePeriodAverage={},SamePeriodStandardDeviation={}} = this.chartInfo.SeasonAverageConfig||{}
+      if(MaxMinLimits.IsShow&&MaxMinLimits.List&&MaxMinLimits.List.length){
+        let serieItem = {
+            type:'arearange',//上下限是一个范围
+            data:[],
+            name:MaxMinLimits.Legend||'同期上下限',
+            color:MaxMinLimits.Color||'#075EEE'
+        }
+        MaxMinLimits.List.forEach(item=>{
+            serieItem.data.push([item.DataTimestamp,item.MinValue,item.MaxValue])
+        })
+        seasonData.push(serieItem)
+      }
+      if(SamePeriodAverage.IsShow&&SamePeriodAverage.List){
+        let serieItem = {
+            type:'line',
+            data:[],
+            lineWidth:SamePeriodAverage.LineWidth,
+            dashStyle:SamePeriodAverage.LineType,
+            name:SamePeriodAverage.Legend||'同期均值',
+            color:SamePeriodAverage.Color||'#075EEE'
+        }
+        SamePeriodAverage.List.forEach(item=>{
+            serieItem.data.push([item.DataTimestamp,item.Value])
+        })
+        seasonData.push(serieItem)
+      }
+      if(SamePeriodStandardDeviation.IsShow&&SamePeriodStandardDeviation.List){
+        let serieItem = {
+            type:'arearange',//标准差也是一个范围
+            data:[],
+            name:SamePeriodStandardDeviation.Legend||'同期标准差',
+            color:SamePeriodStandardDeviation.Color||'#075EEE'
+        }
+        SamePeriodStandardDeviation.List.forEach(item=>{
+            serieItem.data.push([item.DataTimestamp,item.MinValue,item.MaxValue])
+        })
+        seasonData.push(serieItem)
+      }
+      //数据列-右轴
+      if(SeasonRightConfig.IsShow){
+        //右轴的设置
+        let serieConfig = SeasonRightConfig.Style==='column'?{
+            //柱形
+            type:'column',
+            color:SeasonRightConfig.ChartColor
+        }:{
+            //标记点
+            type:'spline',
+            lineWidth:SeasonRightConfig.LineWidth,
+            dashStyle:SeasonRightConfig.LineStyle,
+            color:SeasonRightConfig.IsConnected?SeasonRightConfig.LineColor:'rgba(255, 255, 255, 0)',//没有连线颜色设置为透明
+            marker:{
+                enabled:true,
+                symbol:SeasonRightConfig.Shape,
+                fillColor:SeasonRightConfig.ChartColor,
+                radius:SeasonRightConfig.Size
+            },
+        }
+        let serieItem = {
+            ...serieConfig,
+            name:SeasonRightConfig.Legend||'右轴',
+            data:[],
+            yAxis:1,
+        }
+        const DataList = (SeasonRightConfig.IndicatorType===1?SeasonRightConfig.EdbInfoList[0].DataList:this.dataList[1].DataList)||[]
+        DataList.forEach(item=>{
+            serieItem.data.push([item.DataTimestamp,item.Value])
+        })
+        seasonData.push(serieItem)
+      }
+
       //y轴
       const textZh = chartData.ConvertUnit||chartData.Unit
       const textEn = chartData.ConvertEnUnit||chartData.UnitEn||chartData.ConvertUnit||chartData.Unit
@@ -526,6 +604,38 @@ export default {
         plotBands: this.setAxisPlotAreas(1),
         plotLines: this.setAxisPlotLines(1)
       }];
+      //如果有右轴,seasonYdata加上右轴
+      if(SeasonRightConfig.IsShow){
+        const rightEdb = (SeasonRightConfig.IndicatorType===1?SeasonRightConfig.EdbInfoList[0]:this.dataList[1])||{unit:''}
+        seasonYdata.push({
+            ...seasonOptions.yAxis,
+            opposite: true,//右轴
+            labels: {
+                formatter: function () {
+                  let val = this.value;
+                  return val;
+                },
+                align: 'center',
+                style: {
+                  ...chartTheme&&chartTheme.yAxisOptions.style
+                }
+              },
+              title: {
+                text: SeasonRightConfig.Legend||'右轴test',
+                style:{
+                  ...chartTheme&&chartTheme.yAxisOptions.style
+                },
+                align: 'high',
+                rotation: 0,
+                y: -12,
+                x: -rightEdb.Unit.length*12 ,
+                textAlign: 'right',
+                reserveSpace: false,
+              },
+              max: Number(rightMax),
+              min: Number(rightMin),
+        })
+      }
 
       // 季节图x轴显示月/日 周度指标额外处理时间轴显示
       const xAxis = {
@@ -2032,6 +2142,19 @@ export default {
             this.chartLimit.rightTwoMin = 0
             this.chartLimit.rightTwoMax = 0
         }
+        //季节性图-右轴为左轴同比,单独处理
+        if(this.chartInfo.ChartType===2){
+            if(this.chartInfo.SeasonRightConfig&&this.chartInfo.SeasonRightConfig.IsShow){
+                if(this.chartInfo.SeasonRightConfig.IndicatorType===1){
+                    this.chartLimit.rightMin = this.chartInfo.SeasonRightConfig.EdbInfoList[0].MinData||0
+                    this.chartLimit.rightMax = this.chartInfo.SeasonRightConfig.EdbInfoList[0].MaxData||0
+                }else{
+                    this.chartLimit.rightMin = tableData[1].MinData||0
+                    this.chartLimit.rightMax = tableData[1].MaxData||0
+                }
+                
+            }
+        }
     },
     calcLimit(arr) {
         return {

+ 6 - 1
src/views/ppt_manage/mixins/pptMixins.js

@@ -281,7 +281,12 @@ export default {
       if([1,11].includes(this.chartInfo.Source)) { //常规图
         //处理下历史默认来源
         this.setDefaultSourceFrom();
-        
+        //季节性图处理SeasonAverageConfig,SeasonRightEdbConfig
+        if(this.chartInfo.ChartType===2){
+            const {MaxMinLimits,SamePeriodAverage,SamePeriodStandardDeviation,RightAxis} = Data.DataResp
+            this.chartInfo.SeasonAverageConfig = {MaxMinLimits,SamePeriodAverage,SamePeriodStandardDeviation}
+            this.chartInfo.SeasonRightConfig = RightAxis
+        }
         this.dataList = Data.EdbInfoList;
         //初始化上下限
         this.setLimitData(this.dataList)