feat: 🎸 update visualizations grid

hungtcs · hungtcs · commit 7ddcd30bb408 · 2024-12-19T11:06:00.000+08:00
diff --git a/docs/04_visualizations/5-1-marker-map/index.md b/docs/04_visualizations/5-1-marker-map/index.md
@@ -1,10 +1,9 @@
 ---
-title: 地理位置坐标图
+title: 图钉地图
 sidebar_position: 5.1
 ---
 
-地理位置坐标图是一种用于显示地理位置坐标的图表类型，通常用于标记地球表面上特定地点的经纬度坐标。
-这种图表可以用于显示地理位置的分布、点位标记或者路径追踪等用途。
+图钉地图是一种在地图上以图钉或标记点形式显示数据的地图。每个标记点代表地图上的一个具体位置，通常用来显示单个地点的详细信息或事件发生的位置。
 
 地理位置坐标图通常包含以下要素：
 
@@ -16,7 +15,6 @@ sidebar_position: 5.1
 
 图钉地图支持根据精确经纬度坐标，显示具体标记地图位置。
 
-
 ```py
 # 东盟十国坐标
 data = {
diff --git a/docs/04_visualizations/5-1-marker-map/pinmap.png b/docs/04_visualizations/5-1-marker-map/pinmap.png
diff --git a/docs/04_visualizations/5-2-choropleth-map/geoplot.png b/docs/04_visualizations/5-2-choropleth-map/geoplot.png
diff --git a/docs/04_visualizations/5-2-choropleth-map/index.md b/docs/04_visualizations/5-2-choropleth-map/index.md
@@ -3,8 +3,7 @@ title: 地理位置图
 sidebar_position: 5.2
 ---
 
-
-地理位置图（Geographical Plot）是一种将地理数据可视化的图表类型，通过在地图上展示不同区域的数值或属性信息，帮助观察者更直观地了解地理分布与区域特征。
+区域地图是通过不同的颜色或阴影来表示特定区域的数值数据。它通常用于展示地理区域（如国家、省份、城市等）内的某些数据分布，比如人口密度、收入水平、污染指数等。
 
 这种图表通常将不同的地理区域（如国家、省份、城市等）与相关数据（如人口、销售额、气温等）结合，能够有效展示区域之间的差异与趋势。
 
@@ -13,6 +12,7 @@ sidebar_position: 5.2
 1. **地图字段**：选择地图的类型或基础地图，决定数据展示的地理区域。
 2. **区域名称字段**：选择数据集中对应区域名称的字段，用于将数据与具体的地理位置进行映射。
 3. **数值字段**：选择用于显示具体区域属性或数值的字段，如人口数量、气温、销售量等。
+
 ### 数据示例
 
 ```py
@@ -25,7 +25,6 @@ select * from "upload_yanshi_population"
 
 1. **地图设置**：设置指标名称和标签是否显示。
 
-
 ### 图例
 
 ![地理位置图](./geoplot.png)
