Forráskód Böngészése

季节图间距调整

Karsa 1 éve
szülő
commit
e641ba9e9c
1 módosított fájl, 51 hozzáadás és 157 törlés
  1. 51 157
      src/views/chartShow/index.vue

+ 51 - 157
src/views/chartShow/index.vue

@@ -930,118 +930,55 @@ export default defineComponent({
                       chartData.DataList
 
       let seasonYdata:any[] = [],
-        seasonData:any[] = [],
-        chart = {
-          spacing: [5, 8, 2, 8],
+        seasonData:any[] = [];
+
+      /*处理数据列*/
+      for (let j of chartDataHandle) {
+        //预测指标配置
+        let predict_params =  chartData.EdbInfoCategoryType === 1 ? getSeasonPredictParams(j.CuttingDataTimestamp) : {};
+
+        let serie_item = {
+          data: [] as any[],
+          type: chartData.ChartStyle,
+          yAxis: 0,
+          name: j.ChartLegend,
+          ...predict_params
         };
+        const data_array = _.cloneDeep(j.DataList);
+        data_array &&
+          data_array.forEach((item: IParams) => {
+            serie_item.data.push([item.DataTimestamp, item.Value]);
+          });
+        seasonData.push(serie_item);
+      }
 
-      /* 公历数据处理 处理数据列 y轴 */
-      // if (state.chartInfo.Calendar === '公历')
-        for (let j of chartDataHandle) {
-          //预测指标配置
-          let predict_params =  chartData.EdbInfoCategoryType === 1 ? getSeasonPredictParams(j.CuttingDataTimestamp) : {};
-
-          let serie_item = {
-            data: [] as any[],
-            type: chartData.ChartStyle,
-            yAxis: 0,
-            name: j.ChartLegend,
-            ...predict_params
-          };
-          const data_array = _.cloneDeep(j.DataList);
-          data_array &&
-            data_array.forEach((item: IParams) => {
-              serie_item.data.push([item.DataTimestamp, item.Value]);
-            });
-          const index = chartDataHandle.findIndex(
-            (item: ISeasonDataItemProps) => item.ChartLegend === j.ChartLegend
-          );
-          let textEn = chartData.Unit?chartData.UnitEn:''
-          const s_yItem = {
-            labels: {
-              formatter: function (ctx: any) {
-                let val = ctx.value;
-                return index !== 0 ? '' : val;
-              },
-              align: 'center',
-              style: {
-                fontSize: '10px',
-              },
-              x: -5,
-            },
-            title: {
-              text:language.value=='ch'?`${chartData.Unit}`:textEn,
-              // text: null,
-              align: 'high',
-              rotation: 0,
-              y: -15,
-              offset: -(10 * chartData.Unit.length),
-            },
-            max: Number(chartData.MaxData),
-            min: Number(chartData.MinData),
-            ...defaultOpts.yAxis,
-          };
-          seasonData.push(serie_item);
-          seasonYdata.push(s_yItem);
-        }
+      //y轴
+      seasonYdata = [{
+        labels: {
+          formatter: function (ctx: any) {
+            let val = ctx.value;
+            return val;
+          },
+          align: 'center',
+          style: {
+            fontSize: '10px',
+          },
+        },
+        title: {
+          text:language.value=='ch'?`${chartData.Unit}`:chartData.UnitEn,
+          align: 'high',
+          rotation: 0,
+          y: -15,
+          x: 0,
+          textAlign: 'left',
+          reserveSpace: false
+        },
+        max: Number(chartData.MaxData),
+        min: Number(chartData.MinData),
+        ...defaultOpts.yAxis,
+      }];
 
-      /* 农历数据处理  */
-      // let filterArr =
-      //   state.chartInfo.Calendar === '农历'
-      //     ? chartData.DataList.List.filter(
-      //         (item: ILunarItem, index: number) => index > 0
-      //       )
-      //     : [];
-      // if (state.chartInfo.Calendar === '农历')
-      //   for (let j of filterArr) {
-      //      //预测指标配置
-      //     let predict_params =  chartData.EdbInfoCategoryType === 1 ? getSeasonPredictParams(j.CuttingDataTimestamp) : {};
-
-      //     let serie_item = {
-      //       data: [] as any[],
-      //       type: chartData.ChartStyle,
-      //       yAxis: 0,
-      //       name: j.Year,
-      //       ...predict_params
-      //     };
-      //     const data_array = _.cloneDeep(j.Items);
-      //     data_array &&
-      //       data_array.forEach((item: IParams) => {
-      //         serie_item.data.push([item.DataTimestamp, item.Value]);
-      //       });
-      //     const index = filterArr.findIndex(
-      //       (item: ILunarItem) => item.Year === j.Year
-      //     );
-      //     let textEn = chartData.Unit?chartData.UnitEn:''
-      //     const s_yItem = {
-      //       labels: {
-      //         formatter: function (ctx: any) {
-      //           let val = ctx.value;
-      //           return index !== 0 ? '' : val;
-      //         },
-      //         align: 'center',
-      //         style: {
-      //           fontSize: '10px',
-      //         },
-      //         x: -5,
-      //       },
-      //       title: {
-      //         text:language.value=='ch'?`${chartData.Unit}`:textEn,
-      //         // text: null,
-      //         align: 'high',
-      //         rotation: 0,
-      //         y: -15,
-      //         offset: -(10 * chartData.Unit.length),
-      //       },
-      //       max: Number(chartData.MaxData),
-      //       min: Number(chartData.MinData),
-      //       ...defaultOpts.yAxis,
-      //     };
-      //     seasonData.push(serie_item);
-      //     seasonYdata.push(s_yItem);
-      //   }
-
-      // 季节图x轴显示月/日 周度指标额外处理时间轴显示
+      // 季节图x轴显示月/日
       const xAxis = {
         ...defaultOpts.xAxis,
         tickInterval:  screen.value === 'phone' ? 24 * 3600 * 1000 * 60 : undefined,
@@ -1055,10 +992,9 @@ export default defineComponent({
         },
       };
 
-      // 季节图提示框显示 月/日
-      defaultOpts.tooltip = {
-        split: false,
-        shared: true,
+
+      const tooltip = {
+        ...defaultOpts.tooltip,
         dateTimeLabelFormats: {
           // 时间格式化字符
           day: '%m/%d',
@@ -1067,56 +1003,14 @@ export default defineComponent({
           year: '%m/%d',
         },
         xDateFormat: '%m/%d',
-        // valueDecimals: 2,
-      };
-
-      //农历默认选中一年数据并隐藏按钮  公历显示全部数据
-      // let rangeSelector = state.chartInfo.Calendar === '农历'
-      //   ? {
-      //       enabled: true,
-      //       selected: 0,
-      //       inputStyle: {
-      //         display: 'none',
-      //       },
-      //       labelStyle: {
-      //         display: 'none',
-      //       },
-      //       buttonTheme: {
-      //         style: {
-      //           display: 'none',
-      //         },
-      //       },
-      //       buttons: [
-      //         {
-      //           type: 'month',
-      //           count: 12,
-      //           text: '12月',
-      //         },
-      //         {
-      //           type: 'month',
-      //           count: 15,
-      //           text: '15月',
-      //         },
-      //         {
-      //           type: 'all',
-      //           text: '全部',
-      //         },
-      //       ],
-      //     }
-      //   : {
-      //       enabled: false,
-      //     };
+      }
 
       state.options = {
         colors:seasonOptions.colors.slice(-chartDataHandle.length),
-          // state.chartInfo.Calendar === '公历'
-          //   ? seasonOptions.colors.slice(-chartData.DataList.length)
-          //   : seasonOptions.colors.slice(-filterArr.length),
         series: seasonData,
         yAxis: seasonYdata,
         xAxis,
-        // rangeSelector,
-        chart
+        tooltip
       };
     }