@antv/s2/lib/extends/pivot-chart/pivot-chart-sheet.js

effective spreadsheet render core lib

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.PivotChartSheet = void 0;
const s2_1 = require("@antv/s2");
const lodash_1 = require("lodash");
const pivot_chart_data_cell_1 = require("./cell/pivot-chart-data-cell");
const constant_1 = require("./constant");
const pivot_chart_facet_1 = require("./facet/pivot-chart-facet");
const root_1 = require("./interaction/root");
const theme_1 = require("./utils/theme");
class PivotChartSheet extends s2_1.PivotSheet {
    initInteraction() {
        var _a, _b;
        (_b = (_a = this.interaction) === null || _a === void 0 ? void 0 : _a.destroy) === null || _b === void 0 ? void 0 : _b.call(_a);
        this.interaction = new root_1.RootInteraction(this);
    }
    setupDataConfig(dataCfg) {
        this.dataCfg = (0, s2_1.setupDataConfig)(dataCfg, constant_1.FIXED_DATA_CONFIG);
    }
    setupOptions(options) {
        this.options = (0, s2_1.setupOptions)(constant_1.DEFAULT_OPTIONS, this.getRuntimeDefaultOptions(options), options, this.getRuntimeFixedOptions(), constant_1.FIXED_OPTIONS);
    }
    setThemeCfg(themeCfg = {}, getCustomTheme = theme_1.getCustomTheme) {
        super.setThemeCfg(themeCfg, getCustomTheme);
    }
    buildFacet() {
        var _a, _b, _c, _d, _e;
        var _f;
        if (this.isCustomRowFields() || this.isCustomColumnFields()) {
            super.buildFacet();
            return;
        }
        const defaultCell = (viewMeta) => new pivot_chart_data_cell_1.PivotChartDataCell(viewMeta, this);
        (_a = (_f = this.options).dataCell) !== null && _a !== void 0 ? _a : (_f.dataCell = defaultCell);
        (_b = this.facet) === null || _b === void 0 ? void 0 : _b.destroy();
        this.facet = (_e = (_d = (_c = this.options).facet) === null || _d === void 0 ? void 0 : _d.call(_c, this)) !== null && _e !== void 0 ? _e : new pivot_chart_facet_1.PivotChartFacet(this);
        this.facet.render();
    }
    getRuntimeDefaultOptions(options) {
        var _a;
        const { rows = [], columns = [], valueInCols = true, } = (_a = this.dataCfg.fields) !== null && _a !== void 0 ? _a : {};
        /**
         * 下面的逻辑准则：
         *    如果是笛卡尔坐标系，希望 x 轴 dimension 的每个维度默认宽度大致相同，y 轴 measure 的宽度始终保持都相同
         *      比如对于 rows: province-> city , value: number 来说
         *         四川下面有 n 个城市，北京下面有 m 个城市，那么四川的宽度是 n * width, 北京的宽度是 m * width
         *         而不管是四川，还是北京， y 轴展示的都是 number 的值，那么 y 轴的宽度保持相同，能快速通过图形的尺寸看出数据的相对大小。
         *    如果是极坐标系， 希望 x 轴宽度相同，y 轴 measure 的宽度也都相同
         *         比如对于 rows: province-> city , value: number 来说
         *         四川下面有 n 个城市，北京下面有 m 个城市，那么四川的宽度是 width, 北京的宽度也是 width，不再以维度数量作为依据，能让数据的呈现效果更好
         */
        const isPolar = this.isPolarCoordinate(options);
        if (valueInCols) {
            const lastRow = (0, lodash_1.last)(rows);
            return {
                style: {
                    rowCell: {
                        widthByField: {
                            [lastRow]: constant_1.DEFAULT_ROW_AXIS_SIZE,
                        },
                    },
                    colCell: {
                        heightByField: {
                            [s2_1.EXTRA_FIELD]: constant_1.DEFAULT_COL_AXIS_SIZE,
                        },
                    },
                    dataCell: {
                        width: constant_1.DEFAULT_MEASURE_SIZE,
                        height: isPolar ? constant_1.DEFAULT_MEASURE_SIZE : constant_1.DEFAULT_DIMENSION_SIZE,
                    },
                },
            };
        }
        const lastCol = (0, lodash_1.last)(columns);
        return {
            style: {
                rowCell: {
                    widthByField: {
                        [s2_1.EXTRA_FIELD]: constant_1.DEFAULT_ROW_AXIS_SIZE,
                    },
                },
                colCell: {
                    heightByField: {
                        [lastCol]: constant_1.DEFAULT_COL_AXIS_SIZE,
                    },
                },
                dataCell: {
                    width: isPolar ? constant_1.DEFAULT_MEASURE_SIZE : constant_1.DEFAULT_DIMENSION_SIZE,
                    height: constant_1.DEFAULT_MEASURE_SIZE,
                },
            },
        };
    }
    getRuntimeFixedOptions() {
        var _a;
        const { valueInCols = true } = (_a = this.dataCfg.fields) !== null && _a !== void 0 ? _a : {};
        if (valueInCols) {
            return {
                interaction: {
                    resize: {
                        rowResizeType: s2_1.ResizeType.CURRENT,
                        colResizeType: s2_1.ResizeType.ALL,
                    },
                },
            };
        }
        return {
            interaction: {
                resize: {
                    rowResizeType: s2_1.ResizeType.ALL,
                    colResizeType: s2_1.ResizeType.CURRENT,
                },
            },
        };
    }
    isPolarCoordinate(options = this.options) {
        var _a;
        return ((_a = options === null || options === void 0 ? void 0 : options.chart) === null || _a === void 0 ? void 0 : _a.coordinate) === 'polar';
    }
    enableAsyncExport() {
        return new Error("pivot chart doesn't support export all data");
    }
}
exports.PivotChartSheet = PivotChartSheet;
//# sourceMappingURL=pivot-chart-sheet.js.map