diff --git a/docs/04_visualizations/_assets/icons/donuts.svg b/docs/04_visualizations/_assets/icons/donuts.svg
@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 24.0.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 50 50" style="enable-background:new 0 0 50 50;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:#D3DFFF;}
+	.st1{fill:#2B4ABD;}
+	.st2{fill:#42C6EC;}
+</style>
+<g>
+	<path class="st0" d="M25,1.5C12,1.5,1.5,12,1.5,25C1.5,38,12,48.5,25,48.5S48.5,38,48.5,25C48.5,12,38,1.5,25,1.5z M25,37.7
+		c-7,0-12.7-5.7-12.7-12.7S18,12.3,25,12.3S37.7,18,37.7,25S32,37.7,25,37.7z"/>
+	<path class="st1" d="M25,1.5v10.8c7,0,12.7,5.7,12.7,12.7c0,2.5-0.7,4.8-2,6.8l8.9,5.6l0.3,0.2c2.3-3.6,3.7-8,3.7-12.6
+		C48.5,12,38,1.5,25,1.5z"/>
+	<path class="st2" d="M35.7,31.8c-2.3,3.5-6.2,5.9-10.7,5.9c-4.5,0-8.5-2.4-10.8-6l-9.1,5.7c4.2,6.6,11.5,11,19.9,11
+		c8.3,0,15.7-4.4,19.8-10.9L35.7,31.8z"/>
+</g>
+</svg>
diff --git a/docs/04_visualizations/_assets/icons/echarts-map.svg b/docs/04_visualizations/_assets/icons/echarts-map.svg
@@ -0,0 +1,63 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 24.0.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
+  y="0px" viewBox="0 0 50 50" style="enable-background:new 0 0 50 50;" xml:space="preserve">
+  <style type="text/css">
+    .st0 {
+      fill: #2B4ABD;
+    }
+
+    .st1 {
+      fill: #D3DFFF;
+    }
+
+    .st2 {
+      fill: #42C6EC;
+    }
+  </style>
+  <g>
+    <polygon class="st0" points="0.8,18.9 0.8,18.5 1.3,17.9 0.1,16.6 0,15.3 1,15.3 0.3,14.6 0.5,14.3 1.1,13.7 3.2,13.6 3.6,14.2
+		6.6,14.1 7.5,14.9 9.4,14.9 10,14.4 12.1,14.3 12.1,15.4 10.3,17.2 11.8,18.7 11.8,19.3 12.2,19.6 12.7,19.5 12.7,16.6 13.3,16.6
+		13.8,17.1 13.9,17.8 14.6,17.7 15.7,18.8 15.7,19.8 14.4,19.8 14.4,20.4 12.9,22 12.9,22.5 12,23.5 12.4,23.9 12.1,24 11.5,23.4
+		10.5,23.4 9.8,24.1 9.9,25.1 11.1,25.1 12.9,26.8 13.4,26.3 14.7,26.3 15.5,27.1 16,27.1 17.2,28.1 18.1,28.2 18.6,28.6 18.6,29.2
+		18.1,29.7 18.2,30.7 14.4,34.3 14.4,35.4 13.9,35.9 14,36.5 14.3,37 14.3,37.2 14,37.2 13.1,36.3 13.1,33.2 13.7,32.8 13.7,30.5
+		12.1,29 12.2,27.6 12.5,27.3 11,25.8 9.5,25.9 8.7,25.1 8.7,24.3 8.1,24.4 6.1,22.5 6.1,20.3 5.6,19.8 5.7,19 3.9,17.3 2.3,17.2
+		" />
+    <polygon class="st1" points="23.5,19.5 23.5,18.9 23.1,18.5 23.1,17.8 22.2,18.8 22.2,19.4 22.7,19.4 22.7,18.6 23,18.9 23,19.5
+		" />
+    <polygon class="st1" points="29.9,31.7 30.2,31.4 30.2,30.8 30.4,30.6 30.5,29.6 29.6,30.4 29.6,31.4 	" />
+    <polygon class="st1" points="36.8,27.2 37.2,27.2 37.8,27.9 38,27.9 38.4,28.2 38.4,28.7 38.6,28.7 38.9,29 39.5,28.9 39.6,29.1
+		38.4,29.1 37.5,28.2 37.5,28 	" />
+    <polygon class="st1" points="38.8,27.6 38.8,28.1 39.1,28.4 39.5,28.4 40,27.9 40,27.1 39.9,26.9 39.2,27.6 	" />
+    <polygon class="st1" points="40,29 40,29.2 40.2,29.2 40.3,29.3 40.4,29.2 40.4,29.2 40.7,29.1 40.7,29 	" />
+    <polygon class="st1" points="40.6,28.5 40.4,28.5 40.2,28.4 40.2,28.1 40.4,27.9 40.5,27.8 40.9,27.8 40.8,27.9 40.5,27.9
+		40.5,28.2 40.6,28.3 	" />
+    <polygon class="st1" points="41.2,28.3 41.7,28.3 41.7,28.4 41.3,28.5 	" />
+    <polygon class="st1" points="41.9,28 41.9,28.2 42.2,28.5 42.5,28.5 43.2,29.2 43.5,29.2 43.8,29 44.1,29.4 44.6,29.4 44,28.8
+		44,28.7 43.6,28.2 42.7,28.2 42.6,28.3 42.3,28.3 42.3,28 	" />
+    <polygon class="st1" points="39.5,30.8 39.5,33.2 40.6,33.2 41.1,32.7 42.4,32.6 43.4,33.8 44.1,33.7 44.9,33 44.9,31.3 43.1,29.5
+		43.2,30.4 42.6,29.8 41.1,29.8 40.1,30.9 	" />
+    <polygon class="st1" points="43.8,34.2 43.8,34.6 44,34.6 44.2,34.4 44.2,34.2 	" />
+    <polygon class="st1" points="47.9,34.2 47.7,34.2 46.8,35.1 46.7,35.2 47.2,35.2 48.6,33.9 48.5,33.5 48.3,33.5 47.7,32.9
+		47.6,33.2 47.9,33.5 	" />
+    <polygon class="st1" points="40.6,24.2 40.4,24.5 40.4,24.7 40.6,24.7 40.6,24.5 40.7,24.4 	" />
+    <polygon class="st1" points="40.4,25.3 40.4,26.2 40.6,26 40.7,26 41,26.3 41.2,26.3 40.7,25.8 40.7,25.3 	" />
+    <polygon class="st1" points="40.7,26.3 40.5,26.5 40.7,26.6 40.7,26.7 40.6,26.8 40.7,26.8 41,27.1 41.1,27 41.1,26.6 41,26.8
+		40.8,26.7 40.8,26.5 	" />
+    <polygon class="st1" points="11.8,24.6 11.8,24.8 12.3,24.7 12.6,25.1 13,25.1 13.1,24.9 12.7,24.9 12.4,24.6 	" />
+    <polygon class="st1" points="13.2,25.3 13.4,25.1 13.7,25.1 13.8,25.2 	" />
+    <polygon class="st2" points="48.7,14.1 45.8,14.1 45.3,13.6 44.8,13.5 44,12.8 33.7,12.8 31.9,14.7 30.5,14.6 29.9,15.3 29.5,15.3
+		28.3,14.1 26.4,14.1 25.3,15.2 25.3,16 24.5,16.7 24.4,17.6 25.2,18.3 26,17.5 26,16.3 26.7,15.6 26.7,18.1 25.8,19 24.5,18.9
+		23.3,20.1 23.3,21.2 22.2,21.2 22.2,22.3 23.1,22.3 24.2,21.2 25,21.2 25.7,21.8 26.1,21.8 25.3,21 25.6,20.7 26.8,21.8 27.5,21.2
+		27.5,20.5 28.7,20.5 29.3,21.2 29.3,21.6 28.2,21.5 27.3,22.5 28.5,22.5 28.5,23.3 28.5,23.7 29.1,24.2 29.1,24.9 29.8,25.7
+		31.1,25.6 31.7,25 31.7,24.5 31,24.5 30.2,23.7 30.4,23.4 31.2,24 32.7,24 33.8,25.2 33.7,25.9 34.8,26.9 34.8,25.7 35.8,24.7
+		36.3,24.7 37.3,25.7 37.2,26.9 37.9,27.5 38.3,27.5 37.6,26.8 37.6,26.1 38.2,26.7 38.8,26.1 38.8,25.7 38.3,25.2 38.7,24.8
+		39.5,24.8 40.5,23.7 40.5,23.1 40.1,22.7 40.1,22 40.4,21.7 41.4,22.6 41.6,22.4 41.6,21.5 43.3,19.8 43.4,20.9 43.2,21.1
+		43.2,21.9 42.6,22.6 42.1,22.5 41.7,23 41.6,23.5 42.4,22.9 42.9,22.9 43.5,22.3 43.5,21.5 43.7,21.3 43.7,19.7 42.5,18.5
+		43.5,17.5 45,17.6 45.8,16.8 46.6,16.7 45.3,18.1 45.3,19.4 45.6,19.4 46.3,18.8 46.3,17.7 46.8,17.1 47.5,17.1 48.4,16.3
+		48.4,15.7 49.6,15.7 50,15.4 	" />
+    <polygon class="st1" points="30.6,26.2 29.5,26.3 28.6,25.3 28.6,24.4 28.1,24 28.4,23.7 28.5,23.7 28.5,23.3 25.4,23.3 24.6,22.4
+		23.6,22.4 23.4,22.7 22.7,22.7 21.1,24.3 21.1,26.1 22.2,27.2 24.4,27.2 24.9,27.7 25,28.3 25.4,28.7 25.4,31.4 25.9,31.9
+		25.9,33.1 27.1,33.1 28.5,31.7 28.5,30.5 29.1,29.9 29.1,28.3 30.7,26.8 	" />
+  </g>
+</svg>
diff --git a/docs/04_visualizations/_assets/icons/live-trading-replay.svg b/docs/04_visualizations/_assets/icons/live-trading-replay.svg
@@ -0,0 +1,23 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 24.0.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
+  y="0px" viewBox="0 0 50 50" style="enable-background:new 0 0 50 50;" xml:space="preserve">
+  <style type="text/css">
+    .st0 {
+      fill: #42C6EC;
+    }
+
+    .st1 {
+      fill: #D3DFFF;
+    }
+
+    .st2 {
+      fill: #2B4ABD;
+    }
+  </style>
+  <g>
+    <rect x="0.3" y="5" class="st0" width="49.4" height="18.5" />
+    <rect x="0.3" y="25.6" class="st1" width="23.6" height="19.4" />
+    <rect x="26" y="25.6" class="st2" width="23.6" height="19.4" />
+  </g>
+</svg>
diff --git a/docs/04_visualizations/_assets/icons/radar.svg b/docs/04_visualizations/_assets/icons/radar.svg
@@ -0,0 +1,36 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 24.0.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 77 77" style="enable-background:new 0 0 77 77;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:#D1DBEF;}
+	.st1{fill:#C3CFEA;}
+	.st2{opacity:0.9;fill:#48BBDE;}
+	.st3{opacity:0.9;fill:#2D4B9E;}
+</style>
+<g>
+	<g>
+		<path class="st0" d="M38.5,77C17.3,77,0,59.7,0,38.5S17.3,0,38.5,0C59.7,0,77,17.3,77,38.5S59.7,77,38.5,77z M38.5,1.8
+			C18.3,1.8,1.8,18.3,1.8,38.5c0,20.2,16.5,36.7,36.7,36.7s36.7-16.5,36.7-36.7C75.2,18.3,58.7,1.8,38.5,1.8z"/>
+		<path class="st1" d="M38.5,68.5c-16.6,0-30-13.5-30-30s13.5-30,30-30s30.1,13.5,30.1,30S55.1,68.5,38.5,68.5z M38.5,9.3
+			C22.4,9.3,9.3,22.4,9.3,38.5s13.1,29.1,29.1,29.1s29.2-13.1,29.2-29.1S54.6,9.3,38.5,9.3z"/>
+		<path class="st1" d="M38.5,61.3c-12.6,0-22.8-10.3-22.8-22.8s10.3-22.8,22.8-22.8s22.9,10.3,22.9,22.8S51.1,61.3,38.5,61.3z
+			 M38.5,16.5c-12.1,0-21.9,9.8-21.9,21.9s9.8,21.9,21.9,21.9c12.1,0,22-9.8,22-21.9S50.6,16.5,38.5,16.5z"/>
+		<path class="st1" d="M38.5,55c-9.1,0-16.4-7.4-16.4-16.5c0-9.1,7.4-16.4,16.4-16.4c9.1,0,16.5,7.4,16.5,16.4
+			C54.9,47.6,47.6,55,38.5,55z M38.5,22.9c-8.6,0-15.5,7-15.5,15.5c0,8.6,7,15.6,15.5,15.6S54,47.1,54,38.5
+			C54,29.9,47.1,22.9,38.5,22.9z"/>
+		<path class="st1" d="M38.5,47.8c-5.1,0-9.2-4.1-9.2-9.3c0-5.1,4.1-9.2,9.2-9.2s9.3,4.1,9.3,9.2C47.7,43.6,43.6,47.8,38.5,47.8z
+			 M38.5,30.1c-4.6,0-8.3,3.7-8.3,8.3c0,4.6,3.7,8.4,8.3,8.4s8.4-3.7,8.4-8.4C46.8,33.9,43.1,30.1,38.5,30.1z"/>
+		<rect x="38" y="0.9" class="st1" width="0.9" height="37.6"/>
+		
+			<rect x="20.9" y="13.5" transform="matrix(0.309 -0.9511 0.9511 0.309 -15.9647 42.6295)" class="st1" width="0.9" height="37.6"/>
+		
+			<rect x="9.2" y="52.1" transform="matrix(0.5881 -0.8088 0.8088 0.5881 -30.9126 44.3085)" class="st1" width="37.6" height="0.9"/>
+		
+			<rect x="48.9" y="33.6" transform="matrix(0.809 -0.5878 0.5878 0.809 -21.3712 38.9928)" class="st1" width="0.9" height="37.6"/>
+		<rect x="37" y="31.7" transform="matrix(0.9512 -0.3086 0.3086 0.9512 -7.187 18.7821)" class="st1" width="37.6" height="0.9"/>
+	</g>
+	<polygon class="st2" points="8.2,28.2 24,55.8 58.2,65 53.8,31.8 39.1,7.3 	"/>
+	<polygon class="st3" points="38.2,10.8 13.8,29.4 29,49.8 50.2,53.8 67,28.6 	"/>
+</g>
+</svg>
diff --git a/docs/04_visualizations/_assets/icons/rose.svg b/docs/04_visualizations/_assets/icons/rose.svg
@@ -0,0 +1,28 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 24.0.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
+  y="0px" viewBox="0 0 50 50" style="enable-background:new 0 0 50 50;" xml:space="preserve">
+  <style type="text/css">
+    .st0 {
+      fill: #6B79FE;
+    }
+
+    .st1 {
+      fill: #D3DFFF;
+    }
+
+    .st2 {
+      fill: #2B4ABD;
+    }
+
+    .st3 {
+      fill: #42C6EC;
+    }
+  </style>
+  <g>
+    <circle class="st0" cx="22.5" cy="26.6" r="16" />
+    <path class="st1" d="M22.5,26.6l-5-18.7C9.2,10.1,3.1,17.7,3.1,26.6c0,2.8,0.6,5.6,1.7,8L22.5,26.6z" />
+    <path class="st2" d="M22.5,26.6l-21,8.7c3.4,8.2,11.5,14,21,14c6.3,0,12-2.6,16.2-6.8L22.5,26.6z" />
+    <path class="st3" d="M22.5,26.6l18.7,18.1c4.5-4.7,7.3-11.1,7.3-18.1c0-13.4-10.2-24.5-23.2-25.9L22.5,26.6z" />
+  </g>
+</svg>
diff --git a/docs/04_visualizations/_components/visualizations-grid.tsx b/docs/04_visualizations/_components/visualizations-grid.tsx
@@ -2,16 +2,21 @@ import Link from "@docusaurus/Link";
 import AreaIcon from "../_assets/icons/area.svg";
 import BarIcon from "../_assets/icons/bar.svg";
 import CalendarIcon from "../_assets/icons/calendar.svg";
+import DonutsIcon from "../_assets/icons/donuts.svg";
+import EChartsMapIcon from "../_assets/icons/echarts-map.svg";
 import FunnelIcon from "../_assets/icons/funnel.svg";
 import GaugeIcon from "../_assets/icons/gauge.svg";
 import HeatmapIcon from "../_assets/icons/heatmap.svg";
 import KlinechartsIcon from "../_assets/icons/klinecharts.svg";
 import LineIcon from "../_assets/icons/line.svg";
+import LiveTradingReplayIcon from "../_assets/icons/live-trading-replay.svg";
 import MapIcon from "../_assets/icons/map.svg";
 import MarkdownIcon from "../_assets/icons/markdown.svg";
 import NumberIcon from "../_assets/icons/number.svg";
 import PieIcon from "../_assets/icons/pie.svg";
+import RadarIcon from "../_assets/icons/radar.svg";
 import RelationIcon from "../_assets/icons/relation.svg";
+import RoseIcon from "../_assets/icons/rose.svg";
 import RowIcon from "../_assets/icons/row.svg";
 import SankeyIcon from "../_assets/icons/sankey.svg";
 import ScatterIcon from "../_assets/icons/scatter.svg";
@@ -66,6 +71,20 @@ const visualizations = [
     icon: PieIcon,
     description: "饼图（Pie Chart）是一种常见的数据可视化图表类型，用于展示各个部分占总体的比例关系。",
   },
+  {
+    id: "3-3-donuts",
+    name: "甜甜圈",
+    icon: DonutsIcon,
+    description:
+      "甜甜圈图的结构与扇形图相似，但空心中心使得它更加美观且适合显示多个层次的信息，常用于展示组成部分的占比。",
+  },
+  {
+    id: "2-5-1-rose",
+    name: "玫瑰图",
+    icon: RoseIcon,
+    description:
+      "玫瑰图用于显示一组数据中各个方向的频率或强度，广泛应用于气象、航海、地质学等领域，特别是在显示风速和风向的分布情况时。",
+  },
   {
     id: "2-6-calendar",
     name: "日历图",
@@ -115,6 +134,12 @@ const visualizations = [
     icon: SunburstIcon,
     description: "旭日图（Sunburst Chart）是一种用于展示层次数据结构的环形图表类型。",
   },
+  {
+    id: "3-2-radar",
+    name: "雷达图",
+    icon: RadarIcon,
+    description: "雷达图（Radar Chart）是一种用于展示多维数据的图表类型，通常用于比较不同维度的数据差异。",
+  },
   {
     id: "3-1-klinecharts",
     name: "K 线图",
@@ -130,17 +155,30 @@ const visualizations = [
       "关系图（Network Graph）是一种用于可视化网络结构的图表类型，通常用于展示节点（或顶点）之间的关系和连接。",
   },
   {
-    id: "5-1-map",
-    name: "地理位置坐标",
+    id: "5-1-marker-map",
+    name: "图钉地图",
     icon: MapIcon,
     description: "地理位置坐标图是一种用于显示地理位置坐标的图表类型，通常用于标记地球表面上特定地点的经纬度坐标。",
   },
+  {
+    id: "5-2-choropleth-map",
+    name: "区域地图",
+    icon: EChartsMapIcon,
+    description:
+      "区域地图是通过不同的颜色或阴影来表示特定区域的数值数据。它通常用于展示地理区域（如国家、省份、城市等）内的某些数据分布，比如人口密度、收入水平、污染指数等。",
+  },
   {
     id: "6-1-markdown",
     name: "Markdown",
     icon: MarkdownIcon,
     description: "Markdown 是一种轻量级标记语言，通常用于撰写文档、笔记、博客文章等。",
   },
+  {
+    id: "6-2-tick",
+    name: "实盘回放",
+    icon: LiveTradingReplayIcon,
+    description: "实盘回放是一种用于展示交易数据和市场动态的图表类型，通常用于分析和研究历史交易数据。",
+  },
 ];
 
 export default function VisualizationsGrid() {
diff --git a/docs/index.mdx b/docs/index.mdx
@@ -5,4 +5,4 @@ sidebar_class_name: hidden
 import { Redirect } from "@docusaurus/router";
 import useBaseUrl from "@docusaurus/useBaseUrl";
 
-<Redirect to={ useBaseUrl("/docs/get-started/welcome") } />
+<Redirect to={ useBaseUrl("/docs/introduce") } />
