diff --git a/web/src/locales/en-US.js b/web/src/locales/en-US.js
index 0d57fa00..c52de030 100644
--- a/web/src/locales/en-US.js
+++ b/web/src/locales/en-US.js
@@ -215,7 +215,7 @@ export default {
   "dashboard.charts.title.cluster_documents.axis.count": "Documents Count",
   "dashboard.charts.title.cluster_documents.axis.deleted": "Docmuents Deleted",
   "dashboard.charts.title.cluster_indices.axis.count": "Indices Count",
-  "dashboard.charts.title.cluster_documents.axis.counts": "Shards Count",
+  "dashboard.charts.title.shard_count.axis.counts": "Shards Count",
   "dashboard.charts.title.node_count.axis.count": "Nodes Count",
   "dashboard.charts.title.cluster_health.axis.percent": "Health Percent",
 
diff --git a/web/src/locales/en-US/cluster.js b/web/src/locales/en-US/cluster.js
index 6ae7cd00..1f1a8268 100644
--- a/web/src/locales/en-US/cluster.js
+++ b/web/src/locales/en-US/cluster.js
@@ -61,6 +61,8 @@ export default {
 
   "cluster.metrics.node.axis.cpu.title": "Process CPU Usage",
   "cluster.metrics.node.axis.disk.title": "Disk Available",
+  "cluster.metrics.node.axis.open_file.title": "Open File",
+  "cluster.metrics.node.axis.open_file_percent.title": "Open File Percent",
   "cluster.metrics.node.axis.indexing_rate.title": "Indexing Rate",
   "cluster.metrics.node.axis.query_rate.title": "Query Rate",
   "cluster.metrics.node.axis.fetch_rate.title": "Fetch Rate",
@@ -73,6 +75,7 @@ export default {
   "cluster.metrics.node.axis.flush_latency.title": "Flush Latency",
   "cluster.metrics.node.axis.query_cache.title": "Query Cache",
   "cluster.metrics.node.axis.request_cache.title": "Request Cache",
+  "cluster.metrics.node.axis.fielddata_cache.title": "Fielddata Cache",
   "cluster.metrics.node.axis.http_connect_num.title": "Http Connections",
   "cluster.metrics.node.axis.http_rate.title": "Rate Of Opened Connections",
   "cluster.metrics.node.axis.segment_memory.title": "Segment Memory",
@@ -82,11 +85,24 @@ export default {
   "cluster.metrics.node.axis.jvm_heap_used_percent.title": "JVM Heap Usage",
   "cluster.metrics.node.axis.os_cpu.title": "OS CPU Usage",
   "cluster.metrics.node.axis.os_used_mem.title": "OS Mem Usage",
+  "cluster.metrics.node.axis.os_used_swap.title": "OS Swap Usage",
   "cluster.metrics.node.axis.indexing_pressure_memory.title":
     "Indexing Pressure",
   "cluster.metrics.node.axis.jvm_used_heap.title": "JVM Used Heap",
   "cluster.metrics.node.axis.jvm_young_gc_rate.title": "Young GC Rate",
   "cluster.metrics.node.axis.jvm_young_gc_latency.title": "Young GC Latency",
+  "cluster.metrics.node.axis.jvm_mem_young_used.title": "Pools Young Used",
+  "cluster.metrics.node.axis.jvm_mem_young_peak_used.title":
+    "Pools Young Peak Used",
+  "cluster.metrics.node.axis.jvm_mem_old_used.title": "Pools Old Used",
+  "cluster.metrics.node.axis.jvm_mem_old_peak_used.title":
+    "Pools Old Peak Used",
+  "cluster.metrics.node.axis.jvm_old_gc_rate.title": "Old GC Rate",
+  "cluster.metrics.node.axis.jvm_old_gc_latency.title": "Old GC Latency",
+  "cluster.metrics.node.axis.transport_tx_rate.title": "Transport TX Rate",
+  "cluster.metrics.node.axis.transport_rx_rate.title": "Transport RX Rate",
+  "cluster.metrics.node.axis.transport_tx_bytes.title": "Transport TX Bytes",
+  "cluster.metrics.node.axis.transport_rx_bytes.title": "Transport RX Bytes",
 
   "cluster.metrics.index.axis.index_storage.title": "Index Storage",
   "cluster.metrics.index.axis.doc_count.title": "Document count",
@@ -117,4 +133,5 @@ export default {
   "cluster.metrics.group.memory": "Memory",
   "cluster.metrics.group.cache": "Cache",
   "cluster.metrics.group.JVM": "JVM",
+  "cluster.metrics.group.transport": "Transport",
 };
diff --git a/web/src/locales/zh-CN.js b/web/src/locales/zh-CN.js
index ac7879e5..590b593e 100644
--- a/web/src/locales/zh-CN.js
+++ b/web/src/locales/zh-CN.js
@@ -221,7 +221,7 @@ export default {
   "dashboard.charts.title.cluster_documents.axis.count": "文档总数",
   "dashboard.charts.title.cluster_documents.axis.deleted": "文档删除数",
   "dashboard.charts.title.cluster_indices.axis.count": "索引总数",
-  "dashboard.charts.title.cluster_documents.axis.counts": "分片总数",
+  "dashboard.charts.title.shard_count.axis.counts": "分片数",
 
   "app.login.message-invalid-credentials": "账户或密码错误（admin/888888）",
   "app.login.message-invalid-verification-code": "验证码错误",
diff --git a/web/src/locales/zh-CN/cluster.js b/web/src/locales/zh-CN/cluster.js
index 7b810924..2c6264d4 100644
--- a/web/src/locales/zh-CN/cluster.js
+++ b/web/src/locales/zh-CN/cluster.js
@@ -61,6 +61,8 @@ export default {
 
   "cluster.metrics.node.axis.cpu.title": "Process CPU Usage",
   "cluster.metrics.node.axis.disk.title": "Disk Available",
+  "cluster.metrics.node.axis.open_file.title": "Open File",
+  "cluster.metrics.node.axis.open_file_percent.title": "Open File Percent",
   "cluster.metrics.node.axis.indexing_rate.title": "Indexing Rate",
   "cluster.metrics.node.axis.query_rate.title": "Query Rate",
   "cluster.metrics.node.axis.fetch_rate.title": "Fetch Rate",
@@ -73,6 +75,7 @@ export default {
   "cluster.metrics.node.axis.flush_latency.title": "Flush Latency",
   "cluster.metrics.node.axis.query_cache.title": "Query Cache",
   "cluster.metrics.node.axis.request_cache.title": "Request Cache",
+  "cluster.metrics.node.axis.fielddata_cache.title": "Fielddata Cache",
   "cluster.metrics.node.axis.http_connect_num.title": "Http Connections",
   "cluster.metrics.node.axis.http_rate.title": "Rate Of Opened Connections",
   "cluster.metrics.node.axis.segment_memory.title": "Segment Memory",
@@ -82,6 +85,7 @@ export default {
   "cluster.metrics.node.axis.jvm_heap_used_percent.title": "JVM Heap Usage",
   "cluster.metrics.node.axis.os_cpu.title": "OS CPU Usage",
   "cluster.metrics.node.axis.os_used_mem.title": "OS Mem Usage",
+  "cluster.metrics.node.axis.os_used_swap.title": "OS Swap Usage",
   "cluster.metrics.node.axis.indexing_pressure_memory.title":
     "Indexing Pressure",
   "cluster.metrics.node.axis.jvm_used_heap.title": "JVM Used Heap",
@@ -90,6 +94,15 @@ export default {
   "cluster.metrics.node.axis.jvm_mem_young_used.title": "Pools Young Used",
   "cluster.metrics.node.axis.jvm_mem_young_peak_used.title":
     "Pools Young Peak Used",
+  "cluster.metrics.node.axis.jvm_old_gc_rate.title": "Old GC Rate",
+  "cluster.metrics.node.axis.jvm_old_gc_latency.title": "Old GC Latency",
+  "cluster.metrics.node.axis.jvm_mem_old_used.title": "Pools Old Used",
+  "cluster.metrics.node.axis.jvm_mem_old_peak_used.title":
+    "Pools Old Peak Used",
+  "cluster.metrics.node.axis.transport_tx_rate.title": "Transport TX Rate",
+  "cluster.metrics.node.axis.transport_rx_rate.title": "Transport RX Rate",
+  "cluster.metrics.node.axis.transport_tx_bytes.title": "Transport TX Bytes",
+  "cluster.metrics.node.axis.transport_rx_bytes.title": "Transport RX Bytes",
 
   "cluster.metrics.index.axis.index_storage.title": "Index Storage",
   "cluster.metrics.index.axis.doc_count.title": "Document count",
@@ -120,4 +133,5 @@ export default {
   "cluster.metrics.group.memory": "Memory",
   "cluster.metrics.group.cache": "Cache",
   "cluster.metrics.group.JVM": "JVM",
+  "cluster.metrics.group.transport": "Transport",
 };
diff --git a/web/src/pages/Cluster/components/cluster_metric.jsx b/web/src/pages/Cluster/components/cluster_metric.jsx
index 5c08152c..c399012e 100644
--- a/web/src/pages/Cluster/components/cluster_metric.jsx
+++ b/web/src/pages/Cluster/components/cluster_metric.jsx
@@ -40,7 +40,11 @@ export default ({ clusterID, timezone, timeRange, handleTimeChange }) => {
     },
     [clusterID, queryParams]
   );
-  const { metrics = {} } = value || {};
+
+  const metrics = React.useMemo(() => {
+    const { metrics = {} } = value || {};
+    return Object.values(metrics).sort((a, b) => a.order - b.order);
+  }, [value]);
 
   const chartRefs = React.useRef();
   React.useEffect(() => {
@@ -120,11 +124,14 @@ export default ({ clusterID, timezone, timeRange, handleTimeChange }) => {
                     labelFormat={timeRange.timeFormatter}
                     tickFormat={timeRange.timeFormatter}
                   />
-                  {e == "cluster_health" ? (
+                  {metrics[e].key == "cluster_health" ? (
                     <Axis
                       id="cluster_health"
                       title={formatMessage({
-                        id: "dashboard.charts.title." + e + ".axis.percent",
+                        id:
+                          "dashboard.charts.title." +
+                          metrics[e].key +
+                          ".axis.percent",
                       })}
                       position={Position.Left}
                       tickFormat={(d) => Number(d).toFixed(0) + "%"}
@@ -141,7 +148,7 @@ export default ({ clusterID, timezone, timeRange, handleTimeChange }) => {
                         title={formatMessage({
                           id:
                             "dashboard.charts.title." +
-                            e +
+                            metrics[e].key +
                             ".axis." +
                             item.title,
                         })}
@@ -160,7 +167,7 @@ export default ({ clusterID, timezone, timeRange, handleTimeChange }) => {
                   })}
 
                   {lines.map((item) => {
-                    if (item.type == "bar") {
+                    if (item.type == "Bar") {
                       return (
                         <BarSeries
                           xScaleType={ScaleType.Time}
diff --git a/web/src/pages/Cluster/components/node_metric.jsx b/web/src/pages/Cluster/components/node_metric.jsx
index 1dbf8455..50a875d8 100644
--- a/web/src/pages/Cluster/components/node_metric.jsx
+++ b/web/src/pages/Cluster/components/node_metric.jsx
@@ -24,6 +24,7 @@ import _ from "lodash";
 
 const gorupOrder = [
   "system",
+  "transport",
   "operations",
   "latency",
   "storage",
diff --git a/web/src/pages/Cluster/format.js b/web/src/pages/Cluster/format.js
index 47a020d9..d4fc555c 100644
--- a/web/src/pages/Cluster/format.js
+++ b/web/src/pages/Cluster/format.js
@@ -37,7 +37,7 @@ export const formatter = {
 export function getFormatter(type, format, units) {
   switch (type) {
     case "bytes":
-      return formatter.bytes;
+      return getBytesFormatter(units);
     case "ratio":
       return formatter.ratio;
     case "num":
@@ -50,3 +50,7 @@ export function getFormatter(type, format, units) {
 export function getNumFormatter(format, units) {
   return (d) => numeral(d).format(format) + (units ? ` ${units}` : "");
 }
+
+export function getBytesFormatter(units) {
+  return (value) => formatter.bytes(value) + (units ? `/${units}` : "");
+}