Merge branch 'ETA1.9.6'

src/hooks/chart/render.js

@@ -118,7 +118,8 @@ export function chartRender({data,renderId,lang='zh',changeLangIsCheck,showChart
             6: setStackOrCombinChart,
             7: initBarData,
             10: setSectionScatterChart,
-            11: setRadarChart
+            11: setRadarChart,
+            14: setSectionalCombinationChart,
         };
         chartOpt=chartSetMap[data.ChartInfo.ChartType](data)
     }else if([2,5].includes(data.ChartInfo.Source)){//商品价格曲线
@@ -513,6 +514,195 @@ function setChartTitle(showChartTitle){
     }
 }
 
+// 截面组合图
+function setSectionalCombinationChart(e){
+    /* 主题样式*/
+    const chartTheme =  e.ChartInfo.ChartThemeStyle ? JSON.parse(e.ChartInfo.ChartThemeStyle) : null;
+    const {XDataList,UnitList,SeriesList,IsHeap}=e.DataResp;
+
+    axisLimitState.leftIndex=SeriesList.findIndex((item) => item.IsAxis===1);
+    axisLimitState.rightIndex=SeriesList.findIndex((item) => !item.IsAxis);
+    axisLimitState.rightTwoIndex=SeriesList.findIndex((item) => item.IsAxis ===2);
+    if(axisLimitState.leftIndex!=-1) {
+        axisLimitState.hasLeftAxis=true
+    }
+    if(axisLimitState.rightIndex!=-1){
+        axisLimitState.hasRightAxis=true
+    }
+    if(axisLimitState.rightTwoIndex!=-1){
+        axisLimitState.hasRightTwoAxis=true
+    }
+    
+    
+    //x轴
+    const xAxis={
+        categories:XDataList.map(_=>this.currentLang=='en'?_.NameEn:_.Name),
+        tickWidth: 1,
+        labels: {
+          style:{
+            ...chartTheme&&chartTheme.xAxisOptions.style
+          },
+        },
+        plotBands: setAxisPlotAreas(3),
+        plotLines: setAxisPlotLines(3)
+    }
+
+    let yAxis=[]
+    let seriesData=[]
+
+    //有右二轴时排个序 按照左 右 右2的顺序
+    const chartData = SeriesList.some(_ =>_.IsAxis===2) ? changeEdbOrder(SeriesList) : _.cloneDeep(SeriesList);
+    chartData.forEach((item,index)=>{
+        //轴位置值相同的下标
+        const sameSideIndex = chartData.findIndex(
+          (i) => i.IsAxis === item.IsAxis
+        );
+
+        const yTitleMap={
+          1:['LeftName','LeftNameEn'],
+          0:['RightName','RightNameEn'],
+          2:['RightTwoName','RightTwoNameEn'],
+        }
+
+        let minLimit = 0,maxLimit = 0
+        const limitMap = {
+            0:['rightMin','rightMax'],
+            1:['leftMin','leftMax'],
+            2:['rightTwoMin','rightTwoMax']
+        }
+        if(limitMap[item.IsAxis]){
+            minLimit = axisLimitState[`${limitMap[item.IsAxis][0]}`]||0
+            maxLimit = axisLimitState[`${limitMap[item.IsAxis][1]}`]||0
+        }
+
+        let yItem = {
+          ...basicYAxis,
+          title: {
+            text: UnitList[yTitleMap[item.IsAxis][0]],
+            textCh:UnitList[yTitleMap[item.IsAxis][0]], // 中文
+            // 中文不存在，无论英文有无都显示空
+            textEn:UnitList[yTitleMap[item.IsAxis][0]]?UnitList[yTitleMap[item.IsAxis][1]]:'', // 英文
+            style:{
+              ...chartTheme&&chartTheme.yAxisOptions.style
+            },
+            align: 'high',
+            rotation: 0,
+            y: -12,
+            // x: (item.IsAxis===0 && this.rightTwoIndex>-1) ? -chartData[this.rightTwoIndex].Unit.length*12 : 0,
+            textAlign: item.IsAxis===1 ? 'left' : 'right',
+            reserveSpace: false
+          },
+          labels: {
+            formatter: function (ctx) {
+              return ctx.value;
+            },
+            align: 'center',
+            x: [0,2].includes(item.IsAxis) ? 5 : -5,
+            style: {
+              ...chartTheme&&chartTheme.yAxisOptions.style,
+            }
+          },
+          opposite: [0,2].includes(item.IsAxis),
+          min: Number(minLimit),
+          max: Number(maxLimit),
+          tickWidth: 1,
+          visible: sameSideIndex === index,
+          plotBands: setAxisPlotAreas(item.IsAxis),
+          plotLines: setAxisPlotLines(item.IsAxis)
+        };
+
+        //堆叠图的yAxis必须一致 数据列所对应的y轴
+        let serie_yIndex = index;
+        if(IsHeap==1) {
+          // 类型为堆叠图时公用第一个指标y轴 
+          serie_yIndex =  0;
+        }
+
+        //数据列
+        let dataArr=item.DataList||[]
+        // 根据NoDataEdbIndex 将对应位置的值置为null
+        dataArr.forEach((i,index)=>{
+          if(item.NoDataEdbIndex.includes(index)){
+            dataArr[index]=null
+          }
+        })
+        //图表可配置的线条数就10条,第11条用第1条的配置，索引取下模
+        const lineIndex = chartTheme ? index%chartTheme.lineOptionList.length : index
+        let obj={
+          data:dataArr,
+          type: item.ChartStyle||'',
+          dashStyle: (chartTheme&&chartTheme.lineOptionList[lineIndex].dashStyle)||'Solid',
+          chartType:'linear',
+          yAxis: serie_yIndex,
+          name:item.SeriesName,
+          nameZh:item.SeriesName,
+          nameEn:item.SeriesNameEn,
+          unitName:UnitList[yTitleMap[item.IsAxis][0]],
+          unitNameCh:UnitList[yTitleMap[item.IsAxis][0]],
+          unitNameEn:UnitList[yTitleMap[item.IsAxis][0]]?UnitList[yTitleMap[item.IsAxis][1]]:'',
+          color: item.ChartColor,
+          lineWidth: Number(item.ChartWidth)||(chartTheme&&chartTheme.lineOptionList[lineIndex].lineWidth),
+          borderWidth: 1,
+          borderColor: item.ChartColor,
+          marker: {//展示数据点
+            enabled:item.ChartStyle!='column'&&item.IsPoint?true:false,
+            radius: (chartTheme&&chartTheme.lineOptionList[lineIndex].radius)||5,
+          },
+          dataLabels: {//展示数值
+            enabled: item.IsNumber?true:false,
+            align:item.ChartStyle=='column'?'center':undefined,
+            y:item.ChartStyle=='column'?-20:0,
+            inside: item.ChartStyle=='column'?false:undefined,
+            crop: item.ChartStyle=='column'?false:true,
+          },
+          stacking:IsHeap==1?'normal':undefined,
+          zIndex: ['line','spline'].includes(item.ChartStyle) ? 1 : 0, //防止组合图曲线被遮住
+        }
+
+        yAxis.push(yItem)
+        seriesData.push(obj)
+    })
+
+    const tooltip={
+        formatter:function () { 
+          let str=`<b>${this.points[0].x}</b>`
+          this.points.forEach(item=>{
+            const sObj=seriesData.find(_=>_.name===item.series.name)
+            str=str+`<br><span style="color:${item.color}">\u25CF</span>${sObj.name}:${item.y} ${sObj.unitNameCh}`
+          })
+          return str
+        },
+        formatterCh:function () { 
+          let str=`<b>${this.points[0].x}</b>`
+          this.points.forEach(item=>{
+            const sObj=seriesData.find(_=>_.name===item.series.name)
+            str=str+`<br><span style="color:${item.color}">\u25CF</span>${sObj.nameCh}:${item.y} ${sObj.unitNameCh}`
+          })
+          return str
+        },
+        formatterEn:function () { 
+          let str=`<b>${this.points[0].x}</b>`
+          this.points.forEach(item=>{
+            const sObj=seriesData.find(_=>_.name===item.series.name)
+            str=str+`<br><span style="color:${item.color}">\u25CF</span>${sObj.nameEn}:${item.y} ${sObj.unitNameEn}`
+          })
+          return str
+        },
+        shared:true
+    }
+
+    return {
+        title: {
+            text:''
+        },
+        tooltip,
+        series: seriesData,
+        yAxis: yAxis,
+        xAxis,
+    }
+
+}
+
 //统计频率图
 function setStatisticFrequency(e){
     axisLimitState.leftIndex=-1
@@ -1211,7 +1401,8 @@ function setStackOrCombinChart(e){
             visible:true,
             LatestDate:item.LatestDate,
             LatestValue:item.LatestValue,
-            ...predict_params
+            ...predict_params,
+            stacking:e.ChartInfo.ChartType==6&&!e.DataResp.IsHeap?undefined:'normal',
         }
         item.DataList = item.DataList || [];
         for (let i of item.DataList) {