@visactor/vchart 1.13.21-alpha.1 → 1.13.21-alpha.3

package/cjs/plugin/chart/index.d.ts

@@ -1,3 +1,4 @@
 export * from './media-query';
 export * from './formatter';
 export * from './register';
+export * from './scroll';

package/cjs/plugin/chart/index.js

@@ -18,5 +18,5 @@ var __createBinding = this && this.__createBinding || (Object.create ? function(
 Object.defineProperty(exports, "__esModule", {
     value: !0
 }), __exportStar(require("./media-query"), exports), __exportStar(require("./formatter"), exports), 
-__exportStar(require("./register"), exports);
+__exportStar(require("./register"), exports), __exportStar(require("./scroll"), exports);
 //# sourceMappingURL=index.js.map

package/cjs/plugin/chart/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/plugin/chart/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,gDAA8B;AAC9B,8CAA4B;AAC5B,6CAA2B","file":"index.js","sourcesContent":["export * from './media-query';\nexport * from './formatter';\nexport * from './register';\n"]}
+{"version":3,"sources":["../src/plugin/chart/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,gDAA8B;AAC9B,8CAA4B;AAC5B,6CAA2B;AAC3B,2CAAyB","file":"index.js","sourcesContent":["export * from './media-query';\nexport * from './formatter';\nexport * from './register';\nexport * from './scroll';\n"]}

package/cjs/plugin/chart/plugin-service.d.ts

@@ -6,6 +6,7 @@ import type { IChartSpecInfo } from '../../chart/interface/common';
 export declare class ChartPluginService<T extends IChartPlugin = IChartPlugin> extends BasePluginService<T> implements IChartPluginService<T> {
     globalInstance: IVChart;
     constructor(globalInstance: IVChart);
+    getPlugin(name: string): T | undefined;
     onInit(chartSpec: any): void;
     onBeforeResize(width: number, height: number): void;
     onAfterChartSpecTransform(chartSpec: any, actionSource: VChartRenderActionSource): void;

package/cjs/plugin/chart/plugin-service.js

@@ -10,6 +10,9 @@ class ChartPluginService extends base_plugin_service_1.BasePluginService {
     constructor(globalInstance) {
         super(), this.globalInstance = globalInstance;
     }
+    getPlugin(name) {
+        return this._plugins.find((plugin => plugin.name === name));
+    }
     onInit(chartSpec) {
         this._plugins.forEach((plugin => {
             plugin.onInit && plugin.onInit(this, chartSpec);

package/cjs/plugin/chart/plugin-service.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/plugin/chart/plugin-service.ts"],"names":[],"mappings":";;;AAEA,qEAAgE;AAIhE,MAAa,kBACX,SAAQ,uCAAoB;IAK5B,YAAY,cAAuB;QACjC,KAAK,EAAE,CAAC;QACR,IAAI,CAAC,cAAc,GAAG,cAAc,CAAC;IACvC,CAAC;IAED,MAAM,CAAC,SAAc;QACnB,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE;YAC7B,MAAM,CAAC,MAAM,IAAI,MAAM,CAAC,MAAM,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC;QAClD,CAAC,CAAC,CAAC;IACL,CAAC;IAED,cAAc,CAAC,KAAa,EAAE,MAAc;QAC1C,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE;YAC7B,MAAM,CAAC,cAAc,IAAI,MAAM,CAAC,cAAc,CAAC,IAAI,EAAE,KAAK,EAAE,MAAM,CAAC,CAAC;QACtE,CAAC,CAAC,CAAC;IACL,CAAC;IAED,yBAAyB,CAAC,SAAc,EAAE,YAAsC;QAC9E,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE;YAC7B,MAAM,CAAC,yBAAyB,IAAI,MAAM,CAAC,yBAAyB,CAAC,IAAI,EAAE,SAAS,EAAE,YAAY,CAAC,CAAC;QACtG,CAAC,CAAC,CAAC;IACL,CAAC;IAED,yBAAyB,CAAC,SAAc,EAAE,aAA6B,EAAE,YAAsC;QAC7G,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE;YAC7B,MAAM,CAAC,yBAAyB;gBAC9B,MAAM,CAAC,yBAAyB,CAAC,IAAI,EAAE,SAAS,EAAE,aAAa,EAAE,YAAY,CAAC,CAAC;QACnF,CAAC,CAAC,CAAC;IACL,CAAC;IAED,iBAAiB,CAAC,SAAc,EAAE,YAAsC;QACtE,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE;YAC7B,MAAM,CAAC,iBAAiB,IAAI,MAAM,CAAC,iBAAiB,CAAC,IAAI,EAAE,SAAS,EAAE,YAAY,CAAC,CAAC;QACtF,CAAC,CAAC,CAAC;IACL,CAAC;IAED,kBAAkB;QAChB,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE;YAC7B,MAAM,CAAC,kBAAkB,IAAI,MAAM,CAAC,kBAAkB,CAAC,IAAI,CAAC,CAAC;QAC/D,CAAC,CAAC,CAAC;IACL,CAAC;IAED,aAAa;QACX,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE;YAC7B,MAAM,CAAC,aAAa,IAAI,MAAM,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;QACrD,CAAC,CAAC,CAAC;IACL,CAAC;IAED,UAAU;QACR,KAAK,CAAC,UAAU,EAAE,CAAC;QACnB,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC;IAC7B,CAAC;CACF;AA1DD,gDA0DC","file":"plugin-service.js","sourcesContent":["import type { IChartPlugin, IChartPluginService } from './interface';\nimport type { IVChart } from '../../core';\nimport { BasePluginService } from '../base/base-plugin-service';\nimport type { VChartRenderActionSource } from '../../core/interface';\nimport type { IChartSpecInfo } from '../../chart/interface/common';\n\nexport class ChartPluginService<T extends IChartPlugin = IChartPlugin>\n  extends BasePluginService<T>\n  implements IChartPluginService<T>\n{\n  globalInstance: IVChart;\n\n  constructor(globalInstance: IVChart) {\n    super();\n    this.globalInstance = globalInstance;\n  }\n\n  onInit(chartSpec: any) {\n    this._plugins.forEach(plugin => {\n      plugin.onInit && plugin.onInit(this, chartSpec);\n    });\n  }\n\n  onBeforeResize(width: number, height: number) {\n    this._plugins.forEach(plugin => {\n      plugin.onBeforeResize && plugin.onBeforeResize(this, width, height);\n    });\n  }\n\n  onAfterChartSpecTransform(chartSpec: any, actionSource: VChartRenderActionSource) {\n    this._plugins.forEach(plugin => {\n      plugin.onAfterChartSpecTransform && plugin.onAfterChartSpecTransform(this, chartSpec, actionSource);\n    });\n  }\n\n  onAfterModelSpecTransform(chartSpec: any, chartSpecInfo: IChartSpecInfo, actionSource: VChartRenderActionSource) {\n    this._plugins.forEach(plugin => {\n      plugin.onAfterModelSpecTransform &&\n        plugin.onAfterModelSpecTransform(this, chartSpec, chartSpecInfo, actionSource);\n    });\n  }\n\n  onBeforeInitChart(chartSpec: any, actionSource: VChartRenderActionSource) {\n    this._plugins.forEach(plugin => {\n      plugin.onBeforeInitChart && plugin.onBeforeInitChart(this, chartSpec, actionSource);\n    });\n  }\n\n  onLayoutRectUpdate() {\n    this._plugins.forEach(plugin => {\n      plugin.onLayoutRectUpdate && plugin.onLayoutRectUpdate(this);\n    });\n  }\n\n  onAfterRender() {\n    this._plugins.forEach(plugin => {\n      plugin.onAfterRender && plugin.onAfterRender(this);\n    });\n  }\n\n  releaseAll(): void {\n    super.releaseAll();\n    this.globalInstance = null;\n  }\n}\n"]}
+{"version":3,"sources":["../src/plugin/chart/plugin-service.ts"],"names":[],"mappings":";;;AAEA,qEAAgE;AAIhE,MAAa,kBACX,SAAQ,uCAAoB;IAK5B,YAAY,cAAuB;QACjC,KAAK,EAAE,CAAC;QACR,IAAI,CAAC,cAAc,GAAG,cAAc,CAAC;IACvC,CAAC;IAED,SAAS,CAAC,IAAY;QACpB,OAAO,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,IAAI,KAAK,IAAI,CAAC,CAAC;IAC5D,CAAC;IAED,MAAM,CAAC,SAAc;QACnB,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE;YAC7B,MAAM,CAAC,MAAM,IAAI,MAAM,CAAC,MAAM,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC;QAClD,CAAC,CAAC,CAAC;IACL,CAAC;IAED,cAAc,CAAC,KAAa,EAAE,MAAc;QAC1C,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE;YAC7B,MAAM,CAAC,cAAc,IAAI,MAAM,CAAC,cAAc,CAAC,IAAI,EAAE,KAAK,EAAE,MAAM,CAAC,CAAC;QACtE,CAAC,CAAC,CAAC;IACL,CAAC;IAED,yBAAyB,CAAC,SAAc,EAAE,YAAsC;QAC9E,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE;YAC7B,MAAM,CAAC,yBAAyB,IAAI,MAAM,CAAC,yBAAyB,CAAC,IAAI,EAAE,SAAS,EAAE,YAAY,CAAC,CAAC;QACtG,CAAC,CAAC,CAAC;IACL,CAAC;IAED,yBAAyB,CAAC,SAAc,EAAE,aAA6B,EAAE,YAAsC;QAC7G,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE;YAC7B,MAAM,CAAC,yBAAyB;gBAC9B,MAAM,CAAC,yBAAyB,CAAC,IAAI,EAAE,SAAS,EAAE,aAAa,EAAE,YAAY,CAAC,CAAC;QACnF,CAAC,CAAC,CAAC;IACL,CAAC;IAED,iBAAiB,CAAC,SAAc,EAAE,YAAsC;QACtE,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE;YAC7B,MAAM,CAAC,iBAAiB,IAAI,MAAM,CAAC,iBAAiB,CAAC,IAAI,EAAE,SAAS,EAAE,YAAY,CAAC,CAAC;QACtF,CAAC,CAAC,CAAC;IACL,CAAC;IAED,kBAAkB;QAChB,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE;YAC7B,MAAM,CAAC,kBAAkB,IAAI,MAAM,CAAC,kBAAkB,CAAC,IAAI,CAAC,CAAC;QAC/D,CAAC,CAAC,CAAC;IACL,CAAC;IAED,aAAa;QACX,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE;YAC7B,MAAM,CAAC,aAAa,IAAI,MAAM,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;QACrD,CAAC,CAAC,CAAC;IACL,CAAC;IAED,UAAU;QACR,KAAK,CAAC,UAAU,EAAE,CAAC;QACnB,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC;IAC7B,CAAC;CACF;AA9DD,gDA8DC","file":"plugin-service.js","sourcesContent":["import type { IChartPlugin, IChartPluginService } from './interface';\nimport type { IVChart } from '../../core';\nimport { BasePluginService } from '../base/base-plugin-service';\nimport type { VChartRenderActionSource } from '../../core/interface';\nimport type { IChartSpecInfo } from '../../chart/interface/common';\n\nexport class ChartPluginService<T extends IChartPlugin = IChartPlugin>\n  extends BasePluginService<T>\n  implements IChartPluginService<T>\n{\n  globalInstance: IVChart;\n\n  constructor(globalInstance: IVChart) {\n    super();\n    this.globalInstance = globalInstance;\n  }\n\n  getPlugin(name: string): T | undefined {\n    return this._plugins.find(plugin => plugin.name === name);\n  }\n\n  onInit(chartSpec: any) {\n    this._plugins.forEach(plugin => {\n      plugin.onInit && plugin.onInit(this, chartSpec);\n    });\n  }\n\n  onBeforeResize(width: number, height: number) {\n    this._plugins.forEach(plugin => {\n      plugin.onBeforeResize && plugin.onBeforeResize(this, width, height);\n    });\n  }\n\n  onAfterChartSpecTransform(chartSpec: any, actionSource: VChartRenderActionSource) {\n    this._plugins.forEach(plugin => {\n      plugin.onAfterChartSpecTransform && plugin.onAfterChartSpecTransform(this, chartSpec, actionSource);\n    });\n  }\n\n  onAfterModelSpecTransform(chartSpec: any, chartSpecInfo: IChartSpecInfo, actionSource: VChartRenderActionSource) {\n    this._plugins.forEach(plugin => {\n      plugin.onAfterModelSpecTransform &&\n        plugin.onAfterModelSpecTransform(this, chartSpec, chartSpecInfo, actionSource);\n    });\n  }\n\n  onBeforeInitChart(chartSpec: any, actionSource: VChartRenderActionSource) {\n    this._plugins.forEach(plugin => {\n      plugin.onBeforeInitChart && plugin.onBeforeInitChart(this, chartSpec, actionSource);\n    });\n  }\n\n  onLayoutRectUpdate() {\n    this._plugins.forEach(plugin => {\n      plugin.onLayoutRectUpdate && plugin.onLayoutRectUpdate(this);\n    });\n  }\n\n  onAfterRender() {\n    this._plugins.forEach(plugin => {\n      plugin.onAfterRender && plugin.onAfterRender(this);\n    });\n  }\n\n  releaseAll(): void {\n    super.releaseAll();\n    this.globalInstance = null;\n  }\n}\n"]}

package/cjs/plugin/chart/scroll/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/plugin/chart/scroll/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAIA,2CAAyB;AACzB,8CAA4B","file":"index.js","sourcesContent":["/**\n * @description export all modules of scroll plugin\n * @since 1.0.0\n */\nexport * from './scroll';\nexport * from './interface';\n"]}
+{"version":3,"sources":["../src/plugin/chart/scroll/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAIA,2CAAyB;AACzB,8CAA4B","file":"index.js","sourcesContent":["/**\n * @description export all modules of scroll plugin\n * @since 1.13.21\n */\nexport * from './scroll';\nexport * from './interface';\n"]}

package/cjs/plugin/chart/scroll/scroll.d.ts

@@ -1,4 +1,4 @@
-import type { IGroup } from '@visactor/vrender-core';
+import type { IGroup, IRectGraphicAttribute } from '@visactor/vrender-core';
 import { BasePlugin } from '../../base/base-plugin';
 import type { IChartPluginService } from '../interface';
 import type { IScrollPlugin } from './interface';
@@ -6,11 +6,15 @@ export declare class ScrollPlugin extends BasePlugin implements IScrollPlugin {
     static readonly pluginType: 'chart';
     static readonly type: string;
     readonly type: string;
+    readonly name: string;
     private _service;
     private _spec;
+    private _lastScrollX;
+    private _lastScrollY;
     private _scrollLimit;
     private _xScrollComponent;
     private _yScrollComponent;
+    private _event;
     constructor();
     onInit(service: IChartPluginService, chartSpec: any): void;
     onLayoutRectUpdate(service: IChartPluginService): void;
@@ -19,9 +23,19 @@ export declare class ScrollPlugin extends BasePlugin implements IScrollPlugin {
     protected _bindEvent(service: IChartPluginService): void;
     protected getRootMark(): IGroup;
     protected onWheel: (e: WheelEvent) => void;
+    private _computeFinalScrollY;
+    private _computeFinalScrollX;
     private _updateScrollY;
     private _getYScrollComponent;
     private _updateScrollX;
     private _getXScrollComponent;
+    scrollTo({ x, y }: {
+        x?: number;
+        y?: number;
+    }): void;
 }
-export declare const registerScrollPlugin: () => void;
+export declare const registerScrollPlugin: (theme?: {
+    size?: number;
+    railStyle?: Omit<IRectGraphicAttribute, 'width' | 'height'>;
+    sliderStyle?: Omit<IRectGraphicAttribute, 'width' | 'height'>;
+}) => void;

package/cjs/plugin/chart/scroll/scroll.js

@@ -14,24 +14,36 @@ Object.defineProperty(exports, "__esModule", {
     value: !0
 }), exports.registerScrollPlugin = exports.ScrollPlugin = void 0;
 
-const base_plugin_1 = require("../../base/base-plugin"), register_1 = require("../register"), vrender_components_1 = require("@visactor/vrender-components"), scrollBarSize = 10;
+const vutils_1 = require("@visactor/vutils"), base_plugin_1 = require("../../base/base-plugin"), register_1 = require("../register"), vrender_components_1 = require("@visactor/vrender-components"), event_1 = require("../../../event/event"), SCROLLBAR_EVENT = "scrollDrag", SCROLLBAR_END_EVENT = "scrollUp", DefaultTheme = {
+    size: 10,
+    railStyle: void 0,
+    sliderStyle: void 0
+};
 
 class ScrollPlugin extends base_plugin_1.BasePlugin {
     constructor() {
-        super(ScrollPlugin.type), this.type = "chartScroll", this._scrollLimit = {
+        super(ScrollPlugin.type), this.type = "chartScroll", this.name = ScrollPlugin.type, 
+        this._lastScrollX = 0, this._lastScrollY = 0, this._scrollLimit = {
             x: {
                 min: 0,
                 max: 0,
+                size: 0,
                 percent: 0
             },
             y: {
                 min: 0,
                 max: 0,
+                size: 0,
                 percent: 0
             }
         }, this.onWheel = e => {
+            var _a, _b;
             const scrollX = e.deltaX, scrollY = e.deltaY, rootMark = this.getRootMark();
-            rootMark && (this._updateScrollX(rootMark, rootMark.attribute.x - scrollX), this._updateScrollY(rootMark, rootMark.attribute.y - scrollY));
+            if (!rootMark) return;
+            const {percent: yPercent, y: y} = null !== (_a = this._computeFinalScrollY(rootMark.attribute.y - scrollY)) && void 0 !== _a ? _a : {}, {percent: xPercent, x: x} = null !== (_b = this._computeFinalScrollX(rootMark.attribute.x - scrollX)) && void 0 !== _b ? _b : {}, eventResult = {};
+            (0, vutils_1.isValidNumber)(x) && (this._updateScrollX(rootMark, x, xPercent), eventResult.x = x), 
+            (0, vutils_1.isValidNumber)(y) && (this._updateScrollY(rootMark, y, yPercent), eventResult.y = y), 
+            this._event.emit("chartScroll", eventResult);
         };
     }
     onInit(service, chartSpec) {
@@ -42,11 +54,13 @@ class ScrollPlugin extends base_plugin_1.BasePlugin {
     onLayoutRectUpdate(service) {
         const viewBoxSize = service.globalInstance.getChart().getViewRect(), canvasSize = service.globalInstance.getChart().getCanvasRect();
         this._scrollLimit.x.min = Math.min(canvasSize.width - viewBoxSize.width, 0), this._scrollLimit.x.percent = Math.abs(canvasSize.width / viewBoxSize.width), 
-        this._scrollLimit.y.min = Math.min(canvasSize.height - viewBoxSize.height, 0), this._scrollLimit.y.percent = Math.abs(canvasSize.height / viewBoxSize.height);
+        this._scrollLimit.x.size = viewBoxSize.width, this._scrollLimit.y.min = Math.min(canvasSize.height - viewBoxSize.height, 0), 
+        this._scrollLimit.y.percent = Math.abs(canvasSize.height / viewBoxSize.height), 
+        this._scrollLimit.y.size = viewBoxSize.height, this._event || (this._event = new event_1.Event(this._service.globalInstance.getChart().getOption().eventDispatcher, null));
     }
     onAfterRender() {
         const rootMark = this.getRootMark();
-        rootMark && (this._xScrollComponent || this._updateScrollX(rootMark, 0), this._yScrollComponent || this._updateScrollY(rootMark, 0));
+        rootMark && (this._xScrollComponent || this._updateScrollX(rootMark, 0, 0), this._yScrollComponent || this._updateScrollY(rootMark, 0, 0));
     }
     release() {
         var _a;
@@ -60,13 +74,30 @@ class ScrollPlugin extends base_plugin_1.BasePlugin {
         var _a;
         return null === (_a = this._service.globalInstance.getStage()) || void 0 === _a ? void 0 : _a.find((node => "root" === node.name), !0);
     }
-    _updateScrollY(rootMark, y) {
+    _computeFinalScrollY(y) {
+        var _a;
+        if (this._lastScrollY === y) return null;
+        if (this._lastScrollY = y, !1 === (null === (_a = this._spec.y) || void 0 === _a ? void 0 : _a.enable)) return null;
+        const finalY = Math.max(this._scrollLimit.y.min, Math.min(y, this._scrollLimit.y.max));
+        return {
+            y: finalY,
+            percent: Math.abs(finalY / this._scrollLimit.y.size)
+        };
+    }
+    _computeFinalScrollX(x) {
         var _a;
-        if (!1 === (null === (_a = this._spec.y) || void 0 === _a ? void 0 : _a.enable)) return;
-        const finalY = Math.max(this._scrollLimit.y.min, Math.min(y, this._scrollLimit.y.max)), percent = Math.abs(finalY / this._scrollLimit.y.min);
+        if (this._lastScrollX === x) return null;
+        if (this._lastScrollX = x, !1 === (null === (_a = this._spec.x) || void 0 === _a ? void 0 : _a.enable)) return null;
+        const finalX = Math.max(this._scrollLimit.x.min, Math.min(x, this._scrollLimit.x.max));
+        return {
+            x: finalX,
+            percent: Math.abs(finalX / this._scrollLimit.x.size)
+        };
+    }
+    _updateScrollY(rootMark, y, percent) {
         this._getYScrollComponent().setAttribute("range", [ percent, percent + this._scrollLimit.y.percent ]), 
         rootMark.setAttributes({
-            y: finalY
+            y: y
         });
     }
     _getYScrollComponent() {
@@ -75,28 +106,38 @@ class ScrollPlugin extends base_plugin_1.BasePlugin {
             const canvasSize = this._service.globalInstance.getChart().getCanvasRect(), viewSize = this._service.globalInstance.getChart().getViewRect(), _f = null !== (_b = null === (_a = this._spec) || void 0 === _a ? void 0 : _a.y) && void 0 !== _b ? _b : {}, {enable: enable} = _f, rest = __rest(_f, [ "enable" ]);
             this._yScrollComponent = new vrender_components_1.ScrollBar(Object.assign(Object.assign({}, rest), {
                 zIndex: 9999,
-                x: canvasSize.width - 10,
+                x: canvasSize.width - DefaultTheme.size,
                 y: 0,
-                width: 10,
+                width: DefaultTheme.size,
                 height: canvasSize.height,
                 range: [ 0, canvasSize.height / viewSize.height ],
                 direction: "vertical",
                 delayTime: null !== (_c = null == rest ? void 0 : rest.delayTime) && void 0 !== _c ? _c : 30,
                 realTime: null === (_d = null == rest ? void 0 : rest.realTime) || void 0 === _d || _d,
-                sliderStyle: {
-                    fill: "rgba(0,0,0,0.3)"
-                }
+                railStyle: DefaultTheme.railStyle,
+                sliderStyle: DefaultTheme.sliderStyle
+            })), this._yScrollComponent.addEventListener("scrollDrag", (e => {
+                var _a;
+                const value = e.detail.value, {percent: percent, y: y} = null !== (_a = this._computeFinalScrollY(-value[0] * this._scrollLimit.y.size)) && void 0 !== _a ? _a : {};
+                void 0 !== percent && void 0 !== y && (this._updateScrollY(this.getRootMark(), y, percent), 
+                this._event.emit("chartScroll", {
+                    y: y
+                }));
+            })), this._yScrollComponent.addEventListener("scrollUp", (e => {
+                var _a;
+                const value = e.detail.value, {percent: percent, y: y} = null !== (_a = this._computeFinalScrollY(-value[0] * this._scrollLimit.y.size)) && void 0 !== _a ? _a : {};
+                void 0 !== percent && void 0 !== y && (this._updateScrollY(this.getRootMark(), y, percent), 
+                this._event.emit("chartScroll", {
+                    y: y
+                }));
             })), null === (_e = this.getRootMark().parent) || void 0 === _e || _e.addChild(this._yScrollComponent);
         }
         return this._yScrollComponent;
     }
-    _updateScrollX(rootMark, x) {
-        var _a;
-        if (!1 === (null === (_a = this._spec.x) || void 0 === _a ? void 0 : _a.enable)) return;
-        const finalX = Math.max(this._scrollLimit.x.min, Math.min(x, this._scrollLimit.x.max)), percent = Math.abs(finalX / this._scrollLimit.x.min);
+    _updateScrollX(rootMark, x, percent) {
         this._getXScrollComponent().setAttribute("range", [ percent, percent + this._scrollLimit.x.percent ]), 
         rootMark.setAttributes({
-            x: finalX
+            x: x
         });
     }
     _getXScrollComponent() {
@@ -106,22 +147,56 @@ class ScrollPlugin extends base_plugin_1.BasePlugin {
             this._xScrollComponent = new vrender_components_1.ScrollBar(Object.assign(Object.assign({}, rest), {
                 zIndex: 9999,
                 x: 0,
-                y: canvasSize.height - 10,
+                y: canvasSize.height - DefaultTheme.size,
                 width: canvasSize.width,
-                height: 10,
+                height: DefaultTheme.size,
                 range: [ 0, canvasSize.width / viewSize.width ],
                 direction: "horizontal",
                 delayTime: null !== (_c = null == rest ? void 0 : rest.delayTime) && void 0 !== _c ? _c : 30,
-                realTime: null === (_d = null == rest ? void 0 : rest.realTime) || void 0 === _d || _d
+                realTime: null === (_d = null == rest ? void 0 : rest.realTime) || void 0 === _d || _d,
+                sliderStyle: DefaultTheme.sliderStyle,
+                railStyle: DefaultTheme.railStyle
+            })), this._xScrollComponent.addEventListener("scrollDrag", (e => {
+                var _a;
+                const value = e.detail.value, {percent: percent, x: x} = null !== (_a = this._computeFinalScrollX(-value[0] * this._scrollLimit.x.size)) && void 0 !== _a ? _a : {};
+                void 0 !== percent && void 0 !== x && (this._updateScrollX(this.getRootMark(), x, percent), 
+                this._event.emit("chartScroll", {
+                    x: x
+                }));
+            })), this._xScrollComponent.addEventListener("scrollUp", (e => {
+                var _a;
+                const value = e.detail.value, {percent: percent, x: x} = null !== (_a = this._computeFinalScrollX(-value[0] * this._scrollLimit.x.size)) && void 0 !== _a ? _a : {};
+                void 0 !== percent && void 0 !== x && (this._updateScrollX(this.getRootMark(), x, percent), 
+                this._event.emit("chartScroll", {
+                    x: x
+                }));
             })), null === (_e = this.getRootMark().parent) || void 0 === _e || _e.addChild(this._xScrollComponent);
         }
         return this._xScrollComponent;
     }
+    scrollTo({x: x, y: y}) {
+        var _a, _b;
+        const rootMark = this.getRootMark();
+        if (rootMark) {
+            if (void 0 !== x) {
+                const {x: finalX, percent: percent} = null !== (_a = this._computeFinalScrollX(x)) && void 0 !== _a ? _a : {};
+                void 0 !== finalX && void 0 !== percent && this._updateScrollX(rootMark, finalX, percent);
+            }
+            if (void 0 !== y) {
+                const {y: finalY, percent: percent} = null !== (_b = this._computeFinalScrollY(y)) && void 0 !== _b ? _b : {};
+                void 0 !== finalY && void 0 !== percent && this._updateScrollY(rootMark, finalY, percent);
+            }
+        }
+    }
 }
 
 exports.ScrollPlugin = ScrollPlugin, ScrollPlugin.pluginType = "chart", ScrollPlugin.type = "chartScroll";
 
-const registerScrollPlugin = () => {
+const registerScrollPlugin = theme => {
+    var _a, _b, _c, _d, _e;
+    DefaultTheme.size = null !== (_a = null == theme ? void 0 : theme.size) && void 0 !== _a ? _a : DefaultTheme.size, 
+    DefaultTheme.railStyle = (0, vutils_1.merge)({}, null !== (_b = DefaultTheme.railStyle) && void 0 !== _b ? _b : {}, null !== (_c = null == theme ? void 0 : theme.railStyle) && void 0 !== _c ? _c : {}), 
+    DefaultTheme.sliderStyle = (0, vutils_1.merge)({}, null !== (_d = DefaultTheme.sliderStyle) && void 0 !== _d ? _d : {}, null !== (_e = null == theme ? void 0 : theme.sliderStyle) && void 0 !== _e ? _e : {}), 
     (0, register_1.registerChartPlugin)(ScrollPlugin);
 };
 

package/cjs/plugin/chart/scroll/scroll.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/plugin/chart/scroll/scroll.ts"],"names":[],"mappings":"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","file":"scroll.js","sourcesContent":["import type { IGroup } from '@visactor/vrender-core';\nimport { BasePlugin } from '../../base/base-plugin';\nimport type { IChartPluginService } from '../interface';\nimport { registerChartPlugin } from '../register';\nimport type { IScrollPlugin, IScrollPluginSpec } from './interface';\nimport { ScrollBar as ScrollBarComponent } from '@visactor/vrender-components';\n\nconst scrollBarSize = 10;\n\n/**\n * ScrollPlugin 类\n * @since 1.0.0\n */\nexport class ScrollPlugin extends BasePlugin implements IScrollPlugin {\n  static readonly pluginType: 'chart' = 'chart';\n  static readonly type: string = 'chartScroll';\n  readonly type: string = 'chartScroll';\n\n  private _service: IChartPluginService;\n\n  private _spec: IScrollPluginSpec;\n\n  private _scrollLimit = {\n    x: {\n      min: 0,\n      max: 0,\n      percent: 0\n    },\n    y: {\n      min: 0,\n      max: 0,\n      percent: 0\n    }\n  };\n\n  private _xScrollComponent: ScrollBarComponent;\n  private _yScrollComponent: ScrollBarComponent;\n\n  constructor() {\n    super(ScrollPlugin.type);\n  }\n\n  /**\n   * 初始化插件\n   * @param service\n   * @param chartSpec\n   */\n  onInit(service: IChartPluginService, chartSpec: any) {\n    this._spec = chartSpec[ScrollPlugin.type] ?? {};\n    this._service = service;\n    this._bindEvent(service);\n  }\n\n  onLayoutRectUpdate(service: IChartPluginService) {\n    const viewBoxSize = service.globalInstance.getChart().getViewRect();\n    const canvasSize = service.globalInstance.getChart().getCanvasRect();\n    this._scrollLimit.x.min = Math.min(canvasSize.width - viewBoxSize.width, 0);\n    this._scrollLimit.x.percent = Math.abs(canvasSize.width / viewBoxSize.width);\n    this._scrollLimit.y.min = Math.min(canvasSize.height - viewBoxSize.height, 0);\n    this._scrollLimit.y.percent = Math.abs(canvasSize.height / viewBoxSize.height);\n  }\n\n  onAfterRender() {\n    const rootMark = this.getRootMark();\n    if (rootMark) {\n      if (!this._xScrollComponent) {\n        this._updateScrollX(rootMark, 0);\n      }\n      if (!this._yScrollComponent) {\n        this._updateScrollY(rootMark, 0);\n      }\n    }\n  }\n\n  /**\n   * 释放插件资源\n   */\n  release() {\n    this._service.globalInstance.getStage()?.off('wheel', this.onWheel);\n  }\n\n  protected _bindEvent(service: IChartPluginService) {\n    service.globalInstance.getStage()?.on('wheel', this.onWheel);\n  }\n\n  protected getRootMark() {\n    return this._service.globalInstance.getStage()?.find(node => node.name === 'root', true) as IGroup;\n  }\n\n  protected onWheel = (e: WheelEvent) => {\n    const scrollX = e.deltaX;\n    const scrollY = e.deltaY;\n    const rootMark = this.getRootMark();\n    if (!rootMark) {\n      return;\n    }\n    this._updateScrollX(rootMark, rootMark.attribute.x - scrollX);\n    this._updateScrollY(rootMark, rootMark.attribute.y - scrollY);\n  };\n\n  private _updateScrollY(rootMark: IGroup, y: number) {\n    if (this._spec.y?.enable === false) {\n      return;\n    }\n    const finalY = Math.max(this._scrollLimit.y.min, Math.min(y, this._scrollLimit.y.max));\n    const percent = Math.abs(finalY / this._scrollLimit.y.min);\n    const yScrollComponent = this._getYScrollComponent();\n    yScrollComponent.setAttribute('range', [percent, percent + this._scrollLimit.y.percent]);\n    rootMark.setAttributes({\n      y: finalY\n    });\n  }\n\n  private _getYScrollComponent() {\n    if (!this._yScrollComponent) {\n      const canvasSize = this._service.globalInstance.getChart().getCanvasRect();\n      const viewSize = this._service.globalInstance.getChart().getViewRect();\n      const { enable, ...rest } = this._spec?.y ?? ({} as IScrollPluginSpec['y']);\n      this._yScrollComponent = new ScrollBarComponent({\n        ...rest,\n        zIndex: 9999,\n        x: canvasSize.width - scrollBarSize,\n        y: 0,\n        width: scrollBarSize,\n        height: canvasSize.height,\n        range: [0, canvasSize.height / viewSize.height],\n        direction: 'vertical',\n        delayTime: rest?.delayTime ?? 30,\n        realTime: rest?.realTime ?? true,\n        sliderStyle: { fill: 'rgba(0,0,0,0.3)' }\n      });\n      this.getRootMark().parent?.addChild(this._yScrollComponent);\n    }\n    return this._yScrollComponent;\n  }\n\n  private _updateScrollX(rootMark: IGroup, x: number) {\n    if (this._spec.x?.enable === false) {\n      return;\n    }\n    const finalX = Math.max(this._scrollLimit.x.min, Math.min(x, this._scrollLimit.x.max));\n    const percent = Math.abs(finalX / this._scrollLimit.x.min);\n    const xScrollComponent = this._getXScrollComponent();\n    xScrollComponent.setAttribute('range', [percent, percent + this._scrollLimit.x.percent]);\n\n    rootMark.setAttributes({\n      x: finalX\n    });\n  }\n\n  private _getXScrollComponent() {\n    if (!this._xScrollComponent) {\n      const canvasSize = this._service.globalInstance.getChart().getCanvasRect();\n      const viewSize = this._service.globalInstance.getChart().getViewRect();\n      const { enable, ...rest } = this._spec?.x ?? ({} as IScrollPluginSpec['x']);\n      this._xScrollComponent = new ScrollBarComponent({\n        ...rest,\n        zIndex: 9999,\n        x: 0,\n        y: canvasSize.height - scrollBarSize,\n        width: canvasSize.width,\n        height: scrollBarSize,\n        range: [0, canvasSize.width / viewSize.width],\n        direction: 'horizontal',\n        delayTime: rest?.delayTime ?? 30,\n        realTime: rest?.realTime ?? true\n      });\n      this.getRootMark().parent?.addChild(this._xScrollComponent);\n    }\n    return this._xScrollComponent;\n  }\n}\n\n/**\n * 注册 ScrollPlugin\n * @since 1.0.0\n */\nexport const registerScrollPlugin = () => {\n  registerChartPlugin(ScrollPlugin);\n};\n"]}
+{"version":3,"sources":["../src/plugin/chart/scroll/scroll.ts"],"names":[],"mappings":"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","file":"scroll.js","sourcesContent":["import { isValidNumber, merge } from '@visactor/vutils';\nimport type { IGroup, IRectGraphicAttribute } from '@visactor/vrender-core';\nimport { BasePlugin } from '../../base/base-plugin';\nimport type { IChartPluginService } from '../interface';\nimport { registerChartPlugin } from '../register';\nimport type { IScrollPlugin, IScrollPluginSpec } from './interface';\nimport { ScrollBar as ScrollBarComponent } from '@visactor/vrender-components';\nimport { Event } from '../../../event/event';\nimport type { ExtendEventParam } from '../../../event/interface';\n\n// 由vrender透出, 接入新版本后需修改\nconst SCROLLBAR_EVENT = 'scrollDrag';\nconst SCROLLBAR_END_EVENT = 'scrollUp';\n\nconst DefaultTheme: {\n  size?: number;\n  railStyle?: Omit<IRectGraphicAttribute, 'width' | 'height'>;\n  sliderStyle?: Omit<IRectGraphicAttribute, 'width' | 'height'>;\n} = {\n  size: 10,\n  railStyle: undefined,\n  sliderStyle: undefined\n};\n/**\n * ScrollPlugin 类\n * @since 1.0.0\n */\nexport class ScrollPlugin extends BasePlugin implements IScrollPlugin {\n  static readonly pluginType: 'chart' = 'chart';\n  static readonly type: string = 'chartScroll';\n  readonly type: string = 'chartScroll';\n  readonly name: string = ScrollPlugin.type;\n\n  private _service: IChartPluginService;\n\n  private _spec: IScrollPluginSpec;\n  private _lastScrollX = 0;\n  private _lastScrollY = 0;\n\n  private _scrollLimit = {\n    x: {\n      min: 0,\n      max: 0,\n      size: 0,\n      percent: 0\n    },\n    y: {\n      min: 0,\n      max: 0,\n      size: 0,\n      percent: 0\n    }\n  };\n\n  private _xScrollComponent: ScrollBarComponent;\n  private _yScrollComponent: ScrollBarComponent;\n  private _event: Event;\n\n  constructor() {\n    super(ScrollPlugin.type);\n  }\n\n  /**\n   * 初始化插件\n   * @param service\n   * @param chartSpec\n   */\n  onInit(service: IChartPluginService, chartSpec: any) {\n    this._spec = chartSpec[ScrollPlugin.type] ?? {};\n    this._service = service;\n    this._bindEvent(service);\n  }\n\n  onLayoutRectUpdate(service: IChartPluginService) {\n    const viewBoxSize = service.globalInstance.getChart().getViewRect();\n    const canvasSize = service.globalInstance.getChart().getCanvasRect();\n    this._scrollLimit.x.min = Math.min(canvasSize.width - viewBoxSize.width, 0);\n    this._scrollLimit.x.percent = Math.abs(canvasSize.width / viewBoxSize.width);\n    this._scrollLimit.x.size = viewBoxSize.width;\n    this._scrollLimit.y.min = Math.min(canvasSize.height - viewBoxSize.height, 0);\n    this._scrollLimit.y.percent = Math.abs(canvasSize.height / viewBoxSize.height);\n    this._scrollLimit.y.size = viewBoxSize.height;\n\n    if (!this._event) {\n      this._event = new Event(this._service.globalInstance.getChart().getOption().eventDispatcher, null);\n    }\n  }\n\n  onAfterRender() {\n    const rootMark = this.getRootMark();\n    if (rootMark) {\n      if (!this._xScrollComponent) {\n        this._updateScrollX(rootMark, 0, 0);\n      }\n      if (!this._yScrollComponent) {\n        this._updateScrollY(rootMark, 0, 0);\n      }\n    }\n  }\n\n  /**\n   * 释放插件资源\n   */\n  release() {\n    this._service.globalInstance.getStage()?.off('wheel', this.onWheel);\n  }\n\n  protected _bindEvent(service: IChartPluginService) {\n    service.globalInstance.getStage()?.on('wheel', this.onWheel);\n  }\n\n  protected getRootMark() {\n    return this._service.globalInstance.getStage()?.find(node => node.name === 'root', true) as IGroup;\n  }\n\n  protected onWheel = (e: WheelEvent) => {\n    const scrollX = e.deltaX;\n    const scrollY = e.deltaY;\n    const rootMark = this.getRootMark();\n    if (!rootMark) {\n      return;\n    }\n    const { percent: yPercent, y } = this._computeFinalScrollY(rootMark.attribute.y - scrollY) ?? {};\n    const { percent: xPercent, x } = this._computeFinalScrollX(rootMark.attribute.x - scrollX) ?? {};\n    const eventResult: { x?: number; y?: number } = {};\n    if (isValidNumber(x)) {\n      this._updateScrollX(rootMark, x, xPercent);\n      eventResult.x = x;\n    }\n    if (isValidNumber(y)) {\n      this._updateScrollY(rootMark, y, yPercent);\n      eventResult.y = y;\n    }\n\n    this._event.emit('chartScroll', eventResult as ExtendEventParam);\n  };\n\n  private _computeFinalScrollY(y: number) {\n    if (this._lastScrollY === y) {\n      return null;\n    }\n    this._lastScrollY = y;\n    if (this._spec.y?.enable === false) {\n      return null;\n    }\n    const finalY = Math.max(this._scrollLimit.y.min, Math.min(y, this._scrollLimit.y.max));\n    const percent = Math.abs(finalY / this._scrollLimit.y.size);\n    return {\n      y: finalY,\n      percent\n    };\n  }\n  private _computeFinalScrollX(x: number) {\n    if (this._lastScrollX === x) {\n      return null;\n    }\n    this._lastScrollX = x;\n    if (this._spec.x?.enable === false) {\n      return null;\n    }\n    const finalX = Math.max(this._scrollLimit.x.min, Math.min(x, this._scrollLimit.x.max));\n    const percent = Math.abs(finalX / this._scrollLimit.x.size);\n    return {\n      x: finalX,\n      percent\n    };\n  }\n\n  private _updateScrollY(rootMark: IGroup, y: number, percent: number) {\n    const yScrollComponent = this._getYScrollComponent();\n    yScrollComponent.setAttribute('range', [percent, percent + this._scrollLimit.y.percent]);\n    rootMark.setAttributes({\n      y: y\n    });\n  }\n\n  private _getYScrollComponent() {\n    if (!this._yScrollComponent) {\n      const canvasSize = this._service.globalInstance.getChart().getCanvasRect();\n      const viewSize = this._service.globalInstance.getChart().getViewRect();\n      const { enable, ...rest } = this._spec?.y ?? ({} as IScrollPluginSpec['y']);\n      this._yScrollComponent = new ScrollBarComponent({\n        ...rest,\n        zIndex: 9999,\n        x: canvasSize.width - DefaultTheme.size,\n        y: 0,\n        width: DefaultTheme.size,\n        height: canvasSize.height,\n        range: [0, canvasSize.height / viewSize.height],\n        direction: 'vertical',\n        delayTime: rest?.delayTime ?? 30,\n        realTime: rest?.realTime ?? true,\n        railStyle: DefaultTheme.railStyle,\n        sliderStyle: DefaultTheme.sliderStyle\n      });\n      // 绑定事件，防抖，防止频繁触发\n      this._yScrollComponent.addEventListener(SCROLLBAR_EVENT, (e: any) => {\n        const value = e.detail.value;\n        const { percent, y } = this._computeFinalScrollY(-value[0] * this._scrollLimit.y.size) ?? {};\n        if (percent !== undefined && y !== undefined) {\n          this._updateScrollY(this.getRootMark(), y, percent);\n          this._event.emit('chartScroll', { y } as ExtendEventParam);\n        }\n      });\n      this._yScrollComponent.addEventListener(SCROLLBAR_END_EVENT, (e: any) => {\n        const value = e.detail.value;\n        const { percent, y } = this._computeFinalScrollY(-value[0] * this._scrollLimit.y.size) ?? {};\n        if (percent !== undefined && y !== undefined) {\n          this._updateScrollY(this.getRootMark(), y, percent);\n          this._event.emit('chartScroll', { y } as ExtendEventParam);\n        }\n      });\n      this.getRootMark().parent?.addChild(this._yScrollComponent);\n    }\n    return this._yScrollComponent;\n  }\n\n  private _updateScrollX(rootMark: IGroup, x: number, percent: number) {\n    const xScrollComponent = this._getXScrollComponent();\n    xScrollComponent.setAttribute('range', [percent, percent + this._scrollLimit.x.percent]);\n    rootMark.setAttributes({\n      x: x\n    });\n  }\n\n  private _getXScrollComponent() {\n    if (!this._xScrollComponent) {\n      const canvasSize = this._service.globalInstance.getChart().getCanvasRect();\n      const viewSize = this._service.globalInstance.getChart().getViewRect();\n      const { enable, ...rest } = this._spec?.x ?? ({} as IScrollPluginSpec['x']);\n      this._xScrollComponent = new ScrollBarComponent({\n        ...rest,\n        zIndex: 9999,\n        x: 0,\n        y: canvasSize.height - DefaultTheme.size,\n        width: canvasSize.width,\n        height: DefaultTheme.size,\n        range: [0, canvasSize.width / viewSize.width],\n        direction: 'horizontal',\n        delayTime: rest?.delayTime ?? 30,\n        realTime: rest?.realTime ?? true,\n        sliderStyle: DefaultTheme.sliderStyle,\n        railStyle: DefaultTheme.railStyle\n      });\n      // 绑定事件，防抖，防止频繁触发\n      this._xScrollComponent.addEventListener(SCROLLBAR_EVENT, (e: any) => {\n        const value = e.detail.value;\n        const { percent, x } = this._computeFinalScrollX(-value[0] * this._scrollLimit.x.size) ?? {};\n        if (percent !== undefined && x !== undefined) {\n          this._updateScrollX(this.getRootMark(), x, percent);\n          this._event.emit('chartScroll', { x } as ExtendEventParam);\n        }\n      });\n      this._xScrollComponent.addEventListener(SCROLLBAR_END_EVENT, (e: any) => {\n        const value = e.detail.value;\n        const { percent, x } = this._computeFinalScrollX(-value[0] * this._scrollLimit.x.size) ?? {};\n        if (percent !== undefined && x !== undefined) {\n          this._updateScrollX(this.getRootMark(), x, percent);\n          this._event.emit('chartScroll', { x } as ExtendEventParam);\n        }\n      });\n      this.getRootMark().parent?.addChild(this._xScrollComponent);\n    }\n    return this._xScrollComponent;\n  }\n\n  /**\n   * api\n   */\n  scrollTo({ x, y }: { x?: number; y?: number }) {\n    const rootMark = this.getRootMark();\n    if (rootMark) {\n      if (x !== undefined) {\n        const { x: finalX, percent } = this._computeFinalScrollX(x) ?? {};\n        if (finalX !== undefined && percent !== undefined) {\n          this._updateScrollX(rootMark, finalX, percent);\n        }\n      }\n      if (y !== undefined) {\n        const { y: finalY, percent } = this._computeFinalScrollY(y) ?? {};\n        if (finalY !== undefined && percent !== undefined) {\n          this._updateScrollY(rootMark, finalY, percent);\n        }\n      }\n    }\n  }\n}\n\n/**\n * 注册 ScrollPlugin\n * @since 1.0.0\n */\nexport const registerScrollPlugin = (theme?: {\n  size?: number;\n  railStyle?: Omit<IRectGraphicAttribute, 'width' | 'height'>;\n  sliderStyle?: Omit<IRectGraphicAttribute, 'width' | 'height'>;\n}) => {\n  DefaultTheme.size = theme?.size ?? DefaultTheme.size;\n  DefaultTheme.railStyle = merge({}, DefaultTheme.railStyle ?? {}, theme?.railStyle ?? {});\n  DefaultTheme.sliderStyle = merge({}, DefaultTheme.sliderStyle ?? {}, theme?.sliderStyle ?? {});\n  registerChartPlugin(ScrollPlugin);\n};\n"]}

package/cjs/series/sankey/interface.d.ts

@@ -4,6 +4,8 @@ import type { IRectMarkSpec, ILinkPathMarkSpec } from '../../typings/visual';
 import type { IAnimationSpec } from '../../animation/spec';
 import type { SeriesMarkNameEnum } from '../interface/type';
 import type { ILabelSpec } from '../../component/label/interface';
+import type { SankeyLayout } from '@visactor/vgrammar-sankey';
+import type { ISankeyOpt } from '../../data/transforms/sankey';
 export type SankeyMark = 'node' | 'link' | 'label';
 export type SankeyAppearPreset = 'growIn' | 'fadeIn';
 export interface ISankeyAnimationParams {
@@ -34,6 +36,7 @@ export interface ISankeySeriesSpec extends Omit<ISeriesSpec, 'data'>, IAnimation
     maxLinkHeight?: number;
     iterations?: number;
     nodeKey?: string | number | ((datum: SankeyNodeDatum) => string | number);
+    depthKey?: string | number | ((datum: SankeyNodeDatum) => string | number);
     linkSortBy?: (a: SankeyLinkElement, b: SankeyLinkElement) => number;
     nodeSortBy?: (a: SankeyNodeElement, b: SankeyNodeElement) => number;
     setNodeLayer?: (datum: SankeyNodeDatum) => number;
@@ -53,6 +56,7 @@ export interface ISankeySeriesSpec extends Omit<ISeriesSpec, 'data'>, IAnimation
     };
     [SeriesMarkNameEnum.label]?: ISankeyLabelSpec | ISankeyLabelSpec[];
     overflow?: 'scroll' | 'hidden' | 'scroll-x' | 'scroll-y';
+    customLayout?: (layout: SankeyLayout, originalData: SankeyData, view: ReturnType<ISankeyOpt['view']>) => ReturnType<SankeyLayout['layout']>;
 }
 export interface SankeyLinkDatum {
     source: string | number;

package/cjs/series/sankey/interface.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/series/sankey/interface.ts"],"names":[],"mappings":"","file":"interface.js","sourcesContent":["import type { ISeriesSpec, DirectionType, IMarkTheme } from '../../typings';\nimport type { IMarkSpec } from '../../typings/spec/common';\nimport type { IRectMarkSpec, ILinkPathMarkSpec } from '../../typings/visual';\nimport type { IAnimationSpec } from '../../animation/spec';\nimport type { SeriesMarkNameEnum } from '../interface/type';\nimport type { ILabelSpec } from '../../component/label/interface';\n\nexport type SankeyMark = 'node' | 'link' | 'label';\n\nexport type SankeyAppearPreset = 'growIn' | 'fadeIn';\nexport interface ISankeyAnimationParams {\n  direction: DirectionType;\n  growFrom: () => number;\n}\n\nexport type ISankeyLabelSpec = ILabelSpec & {\n  /**\n   * 标签布局方式\n   * @default 'outside'\n   */\n  position?: 'outside' | 'inside-start' | 'inside-middle' | 'inside-end' | 'left' | 'right';\n  /** 标签文字缩略 */\n  limit?: number;\n};\n\nexport interface ISankeySeriesSpec extends Omit<ISeriesSpec, 'data'>, IAnimationSpec<SankeyMark, SankeyAppearPreset> {\n  type: 'sankey';\n\n  /**\n   * 数据字段配置\n   */\n  /** 节点名称字段配置 */\n  categoryField: string;\n  /** 节点之间关系的权重字段 */\n  valueField: string;\n  /** 来源节点数据字段\n   *  层级数据不提供\n   */\n  sourceField?: string;\n  /** 目标节点数据字段\n   *  层级数据不提供\n   */\n  targetField?: string;\n\n  /**\n   * 图表布局方向\n   */\n  direction?: DirectionType;\n  /**\n   * 节点的对齐类型，所有深度相同的节点，采用什么对齐方式，决定了节点在第几层：\n   * - 横向布局的桑基图，用于计算节点x坐标\n   * - 纵向布局的桑基图，用于计算节点y坐标\n   */\n  nodeAlign?: 'left' | 'right' | 'center' | 'justify' | 'start' | 'end';\n  /**\n   * 横向布局的桑基图，设置节点Y坐标的对齐方式：\n   * 'start' - '顶部对齐'\n   * 'end' - '底部对齐'\n   * 'middle' - '居中对齐'\n   *\n   * 纵向布局的桑基图，设置节点X坐标的对齐方式：\n   * 'start' - '左对齐'\n   * 'end' - '右对齐'\n   * 'middle' - '居中对齐'\n   * 'parent' - '父节点'，从1.12.14版本开始支持\n   *\n   * @since 1.12.4\n   */\n  crossNodeAlign?: 'start' | 'end' | 'middle' | 'parent';\n  /**\n   * 是否反向\n   * @since 1.12.2\n   */\n  inverse?: boolean;\n  /**\n   * 同一层中两个节点之间的间隙大小\n   */\n  nodeGap?: number;\n  /**\n   * 每个节点的宽度，支持三种取值\n   * 1. 百分比字符串，例如：{ nodeWidth: '12%' }\n   * 2. 以'px'为单位的简单数字，eg: { nodeWidth: 20 }\n   * 3. function，通过自定义计算指定nodeWidth\n   */\n  nodeWidth?: string | number | ((node: SankeyNodeElement) => number);\n  /**\n   * link宽度，单位px\n   */\n  linkWidth?: number | ((link: SankeyLinkElement) => number);\n  /**\n   * link + node 的最小宽度\n   */\n  minStepWidth?: number;\n  /**\n   * 数据不为零或空时节点的最小大小\n   *  - 这个配置可以用来避免数据太小时看不到太细的节点\n   *  - 建议小于5px\n   */\n  minNodeHeight?: number;\n  /**\n   * 数据不为零或空时边的最小大小\n   *  - 这个配置可以用来避免数据太小的时候看不到太细的链接\n   *  - 建议小于5px\n   *  - 当同时指定 `minNodeHeight` 和 `minLinkHeight` 两个选项时，此选项应小于 `minNodeHeight`\n   */\n  minLinkHeight?: number;\n  /**\n   * 数据不为零或空时节点的最大大小\n   * @since 1.12.14\n   */\n  maxNodeHeight?: number;\n  /**\n   * 数据不为零或空时边的最大大小\n   * - 当同时指定 `maxNodeHeight` 和 `maxLinkHeight` 两个选项时，此选项应小于 `maxNodeHeight`\n   * @since 1.12.14\n   */\n  maxLinkHeight?: number;\n  /** 布局的迭代次数 */\n  iterations?: number;\n  /** 解析node的key，defaultValue */\n  nodeKey?: string | number | ((datum: SankeyNodeDatum) => string | number);\n  /** 按此funtion排序link */\n  linkSortBy?: (a: SankeyLinkElement, b: SankeyLinkElement) => number;\n  /** 按此funtion排序node */\n  nodeSortBy?: (a: SankeyNodeElement, b: SankeyNodeElement) => number;\n  /** 自定义指定节点层 */\n  setNodeLayer?: (datum: SankeyNodeDatum) => number;\n  /**\n   * 是否丢弃孤立的节点\n   * @since 1.11.0\n   */\n  dropIsolatedNode?: boolean;\n  /**\n   * set the height of node\n   * @since 1.11.0\n   */\n  nodeHeight?: number | ((node: SankeyNodeElement) => number);\n  /**\n   * set the height of link\n   * @since 1.11.0\n   */\n  linkHeight?: number | ((link: SankeyLinkElement, sourceNode: SankeyNodeElement, sourceNodeHeight: number) => number);\n  /**\n   * each node has same height\n   * @since 1.11.0\n   */\n  equalNodeHeight?: boolean;\n  /**\n   * the layout type of link\n   * @since 1.11.0\n   */\n  linkOverlap?: 'start' | 'center' | 'end';\n\n  /** 节点配置 */\n  [SeriesMarkNameEnum.node]?: IMarkSpec<IRectMarkSpec>;\n\n  /** 边配置 */\n  [SeriesMarkNameEnum.link]?: IMarkSpec<ILinkPathMarkSpec>;\n\n  /** 联动交互配置 */\n  emphasis?: {\n    /** 是否开启交互 */\n    enable: boolean;\n    /**\n     * 交互触发类型\n     * 默认为‘click'\n     */\n    trigger?: 'click' | 'hover';\n    /**桑基图提供3种在节点上的交互联动效果\n     * self: 仅高亮当前节点。\n     * adjacency: 高亮当前节点上下游节点和关联的边，淡化其它图形元素。\n     * related： 高亮与当前节点相关的整条路径上的节点和边，淡化其它图形元素。 */\n    effect: 'self' | 'adjacency' | 'related';\n    /**\n     * 高亮状态\n     * @default 'selected'\n     * @since 1.13.13\n     */\n    highlightState?: string;\n    /**\n     * 失焦状态\n     * @default 'blur'\n     * @since 1.13.13\n     */\n    blurState?: string;\n  };\n\n  /** 标签配置 */\n  [SeriesMarkNameEnum.label]?: ISankeyLabelSpec | ISankeyLabelSpec[];\n\n  /**\n   * 当制定了节点、边的宽度的时候，可以配置这个属性\n   * 当宽度大于图表region的宽度、高度大于图表resion高度的时候是否自动产生滚动条\n   * @since 1.13.0\n   */\n  overflow?: 'scroll' | 'hidden' | 'scroll-x' | 'scroll-y';\n\n  /** 进度条配置 */\n  // scroll?: IScrollSpec & {\n  //   /** 是否开启进度条 */\n  //   enable: boolean;\n  // };\n}\n\nexport interface SankeyLinkDatum {\n  source: string | number;\n  target: string | number;\n  value?: number;\n}\n\nexport interface SankeyNodeDatum {\n  value?: number;\n}\n\nexport interface HierarchyNodeDatum {\n  value?: number;\n  children?: HierarchyNodeDatum[];\n}\n\nexport type SankeyData =\n  | {\n      nodes?: SankeyNodeDatum[];\n      links: SankeyLinkDatum[];\n    }\n  | {\n      nodes: HierarchyNodeDatum[];\n    };\n\n/**\n * The node element after sankey layout\n */\nexport interface SankeyNodeElement {\n  key: string | number;\n  index: number;\n  /** the depth of node, from source to target */\n  depth: number;\n\n  /** the depth of node, from target to source */\n  endDepth?: number;\n  /** the final layer index after layout */\n  layer?: number;\n  isLastLayer?: boolean;\n  value: number;\n  datum: SankeyNodeDatum;\n  sourceLinks: SankeyLinkElement[];\n  targetLinks: SankeyLinkElement[];\n  x0?: number;\n  y0?: number;\n  x1?: number;\n  y1?: number;\n}\n/**\n * the link element after sankey layout\n */\nexport interface SankeyLinkElement {\n  vertical?: boolean;\n  index: number;\n  source: string | number;\n  target: string | number;\n  value: number;\n  datum: SankeyLinkDatum | SankeyLinkDatum[];\n  thickness?: number;\n  sourceRect?: { x0: number; x1: number; y0: number; y1: number };\n  targetRect?: { x0: number; x1: number; y0: number; y1: number };\n  /** this will only be generate in hierarchy node data*/\n  parents?: (string | number)[];\n  y0?: number;\n  y1?: number;\n  x0?: number;\n  x1?: number;\n}\n\nexport type SankeyLayoutResult = {\n  nodes: SankeyNodeElement[];\n  links: SankeyLinkElement[];\n  columns: SankeyNodeElement[][];\n}[];\n\nexport interface ISankeySeriesTheme {\n  [SeriesMarkNameEnum.node]?: IMarkTheme<IRectMarkSpec>;\n  [SeriesMarkNameEnum.link]?: IMarkTheme<ILinkPathMarkSpec>;\n}\n"]}
+{"version":3,"sources":["../src/series/sankey/interface.ts"],"names":[],"mappings":"","file":"interface.js","sourcesContent":["import type { ISeriesSpec, DirectionType, IMarkTheme } from '../../typings';\nimport type { IMarkSpec } from '../../typings/spec/common';\nimport type { IRectMarkSpec, ILinkPathMarkSpec } from '../../typings/visual';\nimport type { IAnimationSpec } from '../../animation/spec';\nimport type { SeriesMarkNameEnum } from '../interface/type';\nimport type { ILabelSpec } from '../../component/label/interface';\nimport type { SankeyLayout } from '@visactor/vgrammar-sankey';\nimport type { ISankeyOpt } from '../../data/transforms/sankey';\n\nexport type SankeyMark = 'node' | 'link' | 'label';\n\nexport type SankeyAppearPreset = 'growIn' | 'fadeIn';\nexport interface ISankeyAnimationParams {\n  direction: DirectionType;\n  growFrom: () => number;\n}\n\nexport type ISankeyLabelSpec = ILabelSpec & {\n  /**\n   * 标签布局方式\n   * @default 'outside'\n   */\n  position?: 'outside' | 'inside-start' | 'inside-middle' | 'inside-end' | 'left' | 'right';\n  /** 标签文字缩略 */\n  limit?: number;\n};\n\nexport interface ISankeySeriesSpec extends Omit<ISeriesSpec, 'data'>, IAnimationSpec<SankeyMark, SankeyAppearPreset> {\n  type: 'sankey';\n\n  /**\n   * 数据字段配置\n   */\n  /** 节点名称字段配置 */\n  categoryField: string;\n  /** 节点之间关系的权重字段 */\n  valueField: string;\n  /** 来源节点数据字段\n   *  层级数据不提供\n   */\n  sourceField?: string;\n  /** 目标节点数据字段\n   *  层级数据不提供\n   */\n  targetField?: string;\n\n  /**\n   * 图表布局方向\n   */\n  direction?: DirectionType;\n  /**\n   * 节点的对齐类型，所有深度相同的节点，采用什么对齐方式，决定了节点在第几层：\n   * - 横向布局的桑基图，用于计算节点x坐标\n   * - 纵向布局的桑基图，用于计算节点y坐标\n   */\n  nodeAlign?: 'left' | 'right' | 'center' | 'justify' | 'start' | 'end';\n  /**\n   * 横向布局的桑基图，设置节点Y坐标的对齐方式：\n   * 'start' - '顶部对齐'\n   * 'end' - '底部对齐'\n   * 'middle' - '居中对齐'\n   *\n   * 纵向布局的桑基图，设置节点X坐标的对齐方式：\n   * 'start' - '左对齐'\n   * 'end' - '右对齐'\n   * 'middle' - '居中对齐'\n   * 'parent' - '父节点'，从1.12.14版本开始支持\n   *\n   * @since 1.12.4\n   */\n  crossNodeAlign?: 'start' | 'end' | 'middle' | 'parent';\n  /**\n   * 是否反向\n   * @since 1.12.2\n   */\n  inverse?: boolean;\n  /**\n   * 同一层中两个节点之间的间隙大小\n   */\n  nodeGap?: number;\n  /**\n   * 每个节点的宽度，支持三种取值\n   * 1. 百分比字符串，例如：{ nodeWidth: '12%' }\n   * 2. 以'px'为单位的简单数字，eg: { nodeWidth: 20 }\n   * 3. function，通过自定义计算指定nodeWidth\n   */\n  nodeWidth?: string | number | ((node: SankeyNodeElement) => number);\n  /**\n   * link宽度，单位px\n   */\n  linkWidth?: number | ((link: SankeyLinkElement) => number);\n  /**\n   * link + node 的最小宽度\n   */\n  minStepWidth?: number;\n  /**\n   * 数据不为零或空时节点的最小大小\n   *  - 这个配置可以用来避免数据太小时看不到太细的节点\n   *  - 建议小于5px\n   */\n  minNodeHeight?: number;\n  /**\n   * 数据不为零或空时边的最小大小\n   *  - 这个配置可以用来避免数据太小的时候看不到太细的链接\n   *  - 建议小于5px\n   *  - 当同时指定 `minNodeHeight` 和 `minLinkHeight` 两个选项时，此选项应小于 `minNodeHeight`\n   */\n  minLinkHeight?: number;\n  /**\n   * 数据不为零或空时节点的最大大小\n   * @since 1.12.14\n   */\n  maxNodeHeight?: number;\n  /**\n   * 数据不为零或空时边的最大大小\n   * - 当同时指定 `maxNodeHeight` 和 `maxLinkHeight` 两个选项时，此选项应小于 `maxNodeHeight`\n   * @since 1.12.14\n   */\n  maxLinkHeight?: number;\n  /** 布局的迭代次数 */\n  iterations?: number;\n  /** 解析node的key，defaultValue */\n  nodeKey?: string | number | ((datum: SankeyNodeDatum) => string | number);\n  /** 自定义node的depth */\n  depthKey?: string | number | ((datum: SankeyNodeDatum) => string | number);\n  /** 按此funtion排序link */\n  linkSortBy?: (a: SankeyLinkElement, b: SankeyLinkElement) => number;\n  /** 按此funtion排序node */\n  nodeSortBy?: (a: SankeyNodeElement, b: SankeyNodeElement) => number;\n  /** 自定义指定节点层 */\n  setNodeLayer?: (datum: SankeyNodeDatum) => number;\n  /**\n   * 是否丢弃孤立的节点\n   * @since 1.11.0\n   */\n  dropIsolatedNode?: boolean;\n  /**\n   * set the height of node\n   * @since 1.11.0\n   */\n  nodeHeight?: number | ((node: SankeyNodeElement) => number);\n  /**\n   * set the height of link\n   * @since 1.11.0\n   */\n  linkHeight?: number | ((link: SankeyLinkElement, sourceNode: SankeyNodeElement, sourceNodeHeight: number) => number);\n  /**\n   * each node has same height\n   * @since 1.11.0\n   */\n  equalNodeHeight?: boolean;\n  /**\n   * the layout type of link\n   * @since 1.11.0\n   */\n  linkOverlap?: 'start' | 'center' | 'end';\n\n  /** 节点配置 */\n  [SeriesMarkNameEnum.node]?: IMarkSpec<IRectMarkSpec>;\n\n  /** 边配置 */\n  [SeriesMarkNameEnum.link]?: IMarkSpec<ILinkPathMarkSpec>;\n\n  /** 联动交互配置 */\n  emphasis?: {\n    /** 是否开启交互 */\n    enable: boolean;\n    /**\n     * 交互触发类型\n     * 默认为‘click'\n     */\n    trigger?: 'click' | 'hover';\n    /**桑基图提供3种在节点上的交互联动效果\n     * self: 仅高亮当前节点。\n     * adjacency: 高亮当前节点上下游节点和关联的边，淡化其它图形元素。\n     * related： 高亮与当前节点相关的整条路径上的节点和边，淡化其它图形元素。 */\n    effect: 'self' | 'adjacency' | 'related';\n    /**\n     * 高亮状态\n     * @default 'selected'\n     * @since 1.13.13\n     */\n    highlightState?: string;\n    /**\n     * 失焦状态\n     * @default 'blur'\n     * @since 1.13.13\n     */\n    blurState?: string;\n  };\n\n  /** 标签配置 */\n  [SeriesMarkNameEnum.label]?: ISankeyLabelSpec | ISankeyLabelSpec[];\n\n  /**\n   * 当制定了节点、边的宽度的时候，可以配置这个属性\n   * 当宽度大于图表region的宽度、高度大于图表resion高度的时候是否自动产生滚动条\n   * @since 1.13.0\n   */\n  overflow?: 'scroll' | 'hidden' | 'scroll-x' | 'scroll-y';\n\n  /** 进度条配置 */\n  // scroll?: IScrollSpec & {\n  //   /** 是否开启进度条 */\n  //   enable: boolean;\n  // };\n\n  /**\n   * 自定义布局\n   * @since 1.13.19\n   */\n  customLayout?: (\n    layout: SankeyLayout,\n    originalData: SankeyData,\n    view: ReturnType<ISankeyOpt['view']>\n  ) => ReturnType<SankeyLayout['layout']>;\n}\n\nexport interface SankeyLinkDatum {\n  source: string | number;\n  target: string | number;\n  value?: number;\n}\n\nexport interface SankeyNodeDatum {\n  value?: number;\n}\n\nexport interface HierarchyNodeDatum {\n  value?: number;\n  children?: HierarchyNodeDatum[];\n}\n\nexport type SankeyData =\n  | {\n      nodes?: SankeyNodeDatum[];\n      links: SankeyLinkDatum[];\n    }\n  | {\n      nodes: HierarchyNodeDatum[];\n    };\n\n/**\n * The node element after sankey layout\n */\nexport interface SankeyNodeElement {\n  key: string | number;\n  index: number;\n  /** the depth of node, from source to target */\n  depth: number;\n\n  /** the depth of node, from target to source */\n  endDepth?: number;\n  /** the final layer index after layout */\n  layer?: number;\n  isLastLayer?: boolean;\n  value: number;\n  datum: SankeyNodeDatum;\n  sourceLinks: SankeyLinkElement[];\n  targetLinks: SankeyLinkElement[];\n  x0?: number;\n  y0?: number;\n  x1?: number;\n  y1?: number;\n}\n/**\n * the link element after sankey layout\n */\nexport interface SankeyLinkElement {\n  vertical?: boolean;\n  index: number;\n  source: string | number;\n  target: string | number;\n  value: number;\n  datum: SankeyLinkDatum | SankeyLinkDatum[];\n  thickness?: number;\n  sourceRect?: { x0: number; x1: number; y0: number; y1: number };\n  targetRect?: { x0: number; x1: number; y0: number; y1: number };\n  /** this will only be generate in hierarchy node data*/\n  parents?: (string | number)[];\n  y0?: number;\n  y1?: number;\n  x0?: number;\n  x1?: number;\n}\n\nexport type SankeyLayoutResult = {\n  nodes: SankeyNodeElement[];\n  links: SankeyLinkElement[];\n  columns: SankeyNodeElement[][];\n}[];\n\nexport interface ISankeySeriesTheme {\n  [SeriesMarkNameEnum.node]?: IMarkTheme<IRectMarkSpec>;\n  [SeriesMarkNameEnum.link]?: IMarkTheme<ILinkPathMarkSpec>;\n}\n"]}

package/cjs/series/sankey/sankey.js

@@ -121,6 +121,7 @@ class SankeySeries extends cartesian_1.CartesianSeries {
                     maxLinkHeight: this._spec.maxLinkHeight,
                     iterations: this._spec.iterations,
                     nodeKey: this._spec.nodeKey,
+                    depthKey: this._spec.depthKey,
                     linkSortBy: this._spec.linkSortBy,
                     nodeSortBy: this._spec.nodeSortBy,
                     setNodeLayer: this._spec.setNodeLayer,
@@ -129,7 +130,8 @@ class SankeySeries extends cartesian_1.CartesianSeries {
                     linkHeight: this._spec.linkHeight,
                     equalNodeHeight: this._spec.equalNodeHeight,
                     linkOverlap: this._spec.linkOverlap,
-                    inverse: this._spec.inverse
+                    inverse: this._spec.inverse,
+                    customLayout: this._spec.customLayout
                 },
                 level: initialize_1.TransformLevel.sankeyLayout
             });