diff --git a/content/en/docs/project-user-guide/custom-application-monitoring/visualization/panel.md b/content/en/docs/project-user-guide/custom-application-monitoring/visualization/panel.md
index fb874dfed..282221549 100644
--- a/content/en/docs/project-user-guide/custom-application-monitoring/visualization/panel.md
+++ b/content/en/docs/project-user-guide/custom-application-monitoring/visualization/panel.md
@@ -17,7 +17,7 @@ A text chart is preferable for displaying a single metric value. The editing win
 - **Decimal Places**: Accept an integer.
 - **Monitoring Metrics**: A list of available Prometheus metrics.
 
-![text-chart-1](/images/docs/project-user-guide/custom-application-monitoring/text-chart-1.jpg)
+![text-chart](/images/docs/project-user-guide/custom-application-monitoring/visualization/charts/text-chart.png)
 
 ## Graph
 
@@ -34,4 +34,4 @@ A graph is preferable for displaying multiple metric values. The editing window
 - **Unit**: The metric data unit.
 - **Decimal Places**: Accept an integer.
 
-![graph-chart](/images/docs/project-user-guide/custom-application-monitoring/graph-chart.jpg)
\ No newline at end of file
+![graph-chart](/images/docs/project-user-guide/custom-application-monitoring/visualization/charts/graph-chart.png)
\ No newline at end of file
diff --git a/content/zh/docs/project-user-guide/custom-application-monitoring/visualization/panel.md b/content/zh/docs/project-user-guide/custom-application-monitoring/visualization/panel.md
index 12c7cba89..b92e9dc0b 100644
--- a/content/zh/docs/project-user-guide/custom-application-monitoring/visualization/panel.md
+++ b/content/zh/docs/project-user-guide/custom-application-monitoring/visualization/panel.md
@@ -17,7 +17,7 @@ KubeSphere 当前支持两种图表：文本图表和图形图表。
 - **精确位**：支持整数。
 - **监控指标**：包含可用的 Prometheus 指标。
 
-![文本图表](/images/docs/zh-cn/project-user-guide/custom-application-monitoring/visualization/charts/文本图表.jpg)
+![文本图表](/images/docs/zh-cn/project-user-guide/custom-application-monitoring/visualization/charts/text-chart.png)
 
 ## 图形图表
 
@@ -34,4 +34,4 @@ KubeSphere 当前支持两种图表：文本图表和图形图表。
 - **单位**：指标数据的单位。
 - **精确位**：支持整数。
 
-![图形图表](/images/docs/zh-cn/project-user-guide/custom-application-monitoring/visualization/charts/图形图表.jpg)
\ No newline at end of file
+![图形图表](/images/docs/zh-cn/project-user-guide/custom-application-monitoring/visualization/charts/graph-chart.png)
\ No newline at end of file
diff --git a/static/images/docs/project-user-guide/custom-application-monitoring/graph-chart.jpg b/static/images/docs/project-user-guide/custom-application-monitoring/graph-chart.jpg
deleted file mode 100644
index dc8bf3d8e..000000000
Binary files a/static/images/docs/project-user-guide/custom-application-monitoring/graph-chart.jpg and /dev/null differ
diff --git a/static/images/docs/project-user-guide/custom-application-monitoring/text-chart-1.jpg b/static/images/docs/project-user-guide/custom-application-monitoring/text-chart-1.jpg
deleted file mode 100644
index 04cb04243..000000000
Binary files a/static/images/docs/project-user-guide/custom-application-monitoring/text-chart-1.jpg and /dev/null differ
diff --git a/static/images/docs/project-user-guide/custom-application-monitoring/visualization/charts/graph-chart.png b/static/images/docs/project-user-guide/custom-application-monitoring/visualization/charts/graph-chart.png
new file mode 100644
index 000000000..4047c36d0
Binary files /dev/null and b/static/images/docs/project-user-guide/custom-application-monitoring/visualization/charts/graph-chart.png differ
diff --git a/static/images/docs/project-user-guide/custom-application-monitoring/visualization/charts/text-chart.png b/static/images/docs/project-user-guide/custom-application-monitoring/visualization/charts/text-chart.png
new file mode 100644
index 000000000..03bcbe157
Binary files /dev/null and b/static/images/docs/project-user-guide/custom-application-monitoring/visualization/charts/text-chart.png differ
diff --git a/static/images/docs/zh-cn/project-user-guide/custom-application-monitoring/visualization/charts/graph-chart.png b/static/images/docs/zh-cn/project-user-guide/custom-application-monitoring/visualization/charts/graph-chart.png
new file mode 100644
index 000000000..f689f955b
Binary files /dev/null and b/static/images/docs/zh-cn/project-user-guide/custom-application-monitoring/visualization/charts/graph-chart.png differ
diff --git a/static/images/docs/zh-cn/project-user-guide/custom-application-monitoring/visualization/charts/text-chart.png b/static/images/docs/zh-cn/project-user-guide/custom-application-monitoring/visualization/charts/text-chart.png
new file mode 100644
index 000000000..b54db163a
Binary files /dev/null and b/static/images/docs/zh-cn/project-user-guide/custom-application-monitoring/visualization/charts/text-chart.png differ
diff --git a/static/images/docs/zh-cn/project-user-guide/custom-application-monitoring/visualization/charts/图形图表.jpg b/static/images/docs/zh-cn/project-user-guide/custom-application-monitoring/visualization/charts/图形图表.jpg
deleted file mode 100644
index 997cb59e1..000000000
Binary files a/static/images/docs/zh-cn/project-user-guide/custom-application-monitoring/visualization/charts/图形图表.jpg and /dev/null differ
diff --git a/static/images/docs/zh-cn/project-user-guide/custom-application-monitoring/visualization/charts/文本图表.jpg b/static/images/docs/zh-cn/project-user-guide/custom-application-monitoring/visualization/charts/文本图表.jpg
deleted file mode 100644
index ac2fc756a..000000000
Binary files a/static/images/docs/zh-cn/project-user-guide/custom-application-monitoring/visualization/charts/文本图表.jpg and /dev/null differ