fix(图表): 优化圆形填充图的现实以及操作逻辑

core/core-frontend/src/views/chart/components/js/panel/charts/others/circle-packing.ts

@@ -55,47 +55,34 @@ export class CirclePacking extends G2PlotChartView<CirclePackingOptions, G2Circl
   axisConfig: AxisConfig = {
     xAxis: {
       name: `${t('chart.circle_packing_name')} / ${t('chart.dimension')}`,
-      type: 'd'
+      type: 'd',
+      limit: 1
     },
     yAxis: {
       name: `${t('chart.circle_packing_value')} / ${t('chart.quota')}`,
       type: 'q',
-      limit: 1,
+      limit: 1
-      allowEmpty: true
     }
   }
   async drawChart(drawOptions: G2PlotDrawOptions<G2CirclePacking>): Promise<G2CirclePacking> {
     const { chart, container, action } = drawOptions
-    if (chart?.data?.tableRow?.length) {
+    if (chart?.data?.data?.length) {
       // data
-      const data = chart.data.tableRow
+      const data = chart.data.data
-      const { xAxis, yAxis } = chart
+      const { xAxis, yAxis, drillFields } = chart
       const ySort = yAxis[0]?.sort ?? 'none'
       const sort = {
         sort: (a, b) =>
           ySort === 'asc' ? a.value - b.value : ySort === 'desc' ? b.value - a.value : 0
       }
-      // 根据配置获取节点的key，用于构建节点树，拖入字段顺序即为节点的层级
-      const nodeKeys = xAxis.map(item => item.dataeaseName)
       // 将数据转为圆形填充图数据格式
       const getCirclePackingData = () => {
         const result = [{ name: t('commons.all'), children: [] }]
-        const addNode = (nodes, item, level) => {
+        const addNode = (nodes, item) => {
-          if (level >= nodeKeys.length) return
+          const node = { ...item, name: item.name, children: [] }
-          const key = nodeKeys[level]
-          const value = item[key]
-          let node = nodes.find(n => n.name === value)
-          if (!node) {
-            node = { name: value, field: xAxis.find(f => f.dataeaseName === key), children: [] }
           nodes.push(node)
         }
-          if (level === nodeKeys.length - 1) {
+        data.forEach(item => addNode(result[0].children, item))
-            node.value = yAxis.length ? item[yAxis[0].dataeaseName] : 1
-          } else {
-            addNode(node.children, item, level + 1)
-          }
-        }
-        data.forEach(item => addNode(result[0].children, item, 0))
         return result[0]
       }
       // options
@@ -137,26 +124,20 @@ export class CirclePacking extends G2PlotChartView<CirclePackingOptions, G2Circl
       )
       const newChart = new G2CirclePacking(container, options)
       newChart.on('point:click', param => {
-        const data = param?.data?.data
+        const pointData = param?.data?.data
-        if (data?.name === t('commons.all')) {
+        if (pointData?.name === t('commons.all')) {
           return
         }
-        action({
+        const actionParams = {
           x: param.x,
           y: param.y,
           data: {
             data: {
-              ...data,
+              ...pointData
-              dimensionList: [
-                {
-                  id: data?.field?.id,
-                  value: data.name,
-                  name: data.name
-                }
-              ]
             }
           }
-        })
+        }
+        action(actionParams)
       })
       return newChart
     }

core/core-frontend/src/views/chart/components/views/components/ChartComponentG2Plot.vue

@@ -465,7 +465,7 @@ const trackClick = trackAction => {
     }
   }
   let quotaList = state.pointParam.data.quotaList
-  if (['bar-range', 'circle-packing'].includes(curView.type)) {
+  if (['bar-range'].includes(curView.type)) {
     quotaList = state.pointParam.data.dimensionList
   } else {
     quotaList[0]['value'] = state.pointParam.data.value

core/core-frontend/src/views/chart/components/views/index.vue

@@ -357,10 +357,7 @@ const chartClick = param => {
     ElMessage.error(t('chart.drill_field_error'))
     return
   }
-  if (
+  if (view.value.type === 'circle-packing' && param.data.name === t('commons.all')) {
-    view.value.type === 'circle-packing' &&
-    (param.data?.childNodeCount === 0 || param.data.name === t('commons.all'))
-  ) {
     ElMessage.error(t('chart.last_layer'))
     return
   }