diff --git a/core/core-frontend/src/utils/canvasUtils.ts b/core/core-frontend/src/utils/canvasUtils.ts index 13a6073c79..2fda5b031b 100644 --- a/core/core-frontend/src/utils/canvasUtils.ts +++ b/core/core-frontend/src/utils/canvasUtils.ts @@ -1112,3 +1112,29 @@ export function syncViewTitle(element) { } } } + +// 地图类图表,需要预先准备图片 +const mapChartTypes = ['bubble-map', 'flow-map', 'heat-map', 'map', 'symbolic-map'] + +/** + * 获取画布中所有地图类图表的元素ID + * @param canvasDataPreview + */ +export function getMapElementIds(canvasDataPreview) { + const mapElementIds = [] + canvasDataPreview.forEach(item => { + if (mapChartTypes.includes(item.innerType)) { + mapElementIds.push(item.id) + } + if (item.component === 'DeTabs') { + item.propValue?.forEach(tabItem => { + tabItem.componentData?.forEach(tabComponent => { + if (mapChartTypes.includes(tabComponent.innerType)) { + mapElementIds.push(tabComponent.id) + } + }) + }) + } + }) + return mapElementIds +} diff --git a/core/core-frontend/src/views/dashboard/DashboardPreviewShow.vue b/core/core-frontend/src/views/dashboard/DashboardPreviewShow.vue index 1236da67c5..98fb8923c0 100644 --- a/core/core-frontend/src/views/dashboard/DashboardPreviewShow.vue +++ b/core/core-frontend/src/views/dashboard/DashboardPreviewShow.vue @@ -7,7 +7,12 @@ import DePreview from '@/components/data-visualization/canvas/DePreview.vue' import PreviewHead from '@/views/data-visualization/PreviewHead.vue' import EmptyBackground from '@/components/empty-background/src/EmptyBackground.vue' import ArrowSide from '@/views/common/DeResourceArrow.vue' -import { initCanvasData, initCanvasDataPrepare, onInitReady } from '@/utils/canvasUtils' +import { + getMapElementIds, + initCanvasData, + initCanvasDataPrepare, + onInitReady +} from '@/utils/canvasUtils' import { useAppStoreWithOut } from '@/store/modules/app' import { useMoveLine } from '@/hooks/web/useMoveLine' import { Icon } from '@/components/icon-custom' @@ -129,14 +134,10 @@ const loadCanvasData = (dvId, weight?) => { } ) } -// 地图类图表,需要预先准备图片 -const mapChartTypes = ['bubble-map', 'flow-map', 'heat-map', 'map', 'symbolic-map'] + const downloadH2 = type => { downloadStatus.value = true - const mapElementIds = - state.canvasDataPreview - ?.filter(ele => mapChartTypes.includes(ele.innerType)) - .map(ele => ele.id) || [] + const mapElementIds = getMapElementIds(state.canvasDataPreview) mapElementIds.forEach(id => useEmitt().emitter.emit('l7-prepare-picture', id)) nextTick(() => { const vueDom = previewCanvasContainer.value.querySelector('.canvas-container') @@ -189,10 +190,7 @@ const checkTemplate = () => { const fileDownload = (downloadType, attachParams) => { downloadStatus.value = true - const mapElementIds = - state.canvasDataPreview - ?.filter(ele => mapChartTypes.includes(ele.innerType)) - .map(ele => ele.id) || [] + const mapElementIds = getMapElementIds(state.canvasDataPreview) mapElementIds.forEach(id => useEmitt().emitter.emit('l7-prepare-picture', id)) nextTick(() => { const vueDom = previewCanvasContainer.value.querySelector('.canvas-container') diff --git a/core/core-frontend/src/views/data-visualization/PreviewShow.vue b/core/core-frontend/src/views/data-visualization/PreviewShow.vue index 9ef30dbf76..15c1306a3d 100644 --- a/core/core-frontend/src/views/data-visualization/PreviewShow.vue +++ b/core/core-frontend/src/views/data-visualization/PreviewShow.vue @@ -8,7 +8,12 @@ import PreviewHead from '@/views/data-visualization/PreviewHead.vue' import EmptyBackground from '@/components/empty-background/src/EmptyBackground.vue' import { storeToRefs } from 'pinia' import { useAppStoreWithOut } from '@/store/modules/app' -import { initCanvasData, initCanvasDataPrepare, onInitReady } from '@/utils/canvasUtils' +import { + getMapElementIds, + initCanvasData, + initCanvasDataPrepare, + onInitReady +} from '@/utils/canvasUtils' import { useMoveLine } from '@/hooks/web/useMoveLine' import { Icon } from '@/components/icon-custom' import { download2AppTemplate, downloadCanvas2 } from '@/utils/imgUtils' @@ -119,14 +124,9 @@ const loadCanvasData = (dvId, weight?, ext?) => { } ) } -// 地图类图表,需要预先准备图片 -const mapChartTypes = ['bubble-map', 'flow-map', 'heat-map', 'map', 'symbolic-map'] const download = type => { downloadStatus.value = true - const mapElementIds = - state.canvasDataPreview - ?.filter(ele => mapChartTypes.includes(ele.innerType)) - .map(ele => ele.id) || [] + const mapElementIds = getMapElementIds(state.canvasDataPreview) mapElementIds.forEach(id => useEmitt().emitter.emit('l7-prepare-picture', id)) setTimeout(() => { const vueDom = previewCanvasContainer.value.querySelector('.canvas-container') @@ -143,10 +143,7 @@ const download = type => { } const fileDownload = (downloadType, attachParams) => { downloadStatus.value = true - const mapElementIds = - state.canvasDataPreview - ?.filter(ele => mapChartTypes.includes(ele.innerType)) - .map(ele => ele.id) || [] + const mapElementIds = getMapElementIds(state.canvasDataPreview) mapElementIds.forEach(id => useEmitt().emitter.emit('l7-prepare-picture', id)) nextTick(() => { const vueDom = previewCanvasContainer.value.querySelector('.canvas-container')