@visactor/vchart 1.8.0-alpha.0 → 1.8.0

package/esm/core/interface.d.ts

@@ -10,9 +10,9 @@ import type { ITheme } from '../theme';
 import type { IComponent } from '../component/interface';
 import type { LayoutCallBack } from '../layout/interface';
 import type { Compiler } from '../compile/compiler';
-import type { IChart } from '../chart/interface';
-import type { IGradientColor, Stage } from '@visactor/vrender-core';
-import type { IThemeColorScheme } from '../theme/color-scheme/interface';
+import type { IChart, IChartSpecInfo } from '../chart/interface';
+import type { Stage } from '@visactor/vrender-core';
+import type { IContainerSize } from '@visactor/vrender-components';
 export type DataLinkSeries = {
     seriesId?: StringOrNumber;
     seriesIndex?: number;
@@ -23,8 +23,8 @@ export type DataLinkAxis = {
 };
 export interface IVChart {
     readonly id: number;
-    renderSync: (morphConfig?: IMorphConfig) => IVChart;
-    renderAsync: (morphConfig?: IMorphConfig) => Promise<IVChart>;
+    renderSync: (morphConfig?: IMorphConfig, resetMediaQuery?: boolean) => IVChart;
+    renderAsync: (morphConfig?: IMorphConfig, resetMediaQuery?: boolean) => Promise<IVChart>;
     updateData: (id: StringOrNumber, data: Datum[] | string, options?: IParserOptions) => Promise<IVChart>;
     updateDataInBatches: (list: {
         id: string;
@@ -32,8 +32,8 @@ export interface IVChart {
         options?: IParserOptions;
     }[]) => Promise<IVChart>;
     updateDataSync: (id: StringOrNumber, data: Datum[], options?: IParserOptions) => IVChart;
-    updateSpec: (spec: ISpec, forceMerge?: boolean, morphConfig?: IMorphConfig) => Promise<IVChart>;
-    updateSpecSync: (spec: ISpec, forceMerge?: boolean, morphConfig?: IMorphConfig) => void;
+    updateSpec: (spec: ISpec, forceMerge?: boolean, morphConfig?: IMorphConfig, resetMediaQuery?: boolean) => Promise<IVChart>;
+    updateSpecSync: (spec: ISpec, forceMerge?: boolean, morphConfig?: IMorphConfig, resetMediaQuery?: boolean) => void;
     updateModelSpecSync: (filter: string | {
         type: string;
         index: number;
@@ -42,6 +42,7 @@ export interface IVChart {
         type: string;
         index: number;
     }, spec: unknown, forceMerge?: boolean, morphConfig?: IMorphConfig) => Promise<IVChart>;
+    updateSpecAndRecompile: (spec: ISpec, forceMerge: boolean, option: IVChartRenderOption) => boolean;
     updateViewBox: (viewBox: IBoundsLike, reRender?: boolean) => IVChart;
     resize: (width: number, height: number) => Promise<IVChart>;
     release: () => void;
@@ -86,12 +87,17 @@ export interface IVChart {
     unregisterFunction: (key: string) => void;
     getFunction: (key: string) => Function | null;
     getFunctionList: () => string[] | null;
+    getSpecInfo: () => IChartSpecInfo;
+    setRuntimeSpec: (spec: any) => void;
+    getSpec: () => any;
+    getCurrentSize: () => IContainerSize;
 }
 export interface IGlobalConfig {
     uniqueTooltip?: boolean;
 }
-export interface IChartLevelTheme {
-    background?: string | IGradientColor;
-    fontFamily?: string;
-    colorScheme?: IThemeColorScheme;
+export interface IVChartRenderOption {
+    morphConfig?: IMorphConfig;
+    transformSpec?: boolean;
+    actionSource?: VChartRenderActionSource;
 }
+export type VChartRenderActionSource = 'render' | 'updateSpec' | 'updateModelSpec' | 'setCurrentTheme' | 'updateSpecAndRecompile';

package/esm/core/interface.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/core/interface.ts"],"names":[],"mappings":"","file":"interface.js","sourcesContent":["import type { DataSet } from '@visactor/vdataset';\n\nimport type { IParserOptions } from '@visactor/vdataset/es/parser';\nimport type {\n  Datum,\n  IMarkStateSpec,\n  IPoint,\n  IRegionQuerier,\n  IShowTooltipOption,\n  ISpec,\n  ITooltipHandler,\n  Maybe,\n  MaybeArray,\n  StringOrNumber\n} from '../typings';\nimport type { IMorphConfig } from '../animation/spec';\nimport type { IBoundsLike } from '@visactor/vutils';\nimport type { EventCallback, EventParams, EventQuery, EventType } from '../event/interface';\nimport type { IMark } from '../mark/interface';\nimport type { ISeries } from '../series/interface/series';\nimport type { ITheme } from '../theme';\nimport type { IComponent } from '../component/interface';\nimport type { LayoutCallBack } from '../layout/interface';\nimport type { Compiler } from '../compile/compiler';\nimport type { IChart } from '../chart/interface';\nimport type { IGradientColor, Stage } from '@visactor/vrender-core';\nimport type { IThemeColorScheme } from '../theme/color-scheme/interface';\n\nexport type DataLinkSeries = {\n  /**\n   * 关联的系列 id\n   * the binding series id\n   */\n  seriesId?: StringOrNumber;\n  /**\n   * 关联的系列索引\n   * the binding series index\n   */\n  seriesIndex?: number;\n};\n\nexport type DataLinkAxis = {\n  /**\n   * 关联的轴 id，目前仅支持直角坐标轴\n   * the binding axis id\n   */\n  axisId?: StringOrNumber;\n  /**\n   * 关联的轴索引，目前仅支持直角坐标轴\n   * the binding axis index\n   */\n  axisIndex?: number;\n};\n\nexport interface IVChart {\n  readonly id: number;\n\n  /**\n   * **同步**渲染图表。\n   * @param morphConfig 图表 morph 动画配置，可选\n   * @returns VChart 实例\n   */\n  renderSync: (morphConfig?: IMorphConfig) => IVChart;\n\n  /**\n   * **异步**渲染图表。\n   * @async\n   * @param morphConfig 图表 morph 动画配置，可选\n   * @returns VChart 实例\n   */\n  renderAsync: (morphConfig?: IMorphConfig) => Promise<IVChart>;\n\n  /**\n   * **异步**更新数据。\n   * @param id 数据 id\n   * @param data 数据值\n   * @param options 数据参数\n   * @returns VChart 实例\n   */\n  updateData: (id: StringOrNumber, data: Datum[] | string, options?: IParserOptions) => Promise<IVChart>;\n\n  /**\n   * **异步**批量更新数据。\n   * @param list 待更新的数据列表\n   * @returns VChart 实例\n   */\n  updateDataInBatches: (list: { id: string; data: Datum[]; options?: IParserOptions }[]) => Promise<IVChart>;\n\n  /**\n   * **同步**更新数据。\n   * @param id 数据 id\n   * @param data 数据值\n   * @param options 数据参数\n   * @returns VChart 实例\n   */\n  updateDataSync: (id: StringOrNumber, data: Datum[], options?: IParserOptions) => IVChart;\n\n  /**\n   * **异步**spec 更新。\n   * @param spec\n   * @param forceMerge\n   * @returns\n   */\n  updateSpec: (spec: ISpec, forceMerge?: boolean, morphConfig?: IMorphConfig) => Promise<IVChart>;\n\n  /**\n   * **同步方法**spec 更新。\n   * @param spec\n   * @param forceMerge\n   * @returns\n   */\n  updateSpecSync: (spec: ISpec, forceMerge?: boolean, morphConfig?: IMorphConfig) => void;\n\n  /**\n   * **同步方法** 模块 spec 更新\n   * @param filter\n   * @param spec\n   * @param forceMerge\n   * @returns\n   * @sync 1.4.0\n   */\n  updateModelSpecSync: (\n    filter: string | { type: string; index: number },\n    spec: unknown,\n    forceMerge?: boolean,\n    morphConfig?: IMorphConfig\n  ) => IVChart;\n\n  /**\n   * **异步方法** 模块 spec 更新\n   * @param filter\n   * @param spec\n   * @param forceMerge\n   * @returns\n   * @sync 1.4.0\n   */\n  updateModelSpec: (\n    filter: string | { type: string; index: number },\n    spec: unknown,\n    forceMerge?: boolean,\n    morphConfig?: IMorphConfig\n  ) => Promise<IVChart>;\n\n  /**\n   * 更新绘制区域。\n   * @param viewBox 绘制区域\n   * @param reRender 是否重新渲染，默认为 true\n   * @returns\n   */\n  updateViewBox: (viewBox: IBoundsLike, reRender?: boolean) => IVChart;\n\n  /**\n   * **异步方法**，图表尺寸更新方法。\n   * @param width 宽度\n   * @param height 高度\n   * @returns VChart 当前实例\n   */\n  resize: (width: number, height: number) => Promise<IVChart>;\n\n  /**\n   * 销毁图表。\n   */\n  release: () => void;\n\n  /**\n   * 事件监听\n   */\n  on: ((eType: EventType, handler: EventCallback<EventParams>) => void) &\n    ((eType: EventType, query: EventQuery, handler: EventCallback<EventParams>) => void);\n  off: (eType: EventType, handler?: EventCallback<EventParams>) => void;\n\n  /**\n   * 更新或设置图元状态。\n   * @param state 状态筛选器\n   * @param filter 筛选器\n   */\n  updateState: (\n    state: Record<string, Omit<IMarkStateSpec<unknown>, 'style'>>,\n    filter?: (series: ISeries, mark: IMark, stateKey: string) => boolean //series + mark 筛选\n  ) => void;\n\n  /**\n   * 更新图元选中状态。\n   * @param datum hover 图元数据\n   * @param filter 筛选器 用来筛选系列与mark\n   * @param region region 筛选器\n   */\n  setSelected: (\n    datum: MaybeArray<any> | null,\n    filter?: (series: ISeries, mark: IMark) => boolean,\n    region?: IRegionQuerier\n  ) => void;\n\n  /**\n   * 更新图元 hover 状态\n   * @param datum hover 图元数据\n   * @param filter 筛选器 用来筛选系列与mark\n   * @param region region 筛选器\n   */\n  setHovered: (\n    datum: MaybeArray<Datum> | null,\n    filter?: (series: ISeries, mark: IMark) => boolean,\n    region?: IRegionQuerier\n  ) => void;\n\n  /**\n   * 获取当前主题，会返回完整的主题配置（只能获取用户通过`setCurrentTheme`方法设置过的主题，默认值为`ThemeManager`统一设置的主题）\n   * */\n  getCurrentTheme: () => ITheme;\n\n  /**\n   * 获取当前主题名称（只能获取用户通过`setCurrentTheme`方法设置过的主题，默认值为`ThemeManager`统一设置的主题）\n   */\n  getCurrentThemeName: () => string;\n\n  /**\n   * **异步方法**， 设置当前主题。\n   * @param name 主题名称\n   * @returns\n   */\n  setCurrentTheme: (name: string) => Promise<IVChart>;\n\n  /**\n   * 自定义 TooltipHandler。\n   * @param tooltipHandler\n   */\n  setTooltipHandler: (tooltipHandler: ITooltipHandler) => void;\n\n  /**\n   * 获取用户定义的 TooltipHandler\n   * @returns ITooltipHandler\n   */\n  getTooltipHandlerByUser: () => ITooltipHandler | undefined;\n\n  /**\n   * 获取 TooltipHandler\n   * @returns\n   */\n  getTooltipHandler: () => ITooltipHandler | undefined;\n\n  /**\n   * 手动调用展示 tooltip\n   * @param datum 原始数据\n   * @param options\n   * @returns\n   */\n  showTooltip: (datum: Datum, options: IShowTooltipOption) => boolean;\n\n  /**\n   * 手动调用，关闭 tooltip\n   * @returns\n   */\n  hideTooltip: () => boolean;\n\n  // 图例相关 api\n  /**\n   * 根据图例组件 id 获取图例数据\n   * @param id 组件 id\n   * @returns\n   */\n  getLegendDataById: (id: string) => Datum[];\n\n  /**\n   * 根据图例组件索引获取图例数据\n   * @param index 图例索引，默认为 0\n   * @returns\n   */\n  getLegendDataByIndex: (index?: number) => Datum[];\n\n  /**\n   * 根据图例组件 id 获取当前图例的选中项\n   * @param id 组件 id\n   * @returns\n   */\n  getLegendSelectedDataById: (id: string) => StringOrNumber[];\n\n  /**\n   * 根据图例组件索引获取当前图例的选中项\n   * @param index 图例索引，默认为 0\n   * @returns\n   */\n  getLegendSelectedDataByIndex: (index?: number) => StringOrNumber[];\n\n  /**\n   * 根据图例组件 id 更新图例选中数据\n   * @param id\n   * @returns\n   */\n  setLegendSelectedDataById: (id: string, selectedData: StringOrNumber[]) => void;\n\n  /**\n   * 根据图例组件索引更新图例选中数据\n   * @param index 图例索引，默认为 0\n   * @returns\n   */\n  setLegendSelectedDataByIndex: (index: number, selectedData: StringOrNumber[]) => void;\n\n  /**\n   * **异步方法**返回一个包含图片展示的 data URI。\n   * @returns data URI\n   */\n  getDataURL: () => Promise<any>;\n\n  /**\n   * **异步方法** 导出图表图片，只支持浏览器端。\n   * @param name 保存的图片名称\n   * @returns\n   */\n  exportImg: (name?: string) => Promise<void>;\n\n  /**\n   * 导出绘制了图表内容的 canvas\n   * @returns HTMLCanvasElement\n   * @since 1.5.2\n   */\n  exportCanvas: () => HTMLCanvasElement | undefined;\n\n  /**\n   * 目前仅支持 node 环境，用于 node 端的图片导出\n   * @returns\n   */\n  getImageBuffer: () => void;\n  /**\n   * 设置自定义布局\n   */\n  setLayout: (layout: LayoutCallBack) => void;\n  /**\n   * 强制重新布局\n   */\n  reLayout: () => void;\n\n  /**\n   * 获取编译器实例\n   * @returns\n   */\n  getCompiler: () => Compiler;\n\n  /**\n   * Get the chart instance\n   * 获取 Chart 图表实例。\n   * @returns Chart 实例\n   */\n  getChart: () => Maybe<IChart>;\n\n  /**\n   * Get the renderer instance.\n   * 获取渲染引擎实例。\n   * @returns the instance of VRender Stage\n   */\n  getStage: () => Stage;\n\n  /**\n   * 获取 canvas dom\n   * @returns HTMLCanvasElement | undefined\n   */\n  getCanvas: () => HTMLCanvasElement | undefined;\n\n  /**\n   * 获取图表的 dom 容器\n   * @returns\n   */\n  getContainer: () => Maybe<HTMLElement>;\n\n  /**\n   * 获取图表所有的组件实例\n   * @returns 组件实例\n   */\n  getComponents: () => IComponent[];\n\n  /**\n   * 获取图表的 DataSet 实例\n   * @returns DataSet 实例\n   */\n  getDataSet: () => Maybe<DataSet>;\n\n  // 数据转换相关的 api\n  /**\n   * Convert the data to coordinate position\n   * @param datum the datum to convert\n   * @param dataLinkInfo the data link info, could be seriesId or seriesIndex, default is { seriesIndex: 0 }\n   * @param isRelativeToCanvas 是否相对画布坐标，默认为 false Whether relative to canvas coordinates, default is false\n   * @returns\n   */\n  convertDatumToPosition: (datum: Datum, dataLinkInfo?: DataLinkSeries, isRelativeToCanvas?: boolean) => IPoint | null;\n\n  /**\n   * Convert the value to coordinate position\n   * @param value number | [number, number], the value to convert\n   * @param dataLinkInfo the data link info, could be seriesId,seriesIndex,axisId,axisIndex\n   * @param isRelativeToCanvas 是否相对画布坐标，默认为 false Whether relative to canvas coordinates, default is false\n   * returns\n   */\n  convertValueToPosition: ((\n    value: StringOrNumber,\n    dataLinkInfo: DataLinkAxis,\n    isRelativeToCanvas?: boolean\n  ) => number | null) &\n    ((\n      value: [StringOrNumber, StringOrNumber],\n      dataLinkInfo: DataLinkSeries,\n      isRelativeToCanvas?: boolean\n    ) => IPoint | null);\n\n  /** 停止正在进行的所有动画 */\n  stopAnimation: () => void;\n\n  /** 暂停正在进行的所有动画 */\n  pauseAnimation: () => void;\n\n  /** 恢复暂停时正在进行的所有动画 */\n  resumeAnimation: () => void;\n\n  /** 注册实例函数 */\n  registerFunction: (key: string, fun: Function) => void;\n\n  /** 注销实例函数 */\n  unregisterFunction: (key: string) => void;\n\n  /** 获取实例函数 */\n  getFunction: (key: string) => Function | null;\n\n  /** 获取实例函数列表 */\n  getFunctionList: () => string[] | null;\n}\n\nexport interface IGlobalConfig {\n  /** 是否全局显示唯一 tooltip */\n  uniqueTooltip?: boolean;\n  /** 是否监测图表 dom 变化自动 release */\n  // TODO\n  // autoRelease?: boolean;\n}\n\n/** 图表层级的主题 */\nexport interface IChartLevelTheme {\n  /** 图表背景色 */\n  background?: string | IGradientColor;\n  /** 图表字体配置 */\n  fontFamily?: string;\n  /** 全局色板 */\n  colorScheme?: IThemeColorScheme;\n}\n"]}
+{"version":3,"sources":["../src/core/interface.ts"],"names":[],"mappings":"","file":"interface.js","sourcesContent":["import type { DataSet } from '@visactor/vdataset';\n\nimport type { IParserOptions } from '@visactor/vdataset/es/parser';\nimport type {\n  Datum,\n  IMarkStateSpec,\n  IPoint,\n  IRegionQuerier,\n  IShowTooltipOption,\n  ISpec,\n  ITooltipHandler,\n  Maybe,\n  MaybeArray,\n  StringOrNumber\n} from '../typings';\nimport type { IMorphConfig } from '../animation/spec';\nimport type { IBoundsLike } from '@visactor/vutils';\nimport type { EventCallback, EventParams, EventQuery, EventType } from '../event/interface';\nimport type { IMark } from '../mark/interface';\nimport type { ISeries } from '../series/interface/series';\nimport type { ITheme } from '../theme';\nimport type { IComponent } from '../component/interface';\nimport type { LayoutCallBack } from '../layout/interface';\nimport type { Compiler } from '../compile/compiler';\nimport type { IChart, IChartSpecInfo } from '../chart/interface';\nimport type { Stage } from '@visactor/vrender-core';\nimport type { IContainerSize } from '@visactor/vrender-components';\n\nexport type DataLinkSeries = {\n  /**\n   * 关联的系列 id\n   * the binding series id\n   */\n  seriesId?: StringOrNumber;\n  /**\n   * 关联的系列索引\n   * the binding series index\n   */\n  seriesIndex?: number;\n};\n\nexport type DataLinkAxis = {\n  /**\n   * 关联的轴 id，目前仅支持直角坐标轴\n   * the binding axis id\n   */\n  axisId?: StringOrNumber;\n  /**\n   * 关联的轴索引，目前仅支持直角坐标轴\n   * the binding axis index\n   */\n  axisIndex?: number;\n};\n\nexport interface IVChart {\n  readonly id: number;\n\n  /**\n   * **同步**渲染图表。\n   * @param morphConfig 图表 morph 动画配置，可选\n   * @returns VChart 实例\n   */\n  renderSync: (morphConfig?: IMorphConfig, resetMediaQuery?: boolean) => IVChart;\n\n  /**\n   * **异步**渲染图表。\n   * @async\n   * @param morphConfig 图表 morph 动画配置，可选\n   * @returns VChart 实例\n   */\n  renderAsync: (morphConfig?: IMorphConfig, resetMediaQuery?: boolean) => Promise<IVChart>;\n\n  /**\n   * **异步**更新数据。\n   * @param id 数据 id\n   * @param data 数据值\n   * @param options 数据参数\n   * @returns VChart 实例\n   */\n  updateData: (id: StringOrNumber, data: Datum[] | string, options?: IParserOptions) => Promise<IVChart>;\n\n  /**\n   * **异步**批量更新数据。\n   * @param list 待更新的数据列表\n   * @returns VChart 实例\n   */\n  updateDataInBatches: (list: { id: string; data: Datum[]; options?: IParserOptions }[]) => Promise<IVChart>;\n\n  /**\n   * **同步**更新数据。\n   * @param id 数据 id\n   * @param data 数据值\n   * @param options 数据参数\n   * @returns VChart 实例\n   */\n  updateDataSync: (id: StringOrNumber, data: Datum[], options?: IParserOptions) => IVChart;\n\n  /**\n   * **异步**spec 更新。\n   * @param spec\n   * @param forceMerge\n   * @returns\n   */\n  updateSpec: (\n    spec: ISpec,\n    forceMerge?: boolean,\n    morphConfig?: IMorphConfig,\n    resetMediaQuery?: boolean\n  ) => Promise<IVChart>;\n\n  /**\n   * **同步方法**spec 更新。\n   * @param spec\n   * @param forceMerge\n   * @returns\n   */\n  updateSpecSync: (spec: ISpec, forceMerge?: boolean, morphConfig?: IMorphConfig, resetMediaQuery?: boolean) => void;\n\n  /**\n   * **同步方法** 模块 spec 更新\n   * @param filter\n   * @param spec\n   * @param forceMerge\n   * @returns\n   * @sync 1.4.0\n   */\n  updateModelSpecSync: (\n    filter: string | { type: string; index: number },\n    spec: unknown,\n    forceMerge?: boolean,\n    morphConfig?: IMorphConfig\n  ) => IVChart;\n\n  /**\n   * **异步方法** 模块 spec 更新\n   * @param filter\n   * @param spec\n   * @param forceMerge\n   * @returns\n   * @sync 1.4.0\n   */\n  updateModelSpec: (\n    filter: string | { type: string; index: number },\n    spec: unknown,\n    forceMerge?: boolean,\n    morphConfig?: IMorphConfig\n  ) => Promise<IVChart>;\n\n  /** 更新 spec 并重新编译（不渲染），返回是否成功 */\n  updateSpecAndRecompile: (spec: ISpec, forceMerge: boolean, option: IVChartRenderOption) => boolean;\n\n  /**\n   * 更新绘制区域。\n   * @param viewBox 绘制区域\n   * @param reRender 是否重新渲染，默认为 true\n   * @returns\n   */\n  updateViewBox: (viewBox: IBoundsLike, reRender?: boolean) => IVChart;\n\n  /**\n   * **异步方法**，图表尺寸更新方法。\n   * @param width 宽度\n   * @param height 高度\n   * @returns VChart 当前实例\n   */\n  resize: (width: number, height: number) => Promise<IVChart>;\n\n  /**\n   * 销毁图表。\n   */\n  release: () => void;\n\n  /**\n   * 事件监听\n   */\n  on: ((eType: EventType, handler: EventCallback<EventParams>) => void) &\n    ((eType: EventType, query: EventQuery, handler: EventCallback<EventParams>) => void);\n  off: (eType: EventType, handler?: EventCallback<EventParams>) => void;\n\n  /**\n   * 更新或设置图元状态。\n   * @param state 状态筛选器\n   * @param filter 筛选器\n   */\n  updateState: (\n    state: Record<string, Omit<IMarkStateSpec<unknown>, 'style'>>,\n    filter?: (series: ISeries, mark: IMark, stateKey: string) => boolean //series + mark 筛选\n  ) => void;\n\n  /**\n   * 更新图元选中状态。\n   * @param datum hover 图元数据\n   * @param filter 筛选器 用来筛选系列与mark\n   * @param region region 筛选器\n   */\n  setSelected: (\n    datum: MaybeArray<any> | null,\n    filter?: (series: ISeries, mark: IMark) => boolean,\n    region?: IRegionQuerier\n  ) => void;\n\n  /**\n   * 更新图元 hover 状态\n   * @param datum hover 图元数据\n   * @param filter 筛选器 用来筛选系列与mark\n   * @param region region 筛选器\n   */\n  setHovered: (\n    datum: MaybeArray<Datum> | null,\n    filter?: (series: ISeries, mark: IMark) => boolean,\n    region?: IRegionQuerier\n  ) => void;\n\n  /**\n   * 获取当前主题，会返回完整的主题配置（只能获取用户通过`setCurrentTheme`方法设置过的主题，默认值为`ThemeManager`统一设置的主题）\n   * */\n  getCurrentTheme: () => ITheme;\n\n  /**\n   * 获取当前主题名称（只能获取用户通过`setCurrentTheme`方法设置过的主题，默认值为`ThemeManager`统一设置的主题）\n   */\n  getCurrentThemeName: () => string;\n\n  /**\n   * **异步方法**， 设置当前主题。\n   * @param name 主题名称\n   * @returns\n   */\n  setCurrentTheme: (name: string) => Promise<IVChart>;\n\n  /**\n   * 自定义 TooltipHandler。\n   * @param tooltipHandler\n   */\n  setTooltipHandler: (tooltipHandler: ITooltipHandler) => void;\n\n  /**\n   * 获取用户定义的 TooltipHandler\n   * @returns ITooltipHandler\n   */\n  getTooltipHandlerByUser: () => ITooltipHandler | undefined;\n\n  /**\n   * 获取 TooltipHandler\n   * @returns\n   */\n  getTooltipHandler: () => ITooltipHandler | undefined;\n\n  /**\n   * 手动调用展示 tooltip\n   * @param datum 原始数据\n   * @param options\n   * @returns\n   */\n  showTooltip: (datum: Datum, options: IShowTooltipOption) => boolean;\n\n  /**\n   * 手动调用，关闭 tooltip\n   * @returns\n   */\n  hideTooltip: () => boolean;\n\n  // 图例相关 api\n  /**\n   * 根据图例组件 id 获取图例数据\n   * @param id 组件 id\n   * @returns\n   */\n  getLegendDataById: (id: string) => Datum[];\n\n  /**\n   * 根据图例组件索引获取图例数据\n   * @param index 图例索引，默认为 0\n   * @returns\n   */\n  getLegendDataByIndex: (index?: number) => Datum[];\n\n  /**\n   * 根据图例组件 id 获取当前图例的选中项\n   * @param id 组件 id\n   * @returns\n   */\n  getLegendSelectedDataById: (id: string) => StringOrNumber[];\n\n  /**\n   * 根据图例组件索引获取当前图例的选中项\n   * @param index 图例索引，默认为 0\n   * @returns\n   */\n  getLegendSelectedDataByIndex: (index?: number) => StringOrNumber[];\n\n  /**\n   * 根据图例组件 id 更新图例选中数据\n   * @param id\n   * @returns\n   */\n  setLegendSelectedDataById: (id: string, selectedData: StringOrNumber[]) => void;\n\n  /**\n   * 根据图例组件索引更新图例选中数据\n   * @param index 图例索引，默认为 0\n   * @returns\n   */\n  setLegendSelectedDataByIndex: (index: number, selectedData: StringOrNumber[]) => void;\n\n  /**\n   * **异步方法**返回一个包含图片展示的 data URI。\n   * @returns data URI\n   */\n  getDataURL: () => Promise<any>;\n\n  /**\n   * **异步方法** 导出图表图片，只支持浏览器端。\n   * @param name 保存的图片名称\n   * @returns\n   */\n  exportImg: (name?: string) => Promise<void>;\n\n  /**\n   * 导出绘制了图表内容的 canvas\n   * @returns HTMLCanvasElement\n   * @since 1.5.2\n   */\n  exportCanvas: () => HTMLCanvasElement | undefined;\n\n  /**\n   * 目前仅支持 node 环境，用于 node 端的图片导出\n   * @returns\n   */\n  getImageBuffer: () => void;\n  /**\n   * 设置自定义布局\n   */\n  setLayout: (layout: LayoutCallBack) => void;\n  /**\n   * 强制重新布局\n   */\n  reLayout: () => void;\n\n  /**\n   * 获取编译器实例\n   * @returns\n   */\n  getCompiler: () => Compiler;\n\n  /**\n   * Get the chart instance\n   * 获取 Chart 图表实例。\n   * @returns Chart 实例\n   */\n  getChart: () => Maybe<IChart>;\n\n  /**\n   * Get the renderer instance.\n   * 获取渲染引擎实例。\n   * @returns the instance of VRender Stage\n   */\n  getStage: () => Stage;\n\n  /**\n   * 获取 canvas dom\n   * @returns HTMLCanvasElement | undefined\n   */\n  getCanvas: () => HTMLCanvasElement | undefined;\n\n  /**\n   * 获取图表的 dom 容器\n   * @returns\n   */\n  getContainer: () => Maybe<HTMLElement>;\n\n  /**\n   * 获取图表所有的组件实例\n   * @returns 组件实例\n   */\n  getComponents: () => IComponent[];\n\n  /**\n   * 获取图表的 DataSet 实例\n   * @returns DataSet 实例\n   */\n  getDataSet: () => Maybe<DataSet>;\n\n  // 数据转换相关的 api\n  /**\n   * Convert the data to coordinate position\n   * @param datum the datum to convert\n   * @param dataLinkInfo the data link info, could be seriesId or seriesIndex, default is { seriesIndex: 0 }\n   * @param isRelativeToCanvas 是否相对画布坐标，默认为 false Whether relative to canvas coordinates, default is false\n   * @returns\n   */\n  convertDatumToPosition: (datum: Datum, dataLinkInfo?: DataLinkSeries, isRelativeToCanvas?: boolean) => IPoint | null;\n\n  /**\n   * Convert the value to coordinate position\n   * @param value number | [number, number], the value to convert\n   * @param dataLinkInfo the data link info, could be seriesId,seriesIndex,axisId,axisIndex\n   * @param isRelativeToCanvas 是否相对画布坐标，默认为 false Whether relative to canvas coordinates, default is false\n   * returns\n   */\n  convertValueToPosition: ((\n    value: StringOrNumber,\n    dataLinkInfo: DataLinkAxis,\n    isRelativeToCanvas?: boolean\n  ) => number | null) &\n    ((\n      value: [StringOrNumber, StringOrNumber],\n      dataLinkInfo: DataLinkSeries,\n      isRelativeToCanvas?: boolean\n    ) => IPoint | null);\n\n  /** 停止正在进行的所有动画 */\n  stopAnimation: () => void;\n\n  /** 暂停正在进行的所有动画 */\n  pauseAnimation: () => void;\n\n  /** 恢复暂停时正在进行的所有动画 */\n  resumeAnimation: () => void;\n\n  /** 注册实例函数 */\n  registerFunction: (key: string, fun: Function) => void;\n\n  /** 注销实例函数 */\n  unregisterFunction: (key: string) => void;\n\n  /** 获取实例函数 */\n  getFunction: (key: string) => Function | null;\n\n  /** 获取实例函数列表 */\n  getFunctionList: () => string[] | null;\n\n  /** 获取图表 spec 详细信息 */\n  getSpecInfo: () => IChartSpecInfo;\n\n  /** 设置运行时 spec */\n  setRuntimeSpec: (spec: any) => void;\n\n  /** 获取运行时 spec */\n  getSpec: () => any;\n\n  /** 获取当前容器宽高 */\n  getCurrentSize: () => IContainerSize;\n}\n\nexport interface IGlobalConfig {\n  /** 是否全局显示唯一 tooltip */\n  uniqueTooltip?: boolean;\n  /** 是否监测图表 dom 变化自动 release */\n  // TODO\n  // autoRelease?: boolean;\n}\n\nexport interface IVChartRenderOption {\n  /** morphing 动画 spec */\n  morphConfig?: IMorphConfig;\n  /** 是否重新转换图表 spec */\n  transformSpec?: boolean;\n  actionSource?: VChartRenderActionSource;\n}\n\nexport type VChartRenderActionSource =\n  | 'render'\n  | 'updateSpec'\n  | 'updateModelSpec'\n  | 'setCurrentTheme'\n  | 'updateSpecAndRecompile';\n"]}

package/esm/core/vchart.d.ts

@@ -2,7 +2,7 @@ import type { ISeries } from '../series/interface/series';
 import type { ILayoutConstructor, LayoutCallBack } from '../layout/interface';
 import type { IDataValues, IMarkStateSpec, IInitOption } from '../typings/spec/common';
 import type { ISeriesConstructor } from '../series/interface';
-import type { DimensionIndexOption, IChart, IChartConstructor } from '../chart/interface';
+import type { DimensionIndexOption, IChart, IChartConstructor, IChartSpecInfo } from '../chart/interface';
 import type { IComponentConstructor } from '../component/interface';
 import type { EventCallback, EventParams, EventQuery, EventType } from '../event/interface';
 import type { IParserOptions } from '@visactor/vdataset/es/parser';
@@ -20,7 +20,7 @@ import type { ITheme } from '../theme';
 import type { IModel, IUpdateSpecResult } from '../model/interface';
 import { Compiler } from '../compile/compiler';
 import type { IMorphConfig } from '../animation/spec';
-import type { DataLinkAxis, DataLinkSeries, IGlobalConfig, IVChart } from './interface';
+import type { DataLinkAxis, DataLinkSeries, IGlobalConfig, IVChart, IVChartRenderOption } from './interface';
 import { InstanceManager } from './instance-manager';
 export declare class VChart implements IVChart {
     readonly id: number;
@@ -46,9 +46,14 @@ export declare class VChart implements IVChart {
     static readonly Utils: {
         measureText: (text: string, textSpec?: Partial<import("@visactor/vrender-core").ITextGraphicAttribute>, option?: Partial<import("@visactor/vutils").ITextMeasureOption>, useNaiveCanvas?: boolean) => import("@visactor/vutils").ITextSize;
     };
+    protected _originalSpec: any;
     protected _spec: any;
+    getSpec(): any;
+    protected _specInfo: IChartSpecInfo;
+    getSpecInfo(): IChartSpecInfo;
     private _viewBox;
     private _chart;
+    private _chartSpecTransformer;
     private _compiler;
     private _event;
     private _userEvents;
@@ -60,29 +65,41 @@ export declare class VChart implements IVChart {
     private _stage?;
     private _autoSize;
     private _option;
-    private _curSize;
+    private _currentSize;
     private _observer;
     private _currentThemeName;
     private _currentTheme;
     private _onError?;
     private _context;
     private _isReleased;
+    private _chartPlugin?;
     constructor(spec: ISpec, options: IInitOption);
-    private _setSpec;
+    private _setNewSpec;
+    private _getSpecFromOriginalSpec;
+    private _initChartSpec;
+    private _updateSpecInfo;
     private _initChart;
     private _releaseData;
     private _bindVGrammarViewEvent;
     private _bindResizeEvent;
     private _unBindResizeEvent;
-    private _getCurSize;
+    getCurrentSize(): {
+        width: any;
+        height: any;
+    };
     private _doResize;
     private _onResize;
     private _initDataSet;
-    updateCustomConfigAndRerender(modifyConfig: () => IUpdateSpecResult | undefined, morphConfig?: IMorphConfig): Promise<IVChart>;
-    updateCustomConfigAndRerenderSync(modifyConfig: () => IUpdateSpecResult | undefined, morphConfig?: IMorphConfig): IVChart;
+    updateCustomConfigAndRerender(updateSpecResult: IUpdateSpecResult | (() => IUpdateSpecResult), sync?: boolean, option?: IVChartRenderOption): IVChart | Promise<IVChart>;
+    protected _updateCustomConfigAndRecompile(updateSpecResult: IUpdateSpecResult, option?: IVChartRenderOption): boolean;
     protected _reCompile(updateResult: IUpdateSpecResult): void;
+    protected _beforeRender(option?: IVChartRenderOption): boolean;
+    protected _afterRender(): boolean;
     renderSync(morphConfig?: IMorphConfig): IVChart;
     renderAsync(morphConfig?: IMorphConfig): Promise<IVChart>;
+    protected _renderSync(option?: IVChartRenderOption): IVChart;
+    protected _renderAsync(option?: IVChartRenderOption): Promise<IVChart>;
+    private _updateAnimateState;
     release(): void;
     updateData(id: StringOrNumber, data: DataView | Datum[] | string, options?: IParserOptions): Promise<IVChart>;
     updateDataInBatches(list: {
@@ -95,6 +112,8 @@ export declare class VChart implements IVChart {
     updateFullData(data: IDataValues | IDataValues[], reRender?: boolean): Promise<IVChart>;
     updateSpec(spec: ISpec, forceMerge?: boolean, morphConfig?: IMorphConfig): Promise<IVChart>;
     updateSpecSync(spec: ISpec, forceMerge?: boolean, morphConfig?: IMorphConfig): IVChart;
+    updateSpecAndRecompile(spec: ISpec, forceMerge?: boolean, option?: IVChartRenderOption): boolean;
+    private _updateSpec;
     updateModelSpec(filter: string | {
         type: string;
         index: number;
@@ -119,6 +138,7 @@ export declare class VChart implements IVChart {
     getCurrentThemeName(): string;
     setCurrentTheme(name: string): Promise<IVChart>;
     setCurrentThemeSync(name: string): IVChart;
+    protected _setCurrentTheme(name?: string): IUpdateSpecResult;
     private _getTooltipComponent;
     setTooltipHandler(tooltipHandler: ITooltipHandler): void;
     getTooltipHandlerByUser(): ITooltipHandler | undefined;
@@ -154,5 +174,8 @@ export declare class VChart implements IVChart {
     registerFunction(key: string, fun: Function): void;
     unregisterFunction(key: string): void;
     getFunctionList(): string[];
+    setRuntimeSpec(spec: any): void;
+    private _initChartPlugin;
+    private _chartPluginApply;
 }
 export declare const registerVChartCore: () => void;