diff --git a/core/core-frontend/src/views/chart/components/js/panel/charts/table/table-info.ts b/core/core-frontend/src/views/chart/components/js/panel/charts/table/table-info.ts index a05587d336..3c909b8764 100644 --- a/core/core-frontend/src/views/chart/components/js/panel/charts/table/table-info.ts +++ b/core/core-frontend/src/views/chart/components/js/panel/charts/table/table-info.ts @@ -1,5 +1,6 @@ import { type LayoutResult, + MergedCell, S2DataConfig, S2Event, S2Options, @@ -26,33 +27,15 @@ import { summaryRowStyle, configEmptyDataStyle, getLeafNodes, - getColumns + getColumns, + drawImage } from '@/views/chart/components/js/panel/common/common_table' const { t } = useI18n() + class ImageCell extends CustomDataCell { protected drawTextShape(): void { - const img = new Image() - const { x, y, width, height, fieldValue } = this.meta - img.src = fieldValue as string - img.setAttribute('crossOrigin', 'anonymous') - img.onload = () => { - !this.cfg.children && (this.cfg.children = []) - const { width: imgWidth, height: imgHeight } = img - const ratio = Math.max(imgWidth / width, imgHeight / height) - // 不铺满,部分留白 - const imgShowWidth = (imgWidth / ratio) * 0.8 - const imgShowHeight = (imgHeight / ratio) * 0.8 - this.textShape = this.addShape('image', { - attrs: { - x: x + (imgShowWidth < width ? (width - imgShowWidth) / 2 : 0), - y: y + (imgShowHeight < height ? (height - imgShowHeight) / 2 : 0), - width: imgShowWidth, - height: imgShowHeight, - img - } - }) - } + drawImage.apply(this) } } /** diff --git a/core/core-frontend/src/views/chart/components/js/panel/common/common_table.ts b/core/core-frontend/src/views/chart/components/js/panel/common/common_table.ts index 07a9235313..aac1effabc 100644 --- a/core/core-frontend/src/views/chart/components/js/panel/common/common_table.ts +++ b/core/core-frontend/src/views/chart/components/js/panel/common/common_table.ts @@ -1567,6 +1567,7 @@ export function configMergeCells(chart: Chart, options: S2Options, dataConfig: S if (showIndex && meta.colIndex === 0) { meta.fieldValue = getRowIndex(mergedCellsInfo, meta) } + meta.deFieldType = fieldsMap[meta.valueField]?.deType return new CustomMergedCell(sheet, cells, meta) } } @@ -1594,6 +1595,7 @@ export function getRowIndex(mergedCellsInfo: MergedCellInfo[][], meta: ViewMeta) }, 0) return curRangeStartIndex - lostCells + 1 } + class CustomMergedCell extends MergedCell { protected drawBackgroundShape() { const allPoints = getPolygonPoints(this.cells) @@ -1608,6 +1610,13 @@ class CustomMergedCell extends MergedCell { lineHeight: cellTheme.horizontalBorderWidth }) } + drawTextShape(): void { + if (this.meta.deFieldType === 7) { + drawImage.apply(this) + } else { + super.drawTextShape() + } + } } export class CustomDataCell extends TableDataCell { @@ -2015,3 +2024,27 @@ export const getColumns = (fields, cols: Array) => { } return result } + +export function drawImage() { + const img = new Image() + const { x, y, width, height, fieldValue } = this.meta + img.src = fieldValue as string + img.setAttribute('crossOrigin', 'anonymous') + img.onload = () => { + !this.cfg.children && (this.cfg.children = []) + const { width: imgWidth, height: imgHeight } = img + const ratio = Math.max(imgWidth / width, imgHeight / height) + // 不铺满,部分留白 + const imgShowWidth = (imgWidth / ratio) * 0.8 + const imgShowHeight = (imgHeight / ratio) * 0.8 + this.textShape = this.addShape('image', { + attrs: { + x: x + (imgShowWidth < width ? (width - imgShowWidth) / 2 : 0), + y: y + (imgShowHeight < height ? (height - imgShowHeight) / 2 : 0), + width: imgShowWidth, + height: imgShowHeight, + img + } + }) + } +}