gfwleak/nezha-nezha-fronted
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix：.Dashboard界面地图鼠标放置在圆上，endpoint以及prometheus状态图表丢失的问题

Browse Source
This commit is contained in:
zhangyu
2020-11-11 17:39:49 +08:00
parent 38424c849a
commit 30a6f36784
1 changed files with 28 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
nezha-fronted/src/components/page/dashboard/overview/overview2.vue
View File

@@ -749,6 +749,8 @@
return loadPromise; return loadPromise;
}, },
initTooltipChart(param) { initTooltipChart(param) {
let vm = this;
setTimeout(()=>{
let data = param.tooltip.options.data; let data = param.tooltip.options.data;
//console.info(tooltipEndpointChart); //console.info(tooltipEndpointChart);
tooltipEndpointChart = echarts.init(document.querySelector("#tooltip-chart--endpoint")); tooltipEndpointChart = echarts.init(document.querySelector("#tooltip-chart--endpoint"));
@@ -757,20 +759,21 @@
prometheusOption = chartConfig.getOption("tooltipPie"); prometheusOption = chartConfig.getOption("tooltipPie");
endpointOption.series[0].label.formatter = data.endpointTotal + ""; endpointOption.series[0].label.formatter = data.endpointTotal + "";
endpointOption.series[0].data = [ endpointOption.series[0].data = [
{name: this.$t("dashboard.overview.asset.pingUp"), value: data.endpointUp ? data.endpointUp : 0}, {name: vm.$t("dashboard.overview.asset.pingUp"), value: data.endpointUp ? data.endpointUp : 0},
{name: this.$t("dashboard.overview.asset.pingDown"), value: data.endpointDown ? data.endpointDown : 0} {name: vm.$t("dashboard.overview.asset.pingDown"), value: data.endpointDown ? data.endpointDown : 0}
]; ];
endpointOption.title.text = this.$t("project.endpoint.endpoint"); endpointOption.title.text = vm.$t("project.endpoint.endpoint");
endpointOption.legend.data = [this.$t("dashboard.overview.asset.pingUp"), this.$t("dashboard.overview.asset.pingDown")]; 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].label.formatter = data.promTotal + "";
prometheusOption.series[0].data = [ prometheusOption.series[0].data = [
{name: this.$t("dashboard.overview.asset.pingUp"), value: data.promUp ? data.promUp : 0}, {name: vm.$t("dashboard.overview.asset.pingUp"), value: data.promUp ? data.promUp : 0},
{name: this.$t("dashboard.overview.asset.pingDown"), value: data.promDown ? data.promDown : 0} {name: vm.$t("dashboard.overview.asset.pingDown"), value: data.promDown ? data.promDown : 0}
]; ];
prometheusOption.title.text = "Prometheus"; prometheusOption.title.text = "Prometheus";
prometheusOption.legend.data = [this.$t("dashboard.overview.asset.pingUp"), this.$t("dashboard.overview.asset.pingDown")]; prometheusOption.legend.data = [vm.$t("dashboard.overview.asset.pingUp"), vm.$t("dashboard.overview.asset.pingDown")];
tooltipEndpointChart.setOption(endpointOption, true); tooltipEndpointChart.setOption(endpointOption, true);
tooltipPrometheusChart.setOption(prometheusOption, true); tooltipPrometheusChart.setOption(prometheusOption, true);
},100)
/*setTimeout(function() { /*setTimeout(function() {
tooltipEndpointChart.setOption(endpointOption); tooltipEndpointChart.setOption(endpointOption);
tooltipPrometheusChart.setOption(prometheusOption); tooltipPrometheusChart.setOption(prometheusOption);
@@ -797,7 +800,9 @@
}).setView([mapConfig.latitude,mapConfig.longitude],mapConfig.zoom); }).setView([mapConfig.latitude,mapConfig.longitude],mapConfig.zoom);
map.createPane("myPane", document.querySelector(".my-pane")); map.createPane("myPane", document.querySelector(".my-pane"));
map.on("tooltipopen", function(param) { map.on("tooltipopen", function(param) {
setTimeout(()=>{
vm.initTooltipChart(param); vm.initTooltipChart(param);
},100)
}); });
map.on("tooltipclose", function(param) { map.on("tooltipclose", function(param) {
tooltipEndpointChart && tooltipEndpointChart.clear(); tooltipEndpointChart && tooltipEndpointChart.clear();