diff --git a/frontend/src/views/chart/chart/chart.js b/frontend/src/views/chart/chart/chart.js
index bd6f3c62b4..a2bf9a20e2 100644
--- a/frontend/src/views/chart/chart/chart.js
+++ b/frontend/src/views/chart/chart/chart.js
@@ -1021,6 +1021,7 @@ export const BASE_TREEMAP = {
     {
       // name: '',
       type: 'treemap',
+      roam: true,
       itemStyle: {
         gapWidth: 2
       },
diff --git a/frontend/src/views/chart/components/ChartComponent.vue b/frontend/src/views/chart/components/ChartComponent.vue
index fbabbf5240..e3f83c8a0e 100644
--- a/frontend/src/views/chart/components/ChartComponent.vue
+++ b/frontend/src/views/chart/components/ChartComponent.vue
@@ -128,6 +128,7 @@ export default {
       showSuspension: true,
       currentSeriesId: null,
       haveScrollType: [
+        'treemap',
         'map',
         'chart-mix',
         'bar',
@@ -198,7 +199,13 @@ export default {
       if (this.haveScrollType.includes(this.chart.type)) {
         const opt = this.myChart.getOption()
         this.adaptorOpt(opt)
-        this.myChart.setOption(opt)
+        if (this.chart.type === 'treemap') {
+          this.myChart.dispose()
+          this.myChart = null
+          this.preDraw()
+        } else {
+          this.myChart.setOption(opt)
+        }
       }
     },
     adaptorOpt(opt) {
@@ -218,6 +225,10 @@ export default {
           opt.geo.roam = this.active
         }
       }
+      //矩形树图
+      if (this.chart.type === 'treemap' && opt.series) {
+        opt.series[0].roam = this.active
+      }
     },
     changeSeriesId(param) {
       const { id, seriesId } = param