perf(视图): g2plot代码完善

backend/src/main/java/io/dataease/service/chart/util/ChartDataBuild.java

@@ -445,6 +445,7 @@ public class ChartDataBuild {
                 } catch (Exception e) {
                     axisChartDataDTO.setValue(new BigDecimal(0));
                 }
+                axisChartDataDTO.setCategory(yAxis.get(j).getName());
                 series.get(j).getData().add(axisChartDataDTO);
             }
         }
@@ -947,7 +948,7 @@ public class ChartDataBuild {
         if (CollectionUtils.isNotEmpty(fieldMap.get("tooltipAxis"))) {
             fieldMap.get("tooltipAxis").forEach(field -> {
                 Integer deType = field.getDeType();
-                if(deType == 2 || deType == 3) {
+                if (deType == 2 || deType == 3) {
                     yfields.add(field);
                 } else {
                     fields.add(field);
@@ -957,7 +958,7 @@ public class ChartDataBuild {
         if (CollectionUtils.isNotEmpty(fieldMap.get("labelAxis"))) {
             fieldMap.get("labelAxis").forEach(field -> {
                 Integer deType = field.getDeType();
-                if(deType == 2 || deType == 3) {
+                if (deType == 2 || deType == 3) {
                     yfields.add(field);
                 } else {
                     fields.add(field);

frontend/src/views/chart/chart/common/common_antv.js

@@ -606,6 +606,21 @@ export function getYAxisExt(chart) {
           style: {
             fill: a.axisLabel.color,
             fontSize: parseInt(a.axisLabel.fontSize)
+          },
+          formatter: function(value) {
+            if (chart.type === 'waterfall') {
+              return value
+            } else {
+              if (!chart.type.includes('horizontal')) {
+                if (!a.axisLabelFormatter) {
+                  return valueFormatter(value, formatterItem)
+                } else {
+                  return valueFormatter(value, a.axisLabelFormatter)
+                }
+              } else {
+                return value
+              }
+            }
           }
         } : null
 

frontend/src/views/chart/chart/mix/mix_antv.js

@@ -93,7 +93,8 @@ export function baseMixOptionAntV(plot, container, chart, action) {
     appendPadding: getPadding(chart),
     syncViewPadding: true,
     plots: plots,
-    legend: legend
+    legend: legend,
+    tooltip: { shared: true }
   }
 
   // 开始渲染

frontend/src/views/chart/components/ChartComponentG2.vue

@@ -52,6 +52,7 @@ import { baseWaterfallOptionAntV } from '@/views/chart/chart/waterfall/waterfall
 import { baseWordCloudOptionAntV } from '@/views/chart/chart/wordCloud/word_cloud'
 import TitleRemark from '@/views/chart/view/TitleRemark'
 import { DEFAULT_TITLE_STYLE } from '@/views/chart/chart/chart'
+import { baseMixOptionAntV } from '@/views/chart/chart/mix/mix_antv'
 
 export default {
   name: 'ChartComponentG2',
@@ -252,6 +253,8 @@ export default {
         this.myChart = baseWaterfallOptionAntV(this.myChart, this.chartId, chart, this.antVAction)
       } else if (chart.type === 'word-cloud') {
         this.myChart = baseWordCloudOptionAntV(this.myChart, this.chartId, chart, this.antVAction)
+      } else if (chart.type === 'chart-mix') {
+        this.myChart = baseMixOptionAntV(this.myChart, this.chartId, chart, this.antVAction)
       } else {
         if (this.myChart) {
           this.antVRenderStatus = false

frontend/src/views/chart/components/shape-attr/SizeSelectorAntV.vue

@@ -358,6 +358,100 @@
             @change="changeBarSizeCase('tableColumnWidth')"
           />
         </el-form-item>
+
+        <!--chart-mix-start-->
+        <span v-show="showProperty('mix')">
+          <el-divider content-position="center" class="divider-style">{{ $t('chart.chart_bar') }}</el-divider>
+          <el-form-item :label="$t('chart.adapt')" class="form-item">
+            <el-checkbox v-model="sizeForm.barDefault" @change="changeBarSizeCase('barDefault')">{{ $t('chart.adapt') }}</el-checkbox>
+          </el-form-item>
+          <el-form-item :label="$t('chart.bar_gap')" class="form-item form-item-slider">
+            <el-slider
+              v-model="sizeForm.barGap"
+              :disabled="sizeForm.barDefault"
+              show-input
+              :show-input-controls="false"
+              input-size="mini"
+              :min="0"
+              :max="5"
+              :step="0.1"
+              @change="changeBarSizeCase('barGap')"
+            />
+          </el-form-item>
+          <el-divider content-position="center" class="divider-style">{{ $t('chart.chart_line') }}</el-divider>
+          <el-form-item
+            :label="$t('chart.line_width')"
+            class="form-item form-item-slider"
+          >
+            <el-slider
+              v-model="sizeForm.lineWidth"
+              show-input
+              :show-input-controls="false"
+              input-size="mini"
+              :min="0"
+              :max="10"
+              @change="changeBarSizeCase('lineWidth')"
+            />
+          </el-form-item>
+          <el-form-item :label="$t('chart.line_symbol')" class="form-item">
+            <el-select v-model="sizeForm.lineSymbol" :placeholder="$t('chart.line_symbol')" @change="changeBarSizeCase('lineSymbol')">
+              <el-option
+                v-for="item in lineSymbolOptions"
+                :key="item.value"
+                :label="item.name"
+                :value="item.value"
+              />
+            </el-select>
+          </el-form-item>
+          <el-form-item
+            :label="$t('chart.line_symbol_size')"
+            class="form-item form-item-slider"
+          >
+            <el-slider
+              v-model="sizeForm.lineSymbolSize"
+              show-input
+              :show-input-controls="false"
+              input-size="mini"
+              :min="0"
+              :max="20"
+              @change="changeBarSizeCase('lineSymbolSize')"
+            />
+          </el-form-item>
+          <el-form-item :label="$t('chart.line_smooth')" class="form-item">
+            <el-checkbox v-model="sizeForm.lineSmooth" @change="changeBarSizeCase('lineSmooth')">{{ $t('chart.line_smooth') }}
+            </el-checkbox>
+          </el-form-item>
+          <el-divider content-position="center" class="divider-style">{{ $t('chart.chart_scatter') }}</el-divider>
+          <el-form-item :label="$t('chart.bubble_symbol')" class="form-item">
+            <el-select
+              v-model="sizeForm.scatterSymbol"
+              :placeholder="$t('chart.line_symbol')"
+              @change="changeBarSizeCase('scatterSymbol')"
+            >
+              <el-option
+                v-for="item in lineSymbolOptions"
+                :key="item.value"
+                :label="item.name"
+                :value="item.value"
+              />
+            </el-select>
+          </el-form-item>
+          <el-form-item
+            :label="$t('chart.bubble_size')"
+            class="form-item form-item-slider"
+          >
+            <el-slider
+              v-model="sizeForm.scatterSymbolSize"
+              show-input
+              :show-input-controls="false"
+              input-size="mini"
+              :min="1"
+              :max="40"
+              @change="changeBarSizeCase('scatterSymbolSize')"
+            />
+          </el-form-item>
+        </span>
+        <!--chart-mix-end-->
       </el-form>
       <!--table-end-->