diff --git a/nezha-fronted/src/components/chart/chart.vue b/nezha-fronted/src/components/chart/chart.vue
index 7b8c2896f..0dcf7bcbf 100644
--- a/nezha-fronted/src/components/chart/chart.vue
+++ b/nezha-fronted/src/components/chart/chart.vue
@@ -92,6 +92,14 @@
         :is-fullscreen="isFullscreen"
         :chart-option="chartOption"
       ></chart-group>
+      <chartAutoCarousel
+        :ref="'chart' + chartInfo.id"
+        v-if="isAutoCarousel(chartInfo.type)"
+        :chart-data="chartData"
+        :chart-info="chartInfo"
+        :chart-option="chartOption"
+        :is-fullscreen="isFullscreen"
+      ></chartAutoCarousel>
     </template>
   </div>
 </template>
@@ -99,6 +107,7 @@
 <script>
 import loading from '@/components/common/loading'
 import chartAssetInfo from './chart/chartAssetInfo'
+import chartAutoCarousel from './chart/chartAutoCarousel'
 import chartBar from './chart/chartBar'
 import chartClock from './chart/chartClock'
 import chartDiagram from './chart/chartDiagram'
@@ -116,7 +125,7 @@ import chartTreemap from './chart/chartTreemap'
 import chartUrl from './chart/chartUrl'
 import chartValue from './chart/chartValue'
 import chartHexagon from './chart/chartHexagon'
-import { getOption, isTimeSeries, isHexagonFigure, isUrl, isText, isChartPie, isChartBar, isTreemap, isLog, isStat, isDiagram, isGroup } from './chart/tools'
+import { getOption, isTimeSeries, isHexagonFigure, isUrl, isText, isChartPie, isChartBar, isTreemap, isLog, isStat, isDiagram, isGroup, isAutoCarousel } from './chart/tools'
 import lodash from 'lodash'
 
 export default {
@@ -124,6 +133,7 @@ export default {
   components: {
     loading,
     chartAssetInfo,
+    chartAutoCarousel,
     chartBar,
     chartClock,
     chartDiagram,
@@ -174,7 +184,9 @@ export default {
     isStat,
     isDiagram,
     isGroup,
+    isAutoCarousel,
     resize () {
+      console.log(this.$refs['chart' + this.chartInfo.id])
       this.$refs['chart' + this.chartInfo.id].resize()
     }
   },
diff --git a/nezha-fronted/src/components/chart/chart/chartAutoCarousel.vue b/nezha-fronted/src/components/chart/chart/chartAutoCarousel.vue
new file mode 100644
index 000000000..034453d2d
--- /dev/null
+++ b/nezha-fronted/src/components/chart/chart/chartAutoCarousel.vue
@@ -0,0 +1,13 @@
+<template>
+
+</template>
+
+<script>
+export default {
+  name: 'chartAutoCarousel'
+}
+</script>
+
+<style scoped>
+
+</style>
diff --git a/nezha-fronted/src/components/chart/chart/tools.js b/nezha-fronted/src/components/chart/chart/tools.js
index 567fb4214..2891944ae 100644
--- a/nezha-fronted/src/components/chart/chart/tools.js
+++ b/nezha-fronted/src/components/chart/chart/tools.js
@@ -82,6 +82,9 @@ export function isDiagram (type) {
 export function isGroup (type) {
   return type === chartType.group
 }
+export function isAutoCarousel (type) {
+  return type === chartType.carousel
+}
 
 export function getGroupHeight (arr) {
   if (arr.length) {
diff --git a/nezha-fronted/src/components/chart/chartList.vue b/nezha-fronted/src/components/chart/chartList.vue
index 242324b41..2c588dd33 100644
--- a/nezha-fronted/src/components/chart/chartList.vue
+++ b/nezha-fronted/src/components/chart/chartList.vue
@@ -214,8 +214,8 @@ export default {
             i: item.id,
             w: item.span,
             h: item.height,
-            x: item.x || 0,
-            y: item.y || 0,
+            x: item.x || 1,
+            y: item.y || 1,
             param
           }
         })
diff --git a/nezha-fronted/src/components/chart/panelChart.vue b/nezha-fronted/src/components/chart/panelChart.vue
index 76c1b20c3..616d06eb3 100644
--- a/nezha-fronted/src/components/chart/panelChart.vue
+++ b/nezha-fronted/src/components/chart/panelChart.vue
@@ -145,6 +145,7 @@ export default {
             break
           }
           case 'misc': {
+            // this.chartInfo.type = 'carousel'
             if (this.chartInfo.type === 'hexagonFigure') {
               this.getHexagonFigureData().then(res => {
                 this.chartData = res
diff --git a/nezha-fronted/src/components/common/js/constants.js b/nezha-fronted/src/components/common/js/constants.js
index 03abd45bc..e94ec7450 100644
--- a/nezha-fronted/src/components/common/js/constants.js
+++ b/nezha-fronted/src/components/common/js/constants.js
@@ -405,7 +405,8 @@ export const chartType = {
   endpointInfo: 'endpointInfo',
   topology: 'topology',
   map: 'map',
-  hexagonFigure: 'hexagonFigure'
+  hexagonFigure: 'hexagonFigure',
+  carousel: 'carousel'
 }
 
 export const chartLegendPlacement = {