@visactor/vtable 0.25.4 → 0.26.0-alpha.0

package/es/PivotChart.d.ts

@@ -5,7 +5,11 @@ import { Dataset } from './dataset/dataset';
 import { BaseTable } from './core/BaseTable';
 import type { PivotChartProtected } from './ts-types/base-table';
 import type { ITableAxisOption } from './ts-types/component/axis';
+import { type LayouTreeNode } from './layout/tree-helper';
 export declare class PivotChart extends BaseTable implements PivotChartAPI {
+    layoutNodeId: {
+        seqId: number;
+    };
     internalProps: PivotChartProtected;
     options: PivotChartConstructorOptions;
     pivotSortState: PivotSortState[];
@@ -91,4 +95,9 @@ export declare class PivotChart extends BaseTable implements PivotChartAPI {
     setRecords(records: Array<any>): void;
     _hasCustomRenderOrLayout(): boolean;
     changeRecordOrder(source: number, target: number): void;
+    getLayoutColumnTree(): LayouTreeNode[];
+    getLayoutColumnTreeCount(): number;
+    getLayoutRowTree(): LayouTreeNode[];
+    getLayoutRowTreeCount(): number;
+    getCellHeaderTreeNodes(col: number, row: number): ICellHeaderPaths;
 }

package/es/PivotChart.js

@@ -26,12 +26,21 @@ import { TABLE_EVENT_TYPE } from "./core/TABLE_EVENT_TYPE";
 
 import { cloneDeepSpec } from "./vutil-extension-temp";
 
+import { DimensionTree } from "./layout/tree-helper";
+
+import { IndicatorDimensionKeyPlaceholder } from "./tools/global";
+
+import { checkHasCartesianChart } from "./layout/chart-helper/get-chart-spec";
+
 export class PivotChart extends BaseTable {
     constructor(container, options) {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
+        let columnDimensionTree, rowDimensionTree;
         "node" === Env.mode ? (options = container, container = null) : container instanceof HTMLElement || (options = container, 
         container = container.container ? container.container : null), super(container, options), 
-        this._selectedDataItemsInChart = [], this._selectedDimensionInChart = [], this._chartEventMap = {}, 
+        this.layoutNodeId = {
+            seqId: 0
+        }, this._selectedDataItemsInChart = [], this._selectedDimensionInChart = [], this._chartEventMap = {}, 
         options.layout && Object.assign(options, options.layout), this.internalProps.columns = cloneDeep(options.columns), 
         this.internalProps.rows = cloneDeep(options.rows), this.internalProps.indicators = cloneDeepSpec(options.indicators), 
         this.internalProps.columnTree = !options.indicatorsAsCol || (null === (_a = options.columns) || void 0 === _a ? void 0 : _a.length) || options.columnTree ? cloneDeep(options.columnTree) : [], 
@@ -40,17 +49,35 @@ export class PivotChart extends BaseTable {
         this.internalProps.rowResizeType = null !== (_d = options.rowResizeType) && void 0 !== _d ? _d : "row", 
         this.internalProps.dataConfig = {
             isPivotChart: !0
-        }, this._axes = isArray(options.axes) ? options.axes : [];
-        const rowKeys = null !== (_f = null === (_e = options.rows) || void 0 === _e ? void 0 : _e.reduce(((keys, rowObj) => ("string" == typeof rowObj ? keys.push(rowObj) : keys.push(rowObj.dimensionKey), 
-        keys)), [])) && void 0 !== _f ? _f : [], columnKeys = null !== (_h = null === (_g = options.columns) || void 0 === _g ? void 0 : _g.reduce(((keys, columnObj) => ("string" == typeof columnObj ? keys.push(columnObj) : keys.push(columnObj.dimensionKey), 
-        keys)), [])) && void 0 !== _h ? _h : [], indicatorKeys = null !== (_k = null === (_j = options.indicators) || void 0 === _j ? void 0 : _j.reduce(((keys, indicatorObj) => ("string" == typeof indicatorObj ? keys.push(indicatorObj) : keys.push(indicatorObj.indicatorKey), 
-        keys)), [])) && void 0 !== _k ? _k : [];
-        this.internalProps.dataConfig.collectValuesBy = this._generateCollectValuesConfig(columnKeys, rowKeys), 
+        }, this._axes = isArray(options.axes) ? options.axes : [], options.columnTree && (columnDimensionTree = new DimensionTree(null !== (_e = this.internalProps.columnTree) && void 0 !== _e ? _e : [], this.layoutNodeId)), 
+        options.rowTree && (rowDimensionTree = new DimensionTree(null !== (_f = this.internalProps.rowTree) && void 0 !== _f ? _f : [], this.layoutNodeId));
+        const rowKeys = (null === (_g = null == rowDimensionTree ? void 0 : rowDimensionTree.dimensionKeys) || void 0 === _g ? void 0 : _g.count) ? rowDimensionTree.dimensionKeys.valueArr() : null !== (_j = null === (_h = options.rows) || void 0 === _h ? void 0 : _h.reduce(((keys, rowObj) => ("string" == typeof rowObj ? keys.push(rowObj) : keys.push(rowObj.dimensionKey), 
+        keys)), [])) && void 0 !== _j ? _j : [], columnKeys = (null === (_k = null == columnDimensionTree ? void 0 : columnDimensionTree.dimensionKeys) || void 0 === _k ? void 0 : _k.count) ? columnDimensionTree.dimensionKeys.valueArr() : null !== (_m = null === (_l = options.columns) || void 0 === _l ? void 0 : _l.reduce(((keys, columnObj) => ("string" == typeof columnObj ? keys.push(columnObj) : keys.push(columnObj.dimensionKey), 
+        keys)), [])) && void 0 !== _m ? _m : [], indicatorKeys = null !== (_p = null === (_o = options.indicators) || void 0 === _o ? void 0 : _o.reduce(((keys, indicatorObj) => ("string" == typeof indicatorObj ? keys.push(indicatorObj) : keys.push(indicatorObj.indicatorKey), 
+        keys)), [])) && void 0 !== _p ? _p : [];
+        if (this.internalProps.dataConfig.collectValuesBy = this._generateCollectValuesConfig(columnKeys, rowKeys), 
         this.internalProps.dataConfig.aggregationRules = this._generateAggregationRules(), 
         this.internalProps.dataConfig.dimensionSortArray = this._getDimensionSortArray(), 
-        this.dataset = new Dataset(this.internalProps.dataConfig, rowKeys, columnKeys, indicatorKeys, this.internalProps.indicators, null === (_l = options.indicatorsAsCol) || void 0 === _l || _l, options.records, void 0, this.internalProps.columnTree, this.internalProps.rowTree, !0), 
-        this.internalProps.layoutMap = new PivotHeaderLayoutMap(this, this.dataset), this.refreshHeader(), 
-        this.scenegraph.createSceneGraph(), options.title && (this.internalProps.title = new Title(options.title, this), 
+        this.dataset = new Dataset(this.internalProps.dataConfig, rowKeys, columnKeys, indicatorKeys, this.internalProps.indicators, null === (_q = options.indicatorsAsCol) || void 0 === _q || _q, options.records, void 0, this.internalProps.columnTree, this.internalProps.rowTree, !0), 
+        this.options.indicatorsAsCol && checkHasCartesianChart(this.internalProps.indicators)) {
+            const supplyAxisNode = nodes => {
+                nodes.forEach((node => {
+                    var _a;
+                    (null === (_a = node.children) || void 0 === _a ? void 0 : _a.length) ? supplyAxisNode(node.children) : node.children = [ {
+                        dimensionKey: "axis",
+                        value: ""
+                    } ];
+                }));
+            };
+            (null === (_r = this.dataset.rowHeaderTree) || void 0 === _r ? void 0 : _r.length) ? supplyAxisNode(this.dataset.rowHeaderTree) : this.dataset.rowHeaderTree = [ {
+                dimensionKey: "axis",
+                value: ""
+            } ];
+        }
+        columnDimensionTree = new DimensionTree(null !== (_s = this.dataset.colHeaderTree) && void 0 !== _s ? _s : [], this.layoutNodeId), 
+        rowDimensionTree = new DimensionTree(null !== (_t = this.dataset.rowHeaderTree) && void 0 !== _t ? _t : [], this.layoutNodeId), 
+        this.internalProps.layoutMap = new PivotHeaderLayoutMap(this, this.dataset, columnDimensionTree, rowDimensionTree), 
+        this.refreshHeader(), this.scenegraph.createSceneGraph(), options.title && (this.internalProps.title = new Title(options.title, this), 
         this.scenegraph.resize()), setTimeout((() => {
             this.fireListeners(TABLE_EVENT_TYPE.INITIALIZED, null);
         }), 0);
@@ -83,10 +110,13 @@ export class PivotChart extends BaseTable {
         return ifCan;
     }
     updateOption(options) {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
         const internalProps = this.internalProps;
-        super.updateOption(options), this.internalProps.columns = cloneDeep(options.columns), 
-        this.internalProps.rows = cloneDeep(options.rows), this.internalProps.indicators = (null === (_a = options.indicators) || void 0 === _a ? void 0 : _a.length) ? cloneDeepSpec(options.indicators) : [], 
+        let columnDimensionTree, rowDimensionTree;
+        super.updateOption(options), this.layoutNodeId = {
+            seqId: 0
+        }, this.internalProps.columns = cloneDeep(options.columns), this.internalProps.rows = cloneDeep(options.rows), 
+        this.internalProps.indicators = (null === (_a = options.indicators) || void 0 === _a ? void 0 : _a.length) ? cloneDeepSpec(options.indicators) : [], 
         this.internalProps.columnTree = !options.indicatorsAsCol || (null === (_b = options.columns) || void 0 === _b ? void 0 : _b.length) || options.columnTree ? cloneDeep(options.columnTree) : [], 
         this.internalProps.rowTree = options.indicatorsAsCol || (null === (_c = options.rows) || void 0 === _c ? void 0 : _c.length) || options.rowTree ? cloneDeep(options.rowTree) : [], 
         options.records && (this.internalProps.records = options.records), this.setCustomStateNameToSpec(), 
@@ -94,17 +124,35 @@ export class PivotChart extends BaseTable {
         internalProps.rowResizeType = null !== (_e = options.rowResizeType) && void 0 !== _e ? _e : "row", 
         internalProps.dataConfig = {
             isPivotChart: !0
-        }, this._axes = isArray(options.axes) ? options.axes : [];
-        const rowKeys = null !== (_g = null === (_f = options.rows) || void 0 === _f ? void 0 : _f.reduce(((keys, rowObj) => ("string" == typeof rowObj ? keys.push(rowObj) : keys.push(rowObj.dimensionKey), 
-        keys)), [])) && void 0 !== _g ? _g : [], columnKeys = null !== (_j = null === (_h = options.columns) || void 0 === _h ? void 0 : _h.reduce(((keys, columnObj) => ("string" == typeof columnObj ? keys.push(columnObj) : keys.push(columnObj.dimensionKey), 
-        keys)), [])) && void 0 !== _j ? _j : [], indicatorKeys = null !== (_l = null === (_k = options.indicators) || void 0 === _k ? void 0 : _k.reduce(((keys, indicatorObj) => ("string" == typeof indicatorObj ? keys.push(indicatorObj) : keys.push(indicatorObj.indicatorKey), 
-        keys)), [])) && void 0 !== _l ? _l : [];
-        return this.internalProps.dataConfig.collectValuesBy = this._generateCollectValuesConfig(columnKeys, rowKeys), 
+        }, this._axes = isArray(options.axes) ? options.axes : [], options.columnTree && (columnDimensionTree = new DimensionTree(null !== (_f = this.internalProps.columnTree) && void 0 !== _f ? _f : [], this.layoutNodeId)), 
+        options.rowTree && (rowDimensionTree = new DimensionTree(null !== (_g = this.internalProps.rowTree) && void 0 !== _g ? _g : [], this.layoutNodeId));
+        const rowKeys = (null === (_h = null == rowDimensionTree ? void 0 : rowDimensionTree.dimensionKeys) || void 0 === _h ? void 0 : _h.count) ? rowDimensionTree.dimensionKeys.valueArr() : null !== (_k = null === (_j = options.rows) || void 0 === _j ? void 0 : _j.reduce(((keys, rowObj) => ("string" == typeof rowObj ? keys.push(rowObj) : keys.push(rowObj.dimensionKey), 
+        keys)), [])) && void 0 !== _k ? _k : [], columnKeys = (null === (_l = null == columnDimensionTree ? void 0 : columnDimensionTree.dimensionKeys) || void 0 === _l ? void 0 : _l.count) ? columnDimensionTree.dimensionKeys.valueArr() : null !== (_o = null === (_m = options.columns) || void 0 === _m ? void 0 : _m.reduce(((keys, columnObj) => ("string" == typeof columnObj ? keys.push(columnObj) : keys.push(columnObj.dimensionKey), 
+        keys)), [])) && void 0 !== _o ? _o : [], indicatorKeys = null !== (_q = null === (_p = options.indicators) || void 0 === _p ? void 0 : _p.reduce(((keys, indicatorObj) => ("string" == typeof indicatorObj ? keys.push(indicatorObj) : keys.push(indicatorObj.indicatorKey), 
+        keys)), [])) && void 0 !== _q ? _q : [];
+        if (this.internalProps.dataConfig.collectValuesBy = this._generateCollectValuesConfig(columnKeys, rowKeys), 
         this.internalProps.dataConfig.aggregationRules = this._generateAggregationRules(), 
         this.internalProps.dataConfig.dimensionSortArray = this._getDimensionSortArray(), 
-        this.dataset = new Dataset(this.internalProps.dataConfig, rowKeys, columnKeys, indicatorKeys, this.internalProps.indicators, null === (_m = options.indicatorsAsCol) || void 0 === _m || _m, null !== (_o = options.records) && void 0 !== _o ? _o : this.internalProps.records, void 0, this.internalProps.columnTree, this.internalProps.rowTree, !0), 
-        internalProps.layoutMap = new PivotHeaderLayoutMap(this, this.dataset), this.refreshHeader(), 
-        internalProps.releaseList && (internalProps.releaseList.forEach((releaseObj => {
+        this.dataset = new Dataset(this.internalProps.dataConfig, rowKeys, columnKeys, indicatorKeys, this.internalProps.indicators, null === (_r = options.indicatorsAsCol) || void 0 === _r || _r, null !== (_s = options.records) && void 0 !== _s ? _s : this.internalProps.records, void 0, this.internalProps.columnTree, this.internalProps.rowTree, !0), 
+        this.options.indicatorsAsCol && checkHasCartesianChart(this.internalProps.indicators)) {
+            const supplyAxisNode = nodes => {
+                nodes.forEach((node => {
+                    var _a;
+                    (null === (_a = node.children) || void 0 === _a ? void 0 : _a.length) ? supplyAxisNode(node.children) : node.children = [ {
+                        dimensionKey: "axis",
+                        value: ""
+                    } ];
+                }));
+            };
+            (null === (_t = this.dataset.rowHeaderTree) || void 0 === _t ? void 0 : _t.length) ? supplyAxisNode(this.dataset.rowHeaderTree) : this.dataset.rowHeaderTree = [ {
+                dimensionKey: "axis",
+                value: ""
+            } ];
+        }
+        return columnDimensionTree = new DimensionTree(null !== (_u = this.dataset.colHeaderTree) && void 0 !== _u ? _u : [], this.layoutNodeId), 
+        rowDimensionTree = new DimensionTree(null !== (_v = this.dataset.rowHeaderTree) && void 0 !== _v ? _v : [], this.layoutNodeId), 
+        internalProps.layoutMap = new PivotHeaderLayoutMap(this, this.dataset, columnDimensionTree, rowDimensionTree), 
+        this.refreshHeader(), internalProps.releaseList && (internalProps.releaseList.forEach((releaseObj => {
             var _a;
             return null === (_a = null == releaseObj ? void 0 : releaseObj.release) || void 0 === _a ? void 0 : _a.call(releaseObj);
         })), internalProps.releaseList = null), this.scenegraph.clearCells(), this.scenegraph.createSceneGraph(), 
@@ -172,7 +220,7 @@ export class PivotChart extends BaseTable {
             })), rowKeys = cellDimensionPath.rowHeaderPaths.map((rowPath => {
                 var _a;
                 return null !== (_a = rowPath.indicatorKey) && void 0 !== _a ? _a : rowPath.value;
-            })), aggregator = this.dataset.getAggregator(this.internalProps.layoutMap.indicatorsAsCol ? rowKeys : rowKeys.slice(0, -1), this.internalProps.layoutMap.indicatorsAsCol ? colKeys.slice(0, -1) : colKeys, this.internalProps.layoutMap.getIndicatorKey(col, row));
+            })), aggregator = this.dataset.getAggregator(rowKeys, colKeys, this.internalProps.layoutMap.getIndicatorKey(col, row));
             return aggregator.value ? aggregator.value() : void 0;
         }
         const {fieldFormat: fieldFormat} = this.internalProps.layoutMap.getBody(col, row), rowIndex = this.getBodyIndexByRow(row), colIndex = this.getBodyIndexByCol(col), dataValue = null === (_c = this.records[rowIndex]) || void 0 === _c ? void 0 : _c[colIndex];
@@ -203,7 +251,7 @@ export class PivotChart extends BaseTable {
             })), rowKeys = cellDimensionPath.rowHeaderPaths.map((rowPath => {
                 var _a;
                 return null !== (_a = rowPath.indicatorKey) && void 0 !== _a ? _a : rowPath.value;
-            })), aggregator = this.dataset.getAggregator(this.internalProps.layoutMap.indicatorsAsCol ? rowKeys : rowKeys.slice(0, -1), this.internalProps.layoutMap.indicatorsAsCol ? colKeys.slice(0, -1) : colKeys, this.internalProps.layoutMap.getIndicatorKey(col, row));
+            })), aggregator = this.dataset.getAggregator(rowKeys, colKeys, this.internalProps.layoutMap.getIndicatorKey(col, row));
             return aggregator.value ? aggregator.value() : void 0;
         }
         const rowIndex = this.getBodyIndexByRow(row), colIndex = this.getBodyIndexByCol(col);
