diff --git a/package-lock.json b/package-lock.json
index a4aa4e3a..0afd4604 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -33,9 +33,9 @@
       }
     },
     "@amcharts/amcharts4-geodata": {
-      "version": "4.1.20",
-      "resolved": "https://registry.nlark.com/@amcharts/amcharts4-geodata/download/@amcharts/amcharts4-geodata-4.1.20.tgz",
-      "integrity": "sha1-qHu/yU7wPkx1PlaTjHYYritnR28="
+      "version": "4.1.21",
+      "resolved": "https://registry.nlark.com/@amcharts/amcharts4-geodata/download/@amcharts/amcharts4-geodata-4.1.21.tgz",
+      "integrity": "sha1-hBQT6H/FAU/xKb5bbx84F6dq93k="
     },
     "@babel/cli": {
       "version": "7.14.5",
@@ -3199,6 +3199,16 @@
           "integrity": "sha1-/q7SVZc9LndVW4PbwIhRpsY1IPo=",
           "dev": true
         },
+        "gzip-size": {
+          "version": "5.1.1",
+          "resolved": "https://registry.npm.taobao.org/gzip-size/download/gzip-size-5.1.1.tgz?cache=0&sync_timestamp=1605523244597&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fgzip-size%2Fdownload%2Fgzip-size-5.1.1.tgz",
+          "integrity": "sha1-y5vuaS+HwGErIyhAqHOQTkwTUnQ=",
+          "dev": true,
+          "requires": {
+            "duplexer": "^0.1.1",
+            "pify": "^4.0.1"
+          }
+        },
         "ssri": {
           "version": "8.0.1",
           "resolved": "https://registry.nlark.com/ssri/download/ssri-8.0.1.tgz?cache=0&sync_timestamp=1621364626710&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fssri%2Fdownload%2Fssri-8.0.1.tgz",
@@ -3207,6 +3217,27 @@
           "requires": {
             "minipass": "^3.1.1"
           }
+        },
+        "webpack-bundle-analyzer": {
+          "version": "3.9.0",
+          "resolved": "https://registry.nlark.com/webpack-bundle-analyzer/download/webpack-bundle-analyzer-3.9.0.tgz?cache=0&sync_timestamp=1621259099265&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fwebpack-bundle-analyzer%2Fdownload%2Fwebpack-bundle-analyzer-3.9.0.tgz",
+          "integrity": "sha1-9vlNsQj7V05BWtMT3kGicH0z7zw=",
+          "dev": true,
+          "requires": {
+            "acorn": "^7.1.1",
+            "acorn-walk": "^7.1.1",
+            "bfj": "^6.1.1",
+            "chalk": "^2.4.1",
+            "commander": "^2.18.0",
+            "ejs": "^2.6.1",
+            "express": "^4.16.3",
+            "filesize": "^3.6.1",
+            "gzip-size": "^5.0.0",
+            "lodash": "^4.17.19",
+            "mkdirp": "^0.5.1",
+            "opener": "^1.5.1",
+            "ws": "^6.0.0"
+          }
         }
       }
     },
@@ -8969,16 +9000,6 @@
       "resolved": "https://registry.npm.taobao.org/graceful-fs/download/graceful-fs-4.2.6.tgz",
       "integrity": "sha1-/wQLKwhTsjw9MQJ1I3BvGIXXa+4="
     },
-    "gzip-size": {
-      "version": "5.1.1",
-      "resolved": "https://registry.npm.taobao.org/gzip-size/download/gzip-size-5.1.1.tgz?cache=0&sync_timestamp=1605523244597&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fgzip-size%2Fdownload%2Fgzip-size-5.1.1.tgz",
-      "integrity": "sha1-y5vuaS+HwGErIyhAqHOQTkwTUnQ=",
-      "dev": true,
-      "requires": {
-        "duplexer": "^0.1.1",
-        "pify": "^4.0.1"
-      }
-    },
     "handle-thing": {
       "version": "2.0.1",
       "resolved": "https://registry.npm.taobao.org/handle-thing/download/handle-thing-2.0.1.tgz",
@@ -16331,35 +16352,6 @@
         }
       }
     },
-    "webpack-bundle-analyzer": {
-      "version": "3.9.0",
-      "resolved": "https://registry.nlark.com/webpack-bundle-analyzer/download/webpack-bundle-analyzer-3.9.0.tgz?cache=0&sync_timestamp=1621259099265&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fwebpack-bundle-analyzer%2Fdownload%2Fwebpack-bundle-analyzer-3.9.0.tgz",
-      "integrity": "sha1-9vlNsQj7V05BWtMT3kGicH0z7zw=",
-      "dev": true,
-      "requires": {
-        "acorn": "^7.1.1",
-        "acorn-walk": "^7.1.1",
-        "bfj": "^6.1.1",
-        "chalk": "^2.4.1",
-        "commander": "^2.18.0",
-        "ejs": "^2.6.1",
-        "express": "^4.16.3",
-        "filesize": "^3.6.1",
-        "gzip-size": "^5.0.0",
-        "lodash": "^4.17.19",
-        "mkdirp": "^0.5.1",
-        "opener": "^1.5.1",
-        "ws": "^6.0.0"
-      },
-      "dependencies": {
-        "acorn": {
-          "version": "7.4.1",
-          "resolved": "https://registry.nlark.com/acorn/download/acorn-7.4.1.tgz?cache=0&sync_timestamp=1620134123724&other_urls=https%3A%2F%2Fregistry.nlark.com%2Facorn%2Fdownload%2Facorn-7.4.1.tgz",
-          "integrity": "sha1-/q7SVZc9LndVW4PbwIhRpsY1IPo=",
-          "dev": true
-        }
-      }
-    },
     "webpack-chain": {
       "version": "6.5.1",
       "resolved": "https://registry.npm.taobao.org/webpack-chain/download/webpack-chain-6.5.1.tgz",
diff --git a/src/components/charts/StatisticsLegend.vue b/src/components/charts/StatisticsLegend.vue
index 4762e162..96c79644 100644
--- a/src/components/charts/StatisticsLegend.vue
+++ b/src/components/charts/StatisticsLegend.vue
@@ -1,15 +1,15 @@
 <template>
   <div class="chart__legend">
     <div class="chart__table-top">
-      <div>Average</div>
-      <div>Maximum</div>
+      <div>Avg</div>
+      <div>Max</div>
     </div>
     <div class="chart__table-below">
       <div v-for="(item,index) in data" :key="index" class="table-below-box">
         <div class="table__below-color"><div :style="{backgroundColor: getChartColor(index)}"></div></div>
         <div class="table__below-title" :title="item.legend">{{item.legend}}</div>
-        <div class="table__below-statistics" :title="item.aggregation.max">{{item.aggregation.max}}</div>
-        <div class="table__below-statistics" :title="item.aggregation.avg">{{item.aggregation.avg}}</div>
+        <div class="table__below-statistics" :title="item.aggregation.max">{{shortFormatter(item.aggregation.max)}}</div>
+        <div class="table__below-statistics" :title="item.aggregation.avg">{{shortFormatter(item.aggregation.avg)}}</div>
       </div>
     </div>
   </div>
@@ -18,7 +18,7 @@
 
 <script>
 import { getChartColor } from '@/components/charts/chart-options'
-import { chartColor } from './chart-options'
+import { shortFormatter } from '@/components/charts/chartFormatter'
 export default {
   name: 'StatisticsLegend',
   props: {
@@ -35,7 +35,7 @@ export default {
   setup () {
     return {
       getChartColor,
-      chartColor
+      shortFormatter
     }
   }
 }
@@ -55,7 +55,6 @@ export default {
   border-bottom: #E7EAED 1px solid;
   display: flex;
   justify-content: flex-end;
-  padding-right: 15px;
 
   div {
     width: 80px;
diff --git a/src/components/charts/chart-options.js b/src/components/charts/chart-options.js
index 1c4ca3e9..cfa2c604 100644
--- a/src/components/charts/chart-options.js
+++ b/src/components/charts/chart-options.js
@@ -4,7 +4,7 @@
  * @description chart option和一些工具
 */
 import { format } from 'echarts'
-import { shortFormatter } from './chartFormatter'
+import { shortFormatter, tooltipShortFormatter } from './chartFormatter'
 import _ from 'lodash'
 export const chartColor = ['#5370C6', '#90CC74', '#FAC858', '#EE6666',
   '#73BFDE', '#3BA172', '#FC8452', '#9960B4',
@@ -22,6 +22,7 @@ const line = {
       overflow: 'truncate'
     },
     formatter: axiosFormatter,
+    show: true,
     className: 'nz-chart-tooltip',
     extraCssText: 'box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);max-width: 300px !important'
   },
@@ -43,8 +44,12 @@ const line = {
   },
   color: chartColor,
   legend: {
+    tooltip: {
+      show: true,
+      formatter: '{a}'
+    },
     show: true,
-    right: 25,
+    right: 23,
     top: 8,
     orient: 'horizontal',
     icon: 'circle',
@@ -175,7 +180,8 @@ const lineStack = {
 const pieWithTable = {
   tooltip: {
     appendToBody: true,
-    trigger: 'item'
+    trigger: 'item',
+    formatter: tooltipShortFormatter
   },
   color: chartColor,
   animation: false,
@@ -310,7 +316,6 @@ function tooLongFormatter (name) {
 }
 function axiosFormatter (params) {
   let str = '<div>'
-  const sum = 0
   params.forEach((item, i) => {
     const tData = item.data[0]
     if (i === 0) {
diff --git a/src/components/charts/chartFormatter.js b/src/components/charts/chartFormatter.js
index c93a7e0b..3005f622 100644
--- a/src/components/charts/chartFormatter.js
+++ b/src/components/charts/chartFormatter.js
@@ -1,4 +1,4 @@
-const shortList = [' ', 'K', 'M', 'B', 'T', 'Quadrillion', 'Quintillion']
+const shortList = [' ', 'K', 'M', 'G', 'T', 'Quadrillion', 'Quintillion']
 function asciiCompute (num, ascii, units, dot = 2) {
   if (!num && num !== 0 && num !== '0') {
     return ''
@@ -19,3 +19,6 @@ function asciiCompute (num, ascii, units, dot = 2) {
 export function shortFormatter (value, index, dot = 2) {
   return asciiCompute(value, 1000, shortList, dot)
 }
+export function tooltipShortFormatter (obj, index, callback, dot = 2) {
+  return asciiCompute(obj.value, 1000, shortList, dot)
+}
diff --git a/src/views/charts/Chart.vue b/src/views/charts/Chart.vue
index 15462dbc..0a3e914f 100644
--- a/src/views/charts/Chart.vue
+++ b/src/views/charts/Chart.vue
@@ -174,6 +174,7 @@ import ChartMap from '@/components/charts/ChartMap'
 import PieTable from '@/components/charts/PieTable'
 import StatisticsLegend from '@/components/charts/StatisticsLegend'
 import ChartTablePagination from '@/components/charts/ChartTablePagination'
+import { shortFormatter } from '@/components/charts/chartFormatter'
 import { chartTableDefaultPageSize, chartTableTopOptions, storageKey, chartPieTableTopOptions } from '@/utils/constants'
 import { get } from '@/utils/http'
 import { replaceUrlPlaceholder, getCapitalGeo, getGeoData, lineToSpace } from '@/utils/tools'
@@ -264,7 +265,7 @@ export default {
       return `Server: ${data.serverRegion ? data.serverRegion : data.serverCountry}
           Client: ${data.clientRegion ? data.clientRegion : data.clientCountry}
           Sessions: ${data.sessions}
-          Bytes: ${data.bytes}`
+          Bytes: ${shortFormatter(data.bytes)}`
     },
     changeTab (tab) {
       this.activeTab = tab.paneName
@@ -382,11 +383,9 @@ export default {
             })
             const polygonTemplate = polygonSeries.mapPolygons.template
             polygonTemplate.tooltipText = '{name}: {value}'
+            // polygonTemplate.numberFormatter = new am4Core.NumberFormatter().bigNumberPrefixes
             polygonTemplate.nonScalingStroke = true
             polygonTemplate.strokeWidth = 0.5
-
-            const hs = polygonTemplate.states.create('hover')
-            // hs.properties.fill = am4Core.color('#3c5bdc')
           }
         }
       })
@@ -549,10 +548,10 @@ export default {
     },
     handleSingleValue () {
       return function (value) {
-        if (!Number(value)) {
-          return 0
+        if (!Number(value) && Number(value) !== 0) {
+          return '-'
         } else {
-          return Number(value) < 0.01 ? '< 0.01' : this.$_.round(value, 2)
+          return Number(value) < 0.01 ? '< 0.01' : shortFormatter(value)
         }
       }
     }