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

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

@@ -749,28 +749,31 @@
return loadPromise; return loadPromise;
}, },
initTooltipChart(param) { initTooltipChart(param) {
let data = param.tooltip.options.data; let vm = this;
//console.info(tooltipEndpointChart); setTimeout(()=>{
tooltipEndpointChart = echarts.init(document.querySelector("#tooltip-chart--endpoint")); let data = param.tooltip.options.data;
tooltipPrometheusChart = echarts.init(document.querySelector("#tooltip-chart--prometheus")); //console.info(tooltipEndpointChart);
let endpointOption = chartConfig.getOption("tooltipPie"), tooltipEndpointChart = echarts.init(document.querySelector("#tooltip-chart--endpoint"));
prometheusOption = chartConfig.getOption("tooltipPie"); tooltipPrometheusChart = echarts.init(document.querySelector("#tooltip-chart--prometheus"));
endpointOption.series[0].label.formatter = data.endpointTotal + ""; let endpointOption = chartConfig.getOption("tooltipPie"),
endpointOption.series[0].data = [ prometheusOption = chartConfig.getOption("tooltipPie");
{name: this.$t("dashboard.overview.asset.pingUp"), value: data.endpointUp ? data.endpointUp : 0}, endpointOption.series[0].label.formatter = data.endpointTotal + "";
{name: this.$t("dashboard.overview.asset.pingDown"), value: data.endpointDown ? data.endpointDown : 0} endpointOption.series[0].data = [
]; {name: vm.$t("dashboard.overview.asset.pingUp"), value: data.endpointUp ? data.endpointUp : 0},
endpointOption.title.text = this.$t("project.endpoint.endpoint"); {name: vm.$t("dashboard.overview.asset.pingDown"), value: data.endpointDown ? data.endpointDown : 0}
endpointOption.legend.data = [this.$t("dashboard.overview.asset.pingUp"), this.$t("dashboard.overview.asset.pingDown")]; ];
prometheusOption.series[0].label.formatter = data.promTotal + ""; endpointOption.title.text = vm.$t("project.endpoint.endpoint");
prometheusOption.series[0].data = [ endpointOption.legend.data = [vm.$t("dashboard.overview.asset.pingUp"), vm.$t("dashboard.overview.asset.pingDown")];
{name: this.$t("dashboard.overview.asset.pingUp"), value: data.promUp ? data.promUp : 0}, prometheusOption.series[0].label.formatter = data.promTotal + "";
{name: this.$t("dashboard.overview.asset.pingDown"), value: data.promDown ? data.promDown : 0} prometheusOption.series[0].data = [
]; {name: vm.$t("dashboard.overview.asset.pingUp"), value: data.promUp ? data.promUp : 0},
prometheusOption.title.text = "Prometheus"; {name: vm.$t("dashboard.overview.asset.pingDown"), value: data.promDown ? data.promDown : 0}
prometheusOption.legend.data = [this.$t("dashboard.overview.asset.pingUp"), this.$t("dashboard.overview.asset.pingDown")]; ];
tooltipEndpointChart.setOption(endpointOption, true); prometheusOption.title.text = "Prometheus";
tooltipPrometheusChart.setOption(prometheusOption, true); 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() { /*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) {
vm.initTooltipChart(param); setTimeout(()=>{
vm.initTooltipChart(param);
},100)
}); });
map.on("tooltipclose", function(param) { map.on("tooltipclose", function(param) {
tooltipEndpointChart && tooltipEndpointChart.clear(); tooltipEndpointChart && tooltipEndpointChart.clear();