@@ -221,7 +269,7 @@ export class PivotChart extends BaseTable {
                 var _a;
                 return null !== (_a = rowPath.indicatorKey) && void 0 !== _a ? _a : rowPath.value;
             }));
-            return this.dataset.getAggregator(this.internalProps.layoutMap.indicatorsAsCol ? rowKeys : rowKeys.slice(0, -1), this.internalProps.layoutMap.indicatorsAsCol ? colKeys.slice(0, -1) : colKeys, this.internalProps.layoutMap.getIndicatorKey(col, row)).records;
+            return this.dataset.getAggregator(rowKeys, colKeys, this.internalProps.layoutMap.getIndicatorKey(col, row)).records;
         }
     }
     getCellRawRecord(col, row) {
@@ -318,6 +366,8 @@ export class PivotChart extends BaseTable {
     }
     _generateCollectValuesConfig(columnKeys, rowKeys) {
         var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
+        columnKeys = columnKeys.filter((key => key !== IndicatorDimensionKeyPlaceholder)), 
+        rowKeys = rowKeys.filter((key => key !== IndicatorDimensionKeyPlaceholder));
         const indicators = this.internalProps.indicators, collectValuesBy = {};
         for (let i = 0, len = null == indicators ? void 0 : indicators.length; i < len; i++) if ("string" != typeof indicators[i] && indicators[i].chartSpec) {
             if ("pie" === (null === (_a = indicators[i].chartSpec) || void 0 === _a ? void 0 : _a.type) || "rose" === (null === (_b = indicators[i].chartSpec) || void 0 === _b ? void 0 : _b.type) || "radar" === (null === (_c = indicators[i].chartSpec) || void 0 === _c ? void 0 : _c.type) || "gauge" === (null === (_d = indicators[i].chartSpec) || void 0 === _d ? void 0 : _d.type) || "wordCloud" === (null === (_e = indicators[i].chartSpec) || void 0 === _e ? void 0 : _e.type)) continue;
@@ -565,14 +615,17 @@ export class PivotChart extends BaseTable {
         }
     }
     setRecords(records) {
+        var _a, _b;
         const oldHoverState = {
             col: this.stateManager.hover.cellPos.col,
             row: this.stateManager.hover.cellPos.row
         };
         this.options.records = this.internalProps.records = records;
-        this.options;
-        const internalProps = this.internalProps;
-        this.dataset.setRecords(records), internalProps.layoutMap = new PivotHeaderLayoutMap(this, this.dataset), 
+        const options = this.options, internalProps = this.internalProps;
+        let columnDimensionTree, rowDimensionTree;
+        this.dataset.setRecords(records), columnDimensionTree = options.columnTree ? internalProps.layoutMap.columnDimensionTree : new DimensionTree(null !== (_a = this.dataset.colHeaderTree) && void 0 !== _a ? _a : [], this.layoutNodeId), 
+        rowDimensionTree = options.rowTree ? internalProps.layoutMap.rowDimensionTree : new DimensionTree(null !== (_b = this.dataset.rowHeaderTree) && void 0 !== _b ? _b : [], this.layoutNodeId), 
+        internalProps.layoutMap = new PivotHeaderLayoutMap(this, this.dataset, columnDimensionTree, rowDimensionTree), 
         this.refreshHeader(), this.scenegraph.clearCells(), this.clearCellStyleCache(), 
         this.scenegraph.createSceneGraph(), this.stateManager.updateHoverPos(oldHoverState.col, oldHoverState.row), 
         this.internalProps.title && !this.internalProps.title.isReleased && (this._updateSize(), 
@@ -596,5 +649,20 @@ export class PivotChart extends BaseTable {
         return !1;
     }
     changeRecordOrder(source, target) {}
+    getLayoutColumnTree() {
+        return this.internalProps.layoutMap.getLayoutColumnTree();
+    }
+    getLayoutColumnTreeCount() {
+        return this.internalProps.layoutMap.getLayoutColumnTreeCount();
+    }
+    getLayoutRowTree() {
+        return this.internalProps.layoutMap.getLayoutRowTree();
+    }
+    getLayoutRowTreeCount() {
+        return this.internalProps.layoutMap.getLayoutRowTreeCount();
+    }
+    getCellHeaderTreeNodes(col, row) {
+        return this.internalProps.layoutMap.getCellHeaderPathsWithTreeNode(col, row);
+    }
 }
 //# sourceMappingURL=PivotChart.js.map