diff --git a/core/core-frontend/src/views/chart/components/js/panel/common/common_antv.ts b/core/core-frontend/src/views/chart/components/js/panel/common/common_antv.ts index eac82d2ae4..db88743248 100644 --- a/core/core-frontend/src/views/chart/components/js/panel/common/common_antv.ts +++ b/core/core-frontend/src/views/chart/components/js/panel/common/common_antv.ts @@ -1467,14 +1467,22 @@ export function configPlotTooltipEvent> if (!tooltipCtl) { return } - const container = tooltipCtl.tooltip.cfg.container + const container = tooltipCtl.tooltip?.cfg.container for (const ele of wrapperDom.children) { - if (container.id !== ele.id) { + if (!container || container.id !== ele.id) { ele.style.display = 'none' } } } }) + plot.on('tooltip:hidden', () => { + const tooltipCtl = plot.chart.getController('tooltip') + if (!tooltipCtl) { + return + } + const container = tooltipCtl.tooltip?.cfg.container + container && (container.style.display = 'none') + }) } export const TOOLTIP_TPL = diff --git a/core/core-frontend/src/views/chart/components/views/components/ChartComponentG2Plot.vue b/core/core-frontend/src/views/chart/components/views/components/ChartComponentG2Plot.vue index 2b5a22ffdb..72546e08d2 100644 --- a/core/core-frontend/src/views/chart/components/views/components/ChartComponentG2Plot.vue +++ b/core/core-frontend/src/views/chart/components/views/components/ChartComponentG2Plot.vue @@ -742,6 +742,7 @@ defineExpose({ trackMenu, clearLinkage }) +let intersectionObserver let resizeObserver const TOLERANCE = 0.01 const RESIZE_MONITOR_CHARTS = ['map', 'bubble-map', 'flow-map', 'heat-map'] @@ -766,6 +767,15 @@ onMounted(() => { preSize[1] = size.blockSize }) resizeObserver.observe(containerDom) + intersectionObserver = new IntersectionObserver(([entry]) => { + if (RESIZE_MONITOR_CHARTS.includes(view.value.type)) { + return + } + if (entry.intersectionRatio <= 0) { + myChart?.emit('tooltip:hidden') + } + }) + intersectionObserver.observe(containerDom) useEmitt({ name: 'l7-prepare-picture', callback: preparePicture }) useEmitt({ name: 'l7-unprepare-picture', callback: unPreparePicture }) }) @@ -773,6 +783,7 @@ onBeforeUnmount(() => { try { myChart?.destroy() resizeObserver?.disconnect() + intersectionObserver?.disconnect() } catch (e) { console.warn(e) } diff --git a/core/core-frontend/src/views/chart/components/views/index.vue b/core/core-frontend/src/views/chart/components/views/index.vue index 17f19982c2..7976c77841 100644 --- a/core/core-frontend/src/views/chart/components/views/index.vue +++ b/core/core-frontend/src/views/chart/components/views/index.vue @@ -1028,6 +1028,14 @@ const titleTooltipWidth = computed(() => { } return '500px' }) +const clearG2Tooltip = () => { + const g2TooltipWrapper = document.getElementById('g2-tooltip-wrapper') + if (g2TooltipWrapper) { + for (const ele of g2TooltipWrapper.children) { + ele.style.display = 'none' + } + } +}