diff --git a/core/core-frontend/src/locales/zh-CN.ts b/core/core-frontend/src/locales/zh-CN.ts
index 32fb51656f..102d2f361b 100644
--- a/core/core-frontend/src/locales/zh-CN.ts
+++ b/core/core-frontend/src/locales/zh-CN.ts
@@ -1110,7 +1110,10 @@ export default {
     quadrant: '象限',
     font_size: '字号',
     word_size_range: '字号区间',
-    word_spacing: '文字间隔'
+    word_spacing: '文字间隔',
+    table_layout_mode: '展示形式',
+    table_layout_grid: '平铺展示',
+    table_layout_tree: '树形展示'
   },
   dataset: {
     scope_edit: '仅编辑时生效',
diff --git a/core/core-frontend/src/models/chart/chart-attr.d.ts b/core/core-frontend/src/models/chart/chart-attr.d.ts
index 369a4ba001..2b0c398ff1 100644
--- a/core/core-frontend/src/models/chart/chart-attr.d.ts
+++ b/core/core-frontend/src/models/chart/chart-attr.d.ts
@@ -96,6 +96,10 @@ declare interface ChartBasicStyle {
    * 表格分页大小
    */
   tablePageSize: number
+  /**
+   * 表格展示形式,平铺和树形
+   */
+  tableLayoutMode: 'grid' | 'tree'
   /**
    * 仪表盘样式
    */
diff --git a/core/core-frontend/src/views/chart/components/editor/editor-style/components/BasicStyleSelector.vue b/core/core-frontend/src/views/chart/components/editor/editor-style/components/BasicStyleSelector.vue
index 8b7ef91330..6a0f1e6780 100644
--- a/core/core-frontend/src/views/chart/components/editor/editor-style/components/BasicStyleSelector.vue
+++ b/core/core-frontend/src/views/chart/components/editor/editor-style/components/BasicStyleSelector.vue
@@ -198,6 +198,23 @@ onMounted(() => {
       </el-checkbox>
     </el-form-item>
 
+    <el-form-item
+      class="form-item"
+      v-if="showProperty('tableLayoutMode')"
+      :label="t('chart.table_layout_mode')"
+      :class="'form-item-' + themes"
+    >
+      <el-radio-group
+        size="small"
+        :effect="themes"
+        v-model="state.basicStyleForm.tableLayoutMode"
+        @change="changeBasicStyle('tableLayoutMode')"
+      >
+        <el-radio label="grid">{{ t('chart.table_layout_grid') }}</el-radio>
+        <el-radio label="tree">{{ t('chart.table_layout_tree') }}</el-radio>
+      </el-radio-group>
+    </el-form-item>
+
     <div class="alpha-setting" v-if="showProperty('alpha')">
       <label class="alpha-label" :class="{ dark: 'dark' === themes }">
         {{ t('chart.not_alpha') }}
diff --git a/core/core-frontend/src/views/chart/components/editor/util/chart.ts b/core/core-frontend/src/views/chart/components/editor/util/chart.ts
index d6719b9bd9..e24a02809a 100644
--- a/core/core-frontend/src/views/chart/components/editor/util/chart.ts
+++ b/core/core-frontend/src/views/chart/components/editor/util/chart.ts
@@ -1382,7 +1382,8 @@ export const DEFAULT_BASIC_STYLE: ChartBasicStyle = {
   innerRadius: 60,
   showZoom: true,
   zoomButtonColor: '#aaa',
-  zoomBackground: '#fff'
+  zoomBackground: '#fff',
+  tableLayoutMode: 'grid'
 }
 
 export const BASE_VIEW_CONFIG = {
diff --git a/core/core-frontend/src/views/chart/components/js/panel/charts/liquid/liquid.ts b/core/core-frontend/src/views/chart/components/js/panel/charts/liquid/liquid.ts
index c78493fd56..40de8d9e64 100644
--- a/core/core-frontend/src/views/chart/components/js/panel/charts/liquid/liquid.ts
+++ b/core/core-frontend/src/views/chart/components/js/panel/charts/liquid/liquid.ts
@@ -50,14 +50,15 @@ export class Liquid extends G2PlotChartView<LiquidOptions, G2Liquid> {
 
   drawChart(drawOptions: G2PlotDrawOptions<G2Liquid>): G2Liquid {
     const { chart, container } = drawOptions
-    if (chart?.data) {
-      const initOptions: LiquidOptions = {
-        percent: 0
-      }
-      const options = this.setupOptions(chart, initOptions)
-      // 开始渲染
-      return new G2Liquid(container, options)
+    if (!chart.data?.series) {
+      return
     }
+    const initOptions: LiquidOptions = {
+      percent: 0
+    }
+    const options = this.setupOptions(chart, initOptions)
+    // 开始渲染
+    return new G2Liquid(container, options)
   }
 
   protected configTheme(chart: Chart, options: LiquidOptions): LiquidOptions {
diff --git a/core/core-frontend/src/views/chart/components/js/panel/charts/others/gauge.ts b/core/core-frontend/src/views/chart/components/js/panel/charts/others/gauge.ts
index 1c51333171..d89051a874 100644
--- a/core/core-frontend/src/views/chart/components/js/panel/charts/others/gauge.ts
+++ b/core/core-frontend/src/views/chart/components/js/panel/charts/others/gauge.ts
@@ -65,40 +65,41 @@ export class Gauge extends G2PlotChartView<GaugeOptions, G2Gauge> {
 
   drawChart(drawOptions: G2PlotDrawOptions<G2Gauge>): G2Gauge {
     const { chart, container, scale } = drawOptions
-    if (chart?.data) {
-      // options
-      const initOptions: GaugeOptions = {
-        percent: 0,
-        appendPadding: getPadding(chart),
-        axis: {
-          tickInterval: 0.2,
-          label: {
-            style: {
-              fontSize: getScaleValue(12, scale) // 刻度值字体大小
-            },
-            formatter: function (v) {
-              const r = parseFloat(v)
-              return v === '0' || !r ? v : r * 100 + '%'
-            }
+    if (!chart.data?.series) {
+      return
+    }
+    // options
+    const initOptions: GaugeOptions = {
+      percent: 0,
+      appendPadding: getPadding(chart),
+      axis: {
+        tickInterval: 0.2,
+        label: {
+          style: {
+            fontSize: getScaleValue(12, scale) // 刻度值字体大小
           },
-          tickLine: {
-            length: getScaleValue(12, scale) * -1, // 刻度线长度
-            style: {
-              lineWidth: getScaleValue(1, scale) // 刻度线宽度
-            }
-          },
-          subTickLine: {
-            count: 4, // 子刻度数
-            length: getScaleValue(6, scale) * -1, // 子刻度线长度
-            style: {
-              lineWidth: getScaleValue(1, scale) // 子刻度线宽度
-            }
+          formatter: function (v) {
+            const r = parseFloat(v)
+            return v === '0' || !r ? v : r * 100 + '%'
+          }
+        },
+        tickLine: {
+          length: getScaleValue(12, scale) * -1, // 刻度线长度
+          style: {
+            lineWidth: getScaleValue(1, scale) // 刻度线宽度
+          }
+        },
+        subTickLine: {
+          count: 4, // 子刻度数
+          length: getScaleValue(6, scale) * -1, // 子刻度线长度
+          style: {
+            lineWidth: getScaleValue(1, scale) // 子刻度线宽度
           }
         }
       }
-      const options = this.setupOptions(chart, initOptions, scale)
-      return new G2Gauge(container, options)
     }
+    const options = this.setupOptions(chart, initOptions, scale)
+    return new G2Gauge(container, options)
   }
 
   protected configMisc(chart: Chart, options: GaugeOptions): GaugeOptions {
diff --git a/core/core-frontend/src/views/chart/components/js/panel/charts/table/table-pivot.ts b/core/core-frontend/src/views/chart/components/js/panel/charts/table/table-pivot.ts
index 74f6d9591e..a90a8d5f80 100644
--- a/core/core-frontend/src/views/chart/components/js/panel/charts/table/table-pivot.ts
+++ b/core/core-frontend/src/views/chart/components/js/panel/charts/table/table-pivot.ts
@@ -37,7 +37,13 @@ export class TablePivot extends S2ChartView<PivotSheet> {
       'showRowTooltip'
     ],
     'table-total-selector': ['row', 'col'],
-    'basic-style-selector': ['tableColumnMode', 'tableBorderColor', 'tableScrollBarColor', 'alpha']
+    'basic-style-selector': [
+      'tableColumnMode',
+      'tableBorderColor',
+      'tableScrollBarColor',
+      'alpha',
+      'tableLayoutMode'
+    ]
   }
   axis: AxisType[] = ['xAxis', 'xAxisExt', 'yAxis', 'filter']
   axisConfig: AxisConfig = {
@@ -104,7 +110,7 @@ export class TablePivot extends S2ChartView<PivotSheet> {
 
     // total config
     const customAttr = parseJson(chart.customAttr)
-    const { tableTotal } = customAttr
+    const { tableTotal, basicStyle } = customAttr
     tableTotal.row.subTotalsDimensions = r
     tableTotal.col.subTotalsDimensions = c
 
@@ -182,7 +188,8 @@ export class TablePivot extends S2ChartView<PivotSheet> {
       height: containerDom.offsetHeight,
       style: this.configStyle(chart),
       totals: tableTotal,
-      conditions: this.configConditions(chart)
+      conditions: this.configConditions(chart),
+      hierarchyType: basicStyle.tableLayoutMode ?? 'grid'
     }
 
     // 开始渲染
diff --git a/core/core-frontend/src/views/chart/components/views/components/ChartComponentS2.vue b/core/core-frontend/src/views/chart/components/views/components/ChartComponentS2.vue
index 308e580ea8..6928cb85ae 100644
--- a/core/core-frontend/src/views/chart/components/views/components/ChartComponentS2.vue
+++ b/core/core-frontend/src/views/chart/components/views/components/ChartComponentS2.vue
@@ -189,6 +189,7 @@ const initScroll = () => {
   const senior = actualChart.senior
   if (
     senior?.scrollCfg?.open &&
+    chartData.value.tableRow?.length &&
     (view.value.type === 'table-normal' || (view.value.type === 'table-info' && !state.showPage))
   ) {
     // 防止多次渲染