From 1c668122c4462b711ccc3119744e0a44d971d93e Mon Sep 17 00:00:00 2001 From: wisonic-s Date: Tue, 4 Jun 2024 17:24:38 +0800 Subject: [PATCH] =?UTF-8?q?fix(=E5=9B=BE=E8=A1=A8):=20=E4=BF=AE=E5=A4=8D?= =?UTF-8?q?=E5=9C=B0=E5=9B=BE=E5=AF=BC=E5=87=BA=E5=9B=BE=E7=89=87=E6=97=B6?= =?UTF-8?q?=E7=BC=A9=E6=94=BE=E6=8C=89=E9=92=AE=E6=9C=AA=E6=98=BE=E7=A4=BA?= =?UTF-8?q?=20#10058?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../components/js/panel/common/common_antv.ts | 51 +++++++++++++------ 1 file changed, 36 insertions(+), 15 deletions(-) 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 510086322b..f563b01184 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 @@ -24,9 +24,10 @@ import { import substitute from '@antv/util/esm/substitute' import type { Plot as L7Plot, PlotOptions } from '@antv/l7plot/dist/esm' import { Zoom } from '@antv/l7' -import { createL7Icon } from '@antv/l7-component/es/utils/icon' import { DOM } from '@antv/l7-utils' import { Scene } from '@antv/l7-scene' +import { type IZoomControlOption } from '@antv/l7-component' +import { PositionType } from '@antv/l7-core' export function getPadding(chart: Chart): number[] { if (chart.drill) { @@ -828,7 +829,8 @@ export function configL7Label(chart: Chart): false | LabelOptions { visible: label.show, style: { fill: label.color, - fontSize: label.fontSize + fontSize: label.fontSize, + fontWeight: 'bold' } } } @@ -970,7 +972,13 @@ export function configL7Legend(chart: Chart): LegendOptions | false { } } } -class CustomZoom extends Zoom { +const ZOOM_IN_BTN = + '' +const RESET_BTN = + '' +const ZOOM_OUT_BTN = + '' +export class CustomZoom extends Zoom { resetButtonGroup(container) { DOM.clearChildren(container) this['zoomInButton'] = this['createButton']( @@ -980,9 +988,8 @@ class CustomZoom extends Zoom { container, this.zoomIn ) - const resetBtnIconText = createL7Icon('l7-icon-round') this['zoomResetButton'] = this['createButton']( - resetBtnIconText, + this.controlOption['resetText'], 'Reset', 'l7-button-control', container, @@ -1008,15 +1015,7 @@ class CustomZoom extends Zoom { container, this.zoomOut ) - const { buttonColor, buttonBackground } = this.controlOption as any - if (buttonColor) { - const elements = [ - this.controlOption.zoomInText, - this.controlOption.zoomOutText, - resetBtnIconText - ] as HTMLElement[] - setStyle(elements, 'fill', buttonColor) - } + const { buttonBackground } = this.controlOption as any const elements = [this['zoomResetButton'], this['zoomInButton'], this['zoomOutButton']] if (buttonBackground) { setStyle(elements, 'background', buttonBackground) @@ -1024,6 +1023,28 @@ class CustomZoom extends Zoom { setStyle(elements, 'border-bottom', 'none') this['updateDisabled']() } + public getDefault(option: Partial) { + const { buttonColor } = option as any + let zoomInText = ZOOM_IN_BTN + let zoomOutText = ZOOM_OUT_BTN + let resetText = RESET_BTN + if (buttonColor) { + zoomInText = zoomInText.replace('${fill}', buttonColor) + zoomOutText = zoomOutText.replace('${fill}', buttonColor) + resetText = resetText.replace('${fill}', buttonColor) + } + return { + ...option, + position: PositionType.BOTTOMRIGHT, + name: 'zoom', + zoomInText, + zoomInTitle: 'Zoom in', + zoomOutText, + zoomOutTitle: 'Zoom out', + resetText, + showZoom: false + } as IZoomControlOption + } } export function configL7Zoom(chart: Chart, plot: L7Plot | Scene) { const { basicStyle } = parseJson(chart.customAttr) @@ -1034,7 +1055,7 @@ export function configL7Zoom(chart: Chart, plot: L7Plot | Scene) { return } const plotScene = plot instanceof Scene ? plot : plot.scene - plotScene.once('loaded', () => { + plot.once('loaded', () => { const zoomOptions = { initZoom: plotScene.getZoom(), center: plotScene.getCenter(),