From 30a6f367846ecb67c3e1a49fe2a668612ffaf9ab Mon Sep 17 00:00:00 2001
From: zhangyu <zhangyu@geedgenetworks.com>
Date: Wed, 11 Nov 2020 17:39:49 +0800
Subject: [PATCH] =?UTF-8?q?fix=EF=BC=9A.Dashboard=E7=95=8C=E9=9D=A2?=
 =?UTF-8?q?=E5=9C=B0=E5=9B=BE=E9=BC=A0=E6=A0=87=E6=94=BE=E7=BD=AE=E5=9C=A8?=
 =?UTF-8?q?=E5=9C=86=E4=B8=8A=EF=BC=8Cendpoint=E4=BB=A5=E5=8F=8Aprometheus?=
 =?UTF-8?q?=E7=8A=B6=E6=80=81=E5=9B=BE=E8=A1=A8=E4=B8=A2=E5=A4=B1=E7=9A=84?=
 =?UTF-8?q?=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../page/dashboard/overview/overview2.vue     | 51 ++++++++++---------
 1 file changed, 28 insertions(+), 23 deletions(-)

diff --git a/nezha-fronted/src/components/page/dashboard/overview/overview2.vue b/nezha-fronted/src/components/page/dashboard/overview/overview2.vue
index cfe1984ca..ced71c315 100644
--- a/nezha-fronted/src/components/page/dashboard/overview/overview2.vue
+++ b/nezha-fronted/src/components/page/dashboard/overview/overview2.vue
@@ -749,28 +749,31 @@
         return loadPromise;
       },
       initTooltipChart(param) {
-        let data = param.tooltip.options.data;
-        //console.info(tooltipEndpointChart);
-        tooltipEndpointChart = echarts.init(document.querySelector("#tooltip-chart--endpoint"));
-        tooltipPrometheusChart = echarts.init(document.querySelector("#tooltip-chart--prometheus"));
-        let endpointOption = chartConfig.getOption("tooltipPie"),
-          prometheusOption = chartConfig.getOption("tooltipPie");
-        endpointOption.series[0].label.formatter = data.endpointTotal + "";
-        endpointOption.series[0].data = [
-          {name: this.$t("dashboard.overview.asset.pingUp"), value: data.endpointUp ? data.endpointUp : 0},
-          {name: this.$t("dashboard.overview.asset.pingDown"), value: data.endpointDown ? data.endpointDown : 0}
-        ];
-        endpointOption.title.text = this.$t("project.endpoint.endpoint");
-        endpointOption.legend.data = [this.$t("dashboard.overview.asset.pingUp"), this.$t("dashboard.overview.asset.pingDown")];
-        prometheusOption.series[0].label.formatter = data.promTotal + "";
-        prometheusOption.series[0].data = [
-          {name: this.$t("dashboard.overview.asset.pingUp"), value: data.promUp ? data.promUp : 0},
-          {name: this.$t("dashboard.overview.asset.pingDown"), value: data.promDown ? data.promDown : 0}
-        ];
-        prometheusOption.title.text = "Prometheus";
-        prometheusOption.legend.data = [this.$t("dashboard.overview.asset.pingUp"), this.$t("dashboard.overview.asset.pingDown")];
-        tooltipEndpointChart.setOption(endpointOption, true);
-        tooltipPrometheusChart.setOption(prometheusOption, true);
+        let vm = this;
+        setTimeout(()=>{
+          let data = param.tooltip.options.data;
+          //console.info(tooltipEndpointChart);
+          tooltipEndpointChart = echarts.init(document.querySelector("#tooltip-chart--endpoint"));
+          tooltipPrometheusChart = echarts.init(document.querySelector("#tooltip-chart--prometheus"));
+          let endpointOption = chartConfig.getOption("tooltipPie"),
+            prometheusOption = chartConfig.getOption("tooltipPie");
+          endpointOption.series[0].label.formatter = data.endpointTotal + "";
+          endpointOption.series[0].data = [
+            {name: vm.$t("dashboard.overview.asset.pingUp"), value: data.endpointUp ? data.endpointUp : 0},
+            {name: vm.$t("dashboard.overview.asset.pingDown"), value: data.endpointDown ? data.endpointDown : 0}
+          ];
+          endpointOption.title.text = vm.$t("project.endpoint.endpoint");
+          endpointOption.legend.data = [vm.$t("dashboard.overview.asset.pingUp"), vm.$t("dashboard.overview.asset.pingDown")];
+          prometheusOption.series[0].label.formatter = data.promTotal + "";
+          prometheusOption.series[0].data = [
+            {name: vm.$t("dashboard.overview.asset.pingUp"), value: data.promUp ? data.promUp : 0},
+            {name: vm.$t("dashboard.overview.asset.pingDown"), value: data.promDown ? data.promDown : 0}
+          ];
+          prometheusOption.title.text = "Prometheus";
+          prometheusOption.legend.data = [vm.$t("dashboard.overview.asset.pingUp"), vm.$t("dashboard.overview.asset.pingDown")];
+          tooltipEndpointChart.setOption(endpointOption, true);
+          tooltipPrometheusChart.setOption(prometheusOption, true);
+        },100)
         /*setTimeout(function() {
           tooltipEndpointChart.setOption(endpointOption);
           tooltipPrometheusChart.setOption(prometheusOption);
@@ -797,7 +800,9 @@
               }).setView([mapConfig.latitude,mapConfig.longitude],mapConfig.zoom);
               map.createPane("myPane", document.querySelector(".my-pane"));
               map.on("tooltipopen", function(param) {
-                vm.initTooltipChart(param);
+                setTimeout(()=>{
+                  vm.initTooltipChart(param);
+                },100)
               });
               map.on("tooltipclose", function(param) {
                 tooltipEndpointChart && tooltipEndpointChart.clear();