From cd51e8ade92ab180c867bbbc48079a069493bf56 Mon Sep 17 00:00:00 2001 From: zhouxinyu Date: Mon, 15 Jul 2024 17:19:32 +0800 Subject: [PATCH] fix: fix issue with chart isBaseOpacity attr --- .../vchart/charts/area/areaDisappear.ts | 11 +++++--- .../vchart/charts/bar/barDisappear.ts | 11 +++++--- .../charts/character/characterDisappear.ts | 11 +++++--- .../vchart/charts/common/commonDisappear.ts | 27 +++++++++++++++++++ .../vchart/charts/line/lineDisappear.ts | 11 +++++--- .../vchart/charts/pie/pieDisappear.ts | 11 +++++--- .../vchart/charts/radar/radarDisappear.ts | 11 +++++--- .../vchart/charts/rose/roseDisappear.ts | 11 +++++--- .../vchart/charts/scatter/scatterDisappear.ts | 11 +++++--- .../charts/sunburst/sunburstDisappear.ts | 11 +++++--- .../vchart/charts/treeMap/treeMapDisappear.ts | 11 +++++--- .../charts/wordCloud/wordCloudDisappear.ts | 11 +++++--- packages/vstory/src/dsl/types/chart/appear.ts | 1 + 13 files changed, 116 insertions(+), 33 deletions(-) diff --git a/packages/vstory/src/dsl/story-processor/vchart/charts/area/areaDisappear.ts b/packages/vstory/src/dsl/story-processor/vchart/charts/area/areaDisappear.ts index 1e80d5a0..fcc455a0 100644 --- a/packages/vstory/src/dsl/story-processor/vchart/charts/area/areaDisappear.ts +++ b/packages/vstory/src/dsl/story-processor/vchart/charts/area/areaDisappear.ts @@ -1,15 +1,20 @@ -import VChart, { ISpec } from '@visactor/vchart'; -import { IChartAppearAction } from '../../../../types/chart/appear'; -import { ICharacterVisactor } from '../../../../../story/character/visactor/interface'; +import type { ISpec } from '@visactor/vchart'; +import type VChart from '@visactor/vchart'; +import type { IChartAppearAction } from '../../../../types/chart/appear'; +import type { ICharacterVisactor } from '../../../../../story/character/visactor/interface'; import { axesDisappearProcessor, titleDisappearProcessor } from '../../components'; import { areaDisappearProcessor as areaMarkDisappearProcessor } from '../../marks'; import { graphicDisappearProcessor } from '../../../graphic/disappear'; +import { commonDisappearByBaseOpacity } from '../common/commonDisappear'; export const areaDisappearProcessor = async ( chartInstance: ICharacterVisactor, spec: ISpec, action: IChartAppearAction ) => { + if (commonDisappearByBaseOpacity(chartInstance, spec, action)) { + return; + } const chart = chartInstance.getGraphicParent(); const vchart = chart?._vchart; const instance: VChart = vchart ? vchart : chartInstance; diff --git a/packages/vstory/src/dsl/story-processor/vchart/charts/bar/barDisappear.ts b/packages/vstory/src/dsl/story-processor/vchart/charts/bar/barDisappear.ts index 4578d717..93253ae8 100644 --- a/packages/vstory/src/dsl/story-processor/vchart/charts/bar/barDisappear.ts +++ b/packages/vstory/src/dsl/story-processor/vchart/charts/bar/barDisappear.ts @@ -1,16 +1,21 @@ -import VChart, { ISpec } from '@visactor/vchart'; -import { IChartAppearAction } from '../../../../types/chart/appear'; -import { ICharacterVisactor } from '../../../../../story/character/visactor/interface'; +import type { ISpec } from '@visactor/vchart'; +import type VChart from '@visactor/vchart'; +import type { IChartAppearAction } from '../../../../types/chart/appear'; +import type { ICharacterVisactor } from '../../../../../story/character/visactor/interface'; import { axesDisappearProcessor, titleDisappearProcessor } from '../../components'; import { rectDisappearProcessor } from '../../marks'; import { graphicDisappearProcessor } from '../../../graphic/disappear'; +import { commonDisappearByBaseOpacity } from '../common/commonDisappear'; export const barDisappearProcessor = async ( chartInstance: ICharacterVisactor, spec: ISpec, action: IChartAppearAction ) => { + if (commonDisappearByBaseOpacity(chartInstance, spec, action)) { + return; + } const chart = chartInstance.getGraphicParent(); const vchart = chart?._vchart; const instance: VChart = vchart ? vchart : chartInstance; diff --git a/packages/vstory/src/dsl/story-processor/vchart/charts/character/characterDisappear.ts b/packages/vstory/src/dsl/story-processor/vchart/charts/character/characterDisappear.ts index 6108d863..856e45e6 100644 --- a/packages/vstory/src/dsl/story-processor/vchart/charts/character/characterDisappear.ts +++ b/packages/vstory/src/dsl/story-processor/vchart/charts/character/characterDisappear.ts @@ -1,13 +1,18 @@ -import VChart, { ISpec } from '@visactor/vchart'; -import { IChartAppearAction } from '../../../../types/chart/appear'; -import { ICharacterVisactor } from '../../../../../story/character/visactor/interface'; +import type { ISpec } from '@visactor/vchart'; +import type VChart from '@visactor/vchart'; +import type { IChartAppearAction } from '../../../../types/chart/appear'; +import type { ICharacterVisactor } from '../../../../../story/character/visactor/interface'; import { graphicDisappearProcessor } from '../../../graphic/disappear'; +import { commonDisappearByBaseOpacity } from '../common/commonDisappear'; export const characterDisappearProcessor = async ( chartInstance: ICharacterVisactor, spec: ISpec, action: IChartAppearAction ) => { + if (commonDisappearByBaseOpacity(chartInstance, spec, action)) { + return; + } const chart = chartInstance.getGraphicParent(); const vchart = chart?._vchart; const instance: VChart = vchart ? vchart : chartInstance; diff --git a/packages/vstory/src/dsl/story-processor/vchart/charts/common/commonDisappear.ts b/packages/vstory/src/dsl/story-processor/vchart/charts/common/commonDisappear.ts index cd50b062..3ddab905 100644 --- a/packages/vstory/src/dsl/story-processor/vchart/charts/common/commonDisappear.ts +++ b/packages/vstory/src/dsl/story-processor/vchart/charts/common/commonDisappear.ts @@ -10,6 +10,7 @@ import { lineDisappearProcessor as lineMarkDisappearProcessor, areaDisappearProcessor as areaMarkDisappearProcessor } from '../../marks'; +import type { EasingType } from '@visactor/vrender-core'; export const commonDisappearProcessor = async ( chartInstance: ICharacterVisactor, @@ -39,3 +40,29 @@ export const commonDisappearProcessor = async ( visible: false }); }; +export const commonDisappearByBaseOpacity = ( + chartInstance: ICharacterVisactor, + spec: ISpec, + action: IChartAppearAction +) => { + const chart = chartInstance.getGraphicParent(); + const vchart = chart?._vchart; + const instance: VChart = vchart ? vchart : chartInstance; + + if (!instance) { + return; + } + + const duration = action.payload.animation?.duration; + const easing = action.payload.animation?.easing; + + if (action.payload.fade?.isBaseOpacity) { + chart.setAttributes({ + baseOpacity: 1 + }); + + chart.animate().to({ baseOpacity: 0 }, duration, easing as EasingType); + return true; + } + return false; +}; diff --git a/packages/vstory/src/dsl/story-processor/vchart/charts/line/lineDisappear.ts b/packages/vstory/src/dsl/story-processor/vchart/charts/line/lineDisappear.ts index 925b455c..e8458ab4 100644 --- a/packages/vstory/src/dsl/story-processor/vchart/charts/line/lineDisappear.ts +++ b/packages/vstory/src/dsl/story-processor/vchart/charts/line/lineDisappear.ts @@ -1,16 +1,21 @@ -import VChart, { ISpec } from '@visactor/vchart'; -import { IChartAppearAction } from '../../../../types/chart/appear'; -import { ICharacterVisactor } from '../../../../../story/character/visactor/interface'; +import type { ISpec } from '@visactor/vchart'; +import type VChart from '@visactor/vchart'; +import type { IChartAppearAction } from '../../../../types/chart/appear'; +import type { ICharacterVisactor } from '../../../../../story/character/visactor/interface'; import { axesDisappearProcessor, titleDisappearProcessor } from '../../components'; import { lineDisappearProcessor as lineMarkDisappearProcessor } from '../../marks'; import { graphicDisappearProcessor } from '../../../graphic/disappear'; +import { commonDisappearByBaseOpacity } from '../common/commonDisappear'; export const lineDisappearProcessor = async ( chartInstance: ICharacterVisactor, spec: ISpec, action: IChartAppearAction ) => { + if (commonDisappearByBaseOpacity(chartInstance, spec, action)) { + return; + } const chart = chartInstance.getGraphicParent(); const vchart = chart?._vchart; const instance: VChart = vchart ? vchart : chartInstance; diff --git a/packages/vstory/src/dsl/story-processor/vchart/charts/pie/pieDisappear.ts b/packages/vstory/src/dsl/story-processor/vchart/charts/pie/pieDisappear.ts index 0916aab3..22664f50 100644 --- a/packages/vstory/src/dsl/story-processor/vchart/charts/pie/pieDisappear.ts +++ b/packages/vstory/src/dsl/story-processor/vchart/charts/pie/pieDisappear.ts @@ -1,16 +1,21 @@ -import VChart, { ISpec } from '@visactor/vchart'; -import { IChartAppearAction } from '../../../../types/chart/appear'; -import { ICharacterVisactor } from '../../../../../story/character/visactor/interface'; +import type { ISpec } from '@visactor/vchart'; +import type VChart from '@visactor/vchart'; +import type { IChartAppearAction } from '../../../../types/chart/appear'; +import type { ICharacterVisactor } from '../../../../../story/character/visactor/interface'; import { axesDisappearProcessor, titleDisappearProcessor } from '../../components'; import { arcDisappearProcessor } from '../../marks'; import { graphicDisappearProcessor } from '../../../graphic/disappear'; +import { commonDisappearByBaseOpacity } from '../common/commonDisappear'; export const pieDisappearProcessor = async ( chartInstance: ICharacterVisactor, spec: ISpec, action: IChartAppearAction ) => { + if (commonDisappearByBaseOpacity(chartInstance, spec, action)) { + return; + } const chart = chartInstance.getGraphicParent(); const vchart = chart?._vchart; const instance: VChart = vchart ? vchart : chartInstance; diff --git a/packages/vstory/src/dsl/story-processor/vchart/charts/radar/radarDisappear.ts b/packages/vstory/src/dsl/story-processor/vchart/charts/radar/radarDisappear.ts index 278fcd4c..7c92397f 100644 --- a/packages/vstory/src/dsl/story-processor/vchart/charts/radar/radarDisappear.ts +++ b/packages/vstory/src/dsl/story-processor/vchart/charts/radar/radarDisappear.ts @@ -1,15 +1,20 @@ -import VChart, { ISpec } from '@visactor/vchart'; -import { IChartAppearAction } from '../../../../types/chart/appear'; -import { ICharacterVisactor } from '../../../../../story/character/visactor/interface'; +import type { ISpec } from '@visactor/vchart'; +import type VChart from '@visactor/vchart'; +import type { IChartAppearAction } from '../../../../types/chart/appear'; +import type { ICharacterVisactor } from '../../../../../story/character/visactor/interface'; import { axesDisappearProcessor, titleDisappearProcessor } from '../../components'; import { areaDisappearProcessor, lineDisappearProcessor, symbolDisappearProcessor } from '../../marks'; import { graphicDisappearProcessor } from '../../../graphic/disappear'; +import { commonDisappearByBaseOpacity } from '../common/commonDisappear'; export const radarDisappearProcessor = async ( chartInstance: ICharacterVisactor, spec: ISpec, action: IChartAppearAction ) => { + if (commonDisappearByBaseOpacity(chartInstance, spec, action)) { + return; + } const chart = chartInstance.getGraphicParent(); const vchart = chart?._vchart; const instance: VChart = vchart ? vchart : chartInstance; diff --git a/packages/vstory/src/dsl/story-processor/vchart/charts/rose/roseDisappear.ts b/packages/vstory/src/dsl/story-processor/vchart/charts/rose/roseDisappear.ts index eeeedcfd..ee48fc0a 100644 --- a/packages/vstory/src/dsl/story-processor/vchart/charts/rose/roseDisappear.ts +++ b/packages/vstory/src/dsl/story-processor/vchart/charts/rose/roseDisappear.ts @@ -1,16 +1,21 @@ -import VChart, { ISpec } from '@visactor/vchart'; -import { IChartAppearAction } from '../../../../types/chart/appear'; -import { ICharacterVisactor } from '../../../../../story/character/visactor/interface'; +import type { ISpec } from '@visactor/vchart'; +import type VChart from '@visactor/vchart'; +import type { IChartAppearAction } from '../../../../types/chart/appear'; +import type { ICharacterVisactor } from '../../../../../story/character/visactor/interface'; import { axesDisappearProcessor, titleDisappearProcessor } from '../../components'; import { arcDisappearProcessor } from '../../marks'; import { graphicDisappearProcessor } from '../../../graphic/disappear'; +import { commonDisappearByBaseOpacity } from '../common/commonDisappear'; export const roseDisappearProcessor = async ( chartInstance: ICharacterVisactor, spec: ISpec, action: IChartAppearAction ) => { + if (commonDisappearByBaseOpacity(chartInstance, spec, action)) { + return; + } const chart = chartInstance.getGraphicParent(); const vchart = chart?._vchart; const instance: VChart = vchart ? vchart : chartInstance; diff --git a/packages/vstory/src/dsl/story-processor/vchart/charts/scatter/scatterDisappear.ts b/packages/vstory/src/dsl/story-processor/vchart/charts/scatter/scatterDisappear.ts index aa98fc0f..bdc259c7 100644 --- a/packages/vstory/src/dsl/story-processor/vchart/charts/scatter/scatterDisappear.ts +++ b/packages/vstory/src/dsl/story-processor/vchart/charts/scatter/scatterDisappear.ts @@ -1,15 +1,20 @@ -import VChart, { ISpec } from '@visactor/vchart'; -import { IChartAppearAction } from '../../../../types/chart/appear'; -import { ICharacterVisactor } from '../../../../../story/character/visactor/interface'; +import type { ISpec } from '@visactor/vchart'; +import type VChart from '@visactor/vchart'; +import type { IChartAppearAction } from '../../../../types/chart/appear'; +import type { ICharacterVisactor } from '../../../../../story/character/visactor/interface'; import { axesDisappearProcessor, titleDisappearProcessor } from '../../components'; import { symbolDisappearProcessor } from '../../marks'; import { graphicDisappearProcessor } from '../../../graphic/disappear'; +import { commonDisappearByBaseOpacity } from '../common/commonDisappear'; export const scatterDisappearProcessor = async ( chartInstance: ICharacterVisactor, spec: ISpec, action: IChartAppearAction ) => { + if (commonDisappearByBaseOpacity(chartInstance, spec, action)) { + return; + } const chart = chartInstance.getGraphicParent(); const vchart = chart?._vchart; const instance: VChart = vchart ? vchart : chartInstance; diff --git a/packages/vstory/src/dsl/story-processor/vchart/charts/sunburst/sunburstDisappear.ts b/packages/vstory/src/dsl/story-processor/vchart/charts/sunburst/sunburstDisappear.ts index ee4012ac..f5bac77e 100644 --- a/packages/vstory/src/dsl/story-processor/vchart/charts/sunburst/sunburstDisappear.ts +++ b/packages/vstory/src/dsl/story-processor/vchart/charts/sunburst/sunburstDisappear.ts @@ -1,15 +1,20 @@ -import VChart, { ISpec } from '@visactor/vchart'; -import { IChartAppearAction } from '../../../../types/chart/appear'; -import { ICharacterVisactor } from '../../../../../story/character/visactor/interface'; +import type { ISpec } from '@visactor/vchart'; +import type VChart from '@visactor/vchart'; +import type { IChartAppearAction } from '../../../../types/chart/appear'; +import type { ICharacterVisactor } from '../../../../../story/character/visactor/interface'; import { axesDisappearProcessor, titleDisappearProcessor } from '../../components'; import { arcDisappearProcessor, rectDisappearProcessor } from '../../marks'; import { graphicDisappearProcessor } from '../../../graphic/disappear'; +import { commonDisappearByBaseOpacity } from '../common/commonDisappear'; export const sunburstDisappearProcessor = async ( chartInstance: ICharacterVisactor, spec: ISpec, action: IChartAppearAction ) => { + if (commonDisappearByBaseOpacity(chartInstance, spec, action)) { + return; + } const chart = chartInstance.getGraphicParent(); const vchart = chart?._vchart; const instance: VChart = vchart ? vchart : chartInstance; diff --git a/packages/vstory/src/dsl/story-processor/vchart/charts/treeMap/treeMapDisappear.ts b/packages/vstory/src/dsl/story-processor/vchart/charts/treeMap/treeMapDisappear.ts index 3030320a..9c6db84b 100644 --- a/packages/vstory/src/dsl/story-processor/vchart/charts/treeMap/treeMapDisappear.ts +++ b/packages/vstory/src/dsl/story-processor/vchart/charts/treeMap/treeMapDisappear.ts @@ -1,15 +1,20 @@ -import VChart, { ISpec } from '@visactor/vchart'; -import { IChartAppearAction } from '../../../../types/chart/appear'; -import { ICharacterVisactor } from '../../../../../story/character/visactor/interface'; +import type { ISpec } from '@visactor/vchart'; +import type VChart from '@visactor/vchart'; +import type { IChartAppearAction } from '../../../../types/chart/appear'; +import type { ICharacterVisactor } from '../../../../../story/character/visactor/interface'; import { axesDisappearProcessor, titleDisappearProcessor } from '../../components'; import { rectDisappearProcessor } from '../../marks'; import { graphicDisappearProcessor } from '../../../graphic/disappear'; +import { commonDisappearByBaseOpacity } from '../common/commonDisappear'; export const treeMapDisappearProcessor = async ( chartInstance: ICharacterVisactor, spec: ISpec, action: IChartAppearAction ) => { + if (commonDisappearByBaseOpacity(chartInstance, spec, action)) { + return; + } const chart = chartInstance.getGraphicParent(); const vchart = chart?._vchart; const instance: VChart = vchart ? vchart : chartInstance; diff --git a/packages/vstory/src/dsl/story-processor/vchart/charts/wordCloud/wordCloudDisappear.ts b/packages/vstory/src/dsl/story-processor/vchart/charts/wordCloud/wordCloudDisappear.ts index d44afa5b..1407511d 100644 --- a/packages/vstory/src/dsl/story-processor/vchart/charts/wordCloud/wordCloudDisappear.ts +++ b/packages/vstory/src/dsl/story-processor/vchart/charts/wordCloud/wordCloudDisappear.ts @@ -1,15 +1,20 @@ -import VChart, { ISpec } from '@visactor/vchart'; -import { IChartAppearAction } from '../../../../types/chart/appear'; -import { ICharacterVisactor } from '../../../../../story/character/visactor/interface'; +import type { ISpec } from '@visactor/vchart'; +import type VChart from '@visactor/vchart'; +import type { IChartAppearAction } from '../../../../types/chart/appear'; +import type { ICharacterVisactor } from '../../../../../story/character/visactor/interface'; import { axesDisappearProcessor, titleDisappearProcessor } from '../../components'; import { textDisappearProcessor } from '../../marks'; import { graphicDisappearProcessor } from '../../../graphic/disappear'; +import { commonDisappearByBaseOpacity } from '../common/commonDisappear'; export const wordCloudDisappearProcessor = async ( chartInstance: ICharacterVisactor, spec: ISpec, action: IChartAppearAction ) => { + if (commonDisappearByBaseOpacity(chartInstance, spec, action)) { + return; + } const chart = chartInstance.getGraphicParent(); const vchart = chart?._vchart; const instance: VChart = vchart ? vchart : chartInstance; diff --git a/packages/vstory/src/dsl/types/chart/appear.ts b/packages/vstory/src/dsl/types/chart/appear.ts index 33ea46e6..dbfbe670 100644 --- a/packages/vstory/src/dsl/types/chart/appear.ts +++ b/packages/vstory/src/dsl/types/chart/appear.ts @@ -10,6 +10,7 @@ export interface IChartAppearPayLoad extends IActionPayload { */ effect: string; }; + fade?: { isBaseOpacity?: boolean }; } export interface IChartAppearAction extends IAction {