UNPKG

@visactor/vtable

Version:

canvas table width high performance

399 lines (381 loc) 25.4 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: !0 }), exports.getAxisRangeAndTicks = exports.hasLinearAxis = exports.isLeftOrRightAxis = exports.isTopOrBottomAxis = exports.getAxisRange = exports.getAxisOption = exports.getAxisConfigInPivotChart = void 0; const vutils_1 = require("@visactor/vutils"), zero_align_1 = require("./zero-align"), factory_1 = require("../../core/factory"), padding_1 = require("../../scenegraph/utils/padding"), get_prop_1 = require("../../scenegraph/utils/get-prop"), tick_align_1 = require("./tick-align"); function getAxisConfigInPivotChart(col, row, layout) { var _a, _b, _c, _d, _e, _f, _g; if (layout._table.isPivotChart()) if (layout.indicatorsAsCol) { if (layout.hasTwoIndicatorAxes && row === layout.columnHeaderLevelCount - 1 && col >= layout.rowHeaderLevelCount && col < layout.colCount - layout.rightFrozenColCount) { const axisRange = getRange("top", col, row + 1, col, layout.columnHeaderLevelCount - 1, col, row, 1, layout); if (!axisRange) return; const chartCellStyle = layout._table._getCellStyle(col, row + 1), padding = (0, padding_1.getQuadProps)((0, get_prop_1.getProp)("padding", chartCellStyle, col, row + 1, layout._table)), {range: range, ticks: ticks, axisOption: axisOption, targetTicks: targetTicks, targetRange: targetRange, index: index, theme: theme} = axisRange; return (0, vutils_1.isNumber)(null == axisOption ? void 0 : axisOption.min) && (range.min = axisOption.min, range.min > 0 && (axisOption.zero = !1)), (0, vutils_1.isNumber)(null == axisOption ? void 0 : axisOption.max) && (range.max = axisOption.max, range.max < 0 && (axisOption.zero = !1)), (0, vutils_1.merge)({ range: range }, axisOption, { orient: "top", type: (null == axisOption ? void 0 : axisOption.type) || "linear", label: { flush: !0 }, tick: { tickMode: (0, tick_align_1.getTickModeFunction)(targetTicks, targetRange, range, index) }, __ticksForVTable: ticks, __vtableChartTheme: theme, __vtablePadding: padding }); } if (row === layout.rowCount - layout.bottomFrozenRowCount && col >= layout.rowHeaderLevelCount && col < layout.colCount - layout.rightFrozenColCount) { const indicatorKeys = layout.getIndicatorKeyInChartSpec(col, row); let indicatorInfo = null; null == indicatorKeys || indicatorKeys.forEach((key => { const info = layout.getIndicatorInfo(key); info && (indicatorInfo = info); })); const axisRange = getRange("bottom", col, row - 1, col, row, col, row, 0, layout); if (!axisRange) return; const chartCellStyle = layout._table._getCellStyle(col, row - 1), padding = (0, padding_1.getQuadProps)((0, get_prop_1.getProp)("padding", chartCellStyle, col, row - 1, layout._table)), {range: range, ticks: ticks, axisOption: axisOption, index: index, targetTicks: targetTicks, targetRange: targetRange, theme: theme} = axisRange; return (0, vutils_1.isNumber)(null == axisOption ? void 0 : axisOption.min) && (range.min = axisOption.min, range.min > 0 && (axisOption.zero = !1)), (0, vutils_1.isNumber)(null == axisOption ? void 0 : axisOption.max) && (range.max = axisOption.max, range.max < 0 && (axisOption.zero = !1)), (0, vutils_1.merge)({ title: { visible: !0, text: null == indicatorInfo ? void 0 : indicatorInfo.title }, range: range }, axisOption, { orient: "bottom", type: (null == axisOption ? void 0 : axisOption.type) || "linear", label: { flush: !0 }, tick: { tickMode: (0, tick_align_1.getTickModeFunction)(targetTicks, targetRange, range, index) }, __ticksForVTable: ticks, __vtableChartTheme: theme, __vtablePadding: padding }); } if (col === layout.rowHeaderLevelCount - 1 && row >= layout.columnHeaderLevelCount && row < layout.rowCount - layout.bottomFrozenRowCount) { let rowDimensionKey = layout.getDimensionKeyInChartSpec(layout.rowHeaderLevelCount, row); (0, vutils_1.isArray)(rowDimensionKey) && (rowDimensionKey = rowDimensionKey[0]); const data = null !== (_a = layout.dataset.collectedValues[rowDimensionKey]) && void 0 !== _a ? _a : [], rowPath = layout.getRowKeysPath(col, row), domain = null !== (_b = data[null != rowPath ? rowPath : ""]) && void 0 !== _b ? _b : [], {axisOption: axisOption, theme: theme, chartType: chartType} = getAxisOption(col + 1, row, "left", layout); if (!1 === (null == axisOption ? void 0 : axisOption.visible)) return; const chartCellStyle = layout._table._getCellStyle(col + 1, row), padding = (0, padding_1.getQuadProps)((0, get_prop_1.getProp)("padding", chartCellStyle, col + 1, row, layout._table)), spec = layout.getRawChartSpec(col + 1, row); return (0, vutils_1.merge)({ domain: "linear" === (null == axisOption ? void 0 : axisOption.type) ? void 0 : Array.from(domain), range: "linear" === (null == axisOption ? void 0 : axisOption.type) ? domain : void 0, title: { autoRotate: !0 } }, axisOption, { orient: "left", type: null !== (_c = null == axisOption ? void 0 : axisOption.type) && void 0 !== _c ? _c : "band", __vtableChartTheme: theme, inverse: transformInverse(axisOption, "horizontal" === (null !== (_d = null == spec ? void 0 : spec.direction) && void 0 !== _d ? _d : "scatter" === chartType ? "vertical" : "horizontal")), __vtablePadding: padding }); } } else { if (col === layout.rowHeaderLevelCount - 1 && row >= layout.columnHeaderLevelCount && row < layout.rowCount - layout.bottomFrozenRowCount) { const indicatorKeys = layout.getIndicatorKeyInChartSpec(col, row); let indicatorInfo = null; null == indicatorKeys || indicatorKeys.forEach((key => { const info = layout.getIndicatorInfo(key); info && (indicatorInfo = info); })); const axisRange = getRange("left", col + 1, row, col, row, col, row, 0, layout); if (!axisRange) return; const chartCellStyle = layout._table._getCellStyle(col + 1, row), padding = (0, padding_1.getQuadProps)((0, get_prop_1.getProp)("padding", chartCellStyle, col + 1, row, layout._table)), {range: range, ticks: ticks, axisOption: axisOption, index: index, targetTicks: targetTicks, targetRange: targetRange, theme: theme} = axisRange; return (0, vutils_1.isNumber)(null == axisOption ? void 0 : axisOption.min) && (range.min = axisOption.min, range.min > 0 && (axisOption.zero = !1)), (0, vutils_1.isNumber)(null == axisOption ? void 0 : axisOption.max) && (range.max = axisOption.max, range.max < 0 && (axisOption.zero = !1)), (0, vutils_1.merge)({ title: { visible: !0, text: null == indicatorInfo ? void 0 : indicatorInfo.title, autoRotate: !0 }, range: range }, axisOption, { orient: "left", type: (null == axisOption ? void 0 : axisOption.type) || "linear", label: { flush: !0 }, tick: { tickMode: (0, tick_align_1.getTickModeFunction)(targetTicks, targetRange, range, index) }, __ticksForVTable: ticks, __vtableChartTheme: theme, __vtablePadding: padding }); } if (col === layout.colCount - layout.rightFrozenColCount && row >= layout.columnHeaderLevelCount && row < layout.rowCount - layout.bottomFrozenRowCount) { const axisRange = getRange("right", col - 1, row, layout.rowHeaderLevelCount - 1, row, col, row, 1, layout); if (!axisRange) return; const chartCellStyle = layout._table._getCellStyle(col - 1, row), padding = (0, padding_1.getQuadProps)((0, get_prop_1.getProp)("padding", chartCellStyle, col - 1, row, layout._table)), {range: range, ticks: ticks, axisOption: axisOption, index: index, targetTicks: targetTicks, targetRange: targetRange, theme: theme} = axisRange; return (0, vutils_1.isNumber)(null == axisOption ? void 0 : axisOption.min) && (range.min = axisOption.min, range.min > 0 && (axisOption.zero = !1)), (0, vutils_1.isNumber)(null == axisOption ? void 0 : axisOption.max) && (range.max = axisOption.max, range.max < 0 && (axisOption.zero = !1)), (0, vutils_1.merge)({ range: range, title: { autoRotate: !0 } }, axisOption, { orient: "right", type: (null == axisOption ? void 0 : axisOption.type) || "linear", label: { flush: !0 }, tick: { tickMode: (0, tick_align_1.getTickModeFunction)(targetTicks, targetRange, range, index) }, __ticksForVTable: ticks, __vtableChartTheme: theme, __vtablePadding: padding }); } if (row === layout.rowCount - layout.bottomFrozenRowCount && col >= layout.rowHeaderLevelCount && col < layout.colCount - layout.rightFrozenColCount) { let columnDimensionKey = layout.getDimensionKeyInChartSpec(col, layout.columnHeaderLevelCount); (0, vutils_1.isArray)(columnDimensionKey) && (columnDimensionKey = columnDimensionKey[0]); const data = null !== (_e = layout.dataset.collectedValues[columnDimensionKey]) && void 0 !== _e ? _e : [], colPath = layout.getColKeysPath(col, row), domain = null !== (_f = null == data ? void 0 : data[null != colPath ? colPath : ""]) && void 0 !== _f ? _f : [], {axisOption: axisOption, isPercent: isPercent, theme: theme, chartType: chartType} = getAxisOption(col, row - 1, "bottom", layout); if (!1 === (null == axisOption ? void 0 : axisOption.visible)) return; const chartCellStyle = layout._table._getCellStyle(col, row - 1), padding = (0, padding_1.getQuadProps)((0, get_prop_1.getProp)("padding", chartCellStyle, col, row - 1, layout._table)); return (0, vutils_1.merge)({ domain: "linear" === (null == axisOption ? void 0 : axisOption.type) ? void 0 : Array.from(domain), range: "linear" === (null == axisOption ? void 0 : axisOption.type) ? domain : void 0 }, axisOption, { orient: "bottom", type: null !== (_g = null == axisOption ? void 0 : axisOption.type) && void 0 !== _g ? _g : "band", __vtableChartTheme: theme, __vtablePadding: padding }); } } } function getAxisOption(col, row, orient, layout) { var _a, _b; const spec = layout.getRawChartSpec(col, row), axes = null !== (_a = spec.axes) && void 0 !== _a ? _a : []; if (layout._table.pivotChartAxes.forEach((axis => { -1 === axes.findIndex((a => axis.orient === a.orient)) && axes.push(axis); })), spec && (0, vutils_1.isArray)(axes)) { const axisOption = axes.find((axis => axis.orient === orient)); if (axisOption) { const {seriesIndex: seriesIndex, seriesId: seriesId} = axisOption; let seriesIndice, seriesSpec; (0, vutils_1.isValid)(seriesId) && (0, vutils_1.isArray)(spec.series) ? seriesIndice = ((0, vutils_1.isArray)(seriesId) ? seriesId : [ seriesId ]).map((id => { const index = spec.series.findIndex((s => s.id === id)); return index >= 0 && (seriesSpec = spec.series[index]), index; })) : (0, vutils_1.isValid)(seriesIndex) && (0, vutils_1.isArray)(spec.series) && (seriesIndice = seriesIndex); const {isZeroAlign: isZeroAlign, isTickAlign: isTickAlign} = checkZeroAlign(spec, orient, layout); return { axisOption: axisOption, isPercent: spec.percent, isZeroAlign: isZeroAlign, isTickAlign: isTickAlign, seriesIndice: seriesIndice, theme: spec.theme, chartType: null !== (_b = null == seriesSpec ? void 0 : seriesSpec.type) && void 0 !== _b ? _b : spec.type }; } } const axisOption = layout._table.pivotChartAxes.find((axisOption => axisOption.orient === orient)), {isZeroAlign: isZeroAlign, isTickAlign: isTickAlign} = checkZeroAlign(spec, orient, layout); return { axisOption: axisOption, isPercent: !1, isZeroAlign: isZeroAlign, isTickAlign: isTickAlign, theme: spec.theme, chartType: spec.type }; } function checkZeroAlign(spec, orient, layout) { const orients = []; let axesSpec; "left" === orient || "right" === orient ? orients.push("left", "right") : "top" !== orient && "bottom" !== orient || orients.push("top", "bottom"), axesSpec = spec && (0, vutils_1.isArray)(spec.axes) ? spec.axes : layout._table.pivotChartAxes; let isZeroAlign = !1, isTickAlign = !1; if ((0, vutils_1.isArray)(axesSpec)) { const axes = []; axesSpec.forEach((axis => { orients.includes(axis.orient) && axes.push(axis); })); for (let i = 0; i < axes.length; i++) { const axis = axes[i]; axis.sync && axis.sync.axisId && axes.find((axisSync => axisSync.id === axis.sync.axisId)) && (isZeroAlign = isZeroAlign || axis.sync.zeroAlign, isTickAlign = isTickAlign || axis.sync.tickAlign); } } return { isZeroAlign: isZeroAlign, isTickAlign: isTickAlign }; } function getAxisRange(collectedValues, indicatorKeys, isZeroAlign, colPath, seriesId) { var _a; if ((0, vutils_1.isArray)(seriesId)) { const range = { min: 1 / 0, max: -1 / 0 }; for (let i = 0; i < seriesId.length; i++) { const singleRange = getAxisRange(collectedValues, indicatorKeys, isZeroAlign, colPath, seriesId[i]); singleRange && (range.min = Math.min(range.min, singleRange.min), range.max = Math.max(range.max, singleRange.max)); } return isFinite(range.min) && isFinite(range.max) ? range : null; } let defaultKey = null == indicatorKeys ? void 0 : indicatorKeys[seriesId]; if ((0, vutils_1.isArray)(defaultKey) && (defaultKey = defaultKey[0]), !defaultKey) return null; const data = collectedValues[defaultKey], range = (0, vutils_1.merge)({}, null !== (_a = null == data ? void 0 : data[null != colPath ? colPath : ""]) && void 0 !== _a ? _a : { min: 0, max: 1 }); return range.positiveMax && range.positiveMax > range.max && (range.max = range.positiveMax), range.negativeMin && range.negativeMin < range.min && (range.min = range.negativeMin), range.min === range.max && (range.min > 0 ? range.min = 0 : range.max = 0), range; } function isTopOrBottomAxis(col, row, layout) { if (!layout._table.isPivotChart()) return !1; if (layout.indicatorsAsCol) { if (layout.hasTwoIndicatorAxes && row === layout.columnHeaderLevelCount - 1 && col >= layout.rowHeaderLevelCount && col < layout.colCount - layout.rightFrozenColCount) return !0; if (row === layout.rowCount - layout.bottomFrozenRowCount && col >= layout.rowHeaderLevelCount && col < layout.colCount - layout.rightFrozenColCount) return !0; } else if (row === layout.rowCount - layout.bottomFrozenRowCount && col >= layout.rowHeaderLevelCount && col < layout.colCount - layout.rightFrozenColCount) return !0; return !1; } function isLeftOrRightAxis(col, row, layout) { if (!layout._table.isPivotChart()) return !1; if (layout.indicatorsAsCol) { if (col === layout.rowHeaderLevelCount - 1 && row >= layout.columnHeaderLevelCount && row < layout.rowCount - layout.bottomFrozenRowCount) return !0; } else { if (col === layout.rowHeaderLevelCount - 1 && row >= layout.columnHeaderLevelCount && row < layout.rowCount - layout.bottomFrozenRowCount) return !0; if (col === layout.colCount - layout.rightFrozenColCount && row >= layout.columnHeaderLevelCount && row < layout.rowCount - layout.bottomFrozenRowCount) return !0; } return !1; } var Direction; function transformInverse(spec, isHorizontal) { let inverse = null == spec ? void 0 : spec.inverse; return isHorizontal && !isXAxis(null == spec ? void 0 : spec.orient) && (inverse = !(0, vutils_1.isValid)(null == spec ? void 0 : spec.inverse) || !(null == spec ? void 0 : spec.inverse)), inverse; } function isXAxis(orient) { return "bottom" === orient || "top" === orient; } function hasLinearAxis(spec, tableAxesConfig, isHorizontal, isThisXAxis) { if (!(0, vutils_1.isArray)(spec.axes) || 0 === spec.axes.length) return isHorizontal && isThisXAxis || !isHorizontal && !isThisXAxis; for (let i = 0; i < spec.axes.length; i++) { const axisSpec = spec.axes[i]; if (!isHorizontal && isThisXAxis && "bottom" === axisSpec.orient && "linear" === axisSpec.type) return !0; if (isHorizontal && isThisXAxis && "bottom" === axisSpec.orient && "linear" !== axisSpec.type) return !0; if (!isHorizontal && !isThisXAxis && "left" === axisSpec.orient && "linear" !== axisSpec.type) return !0; if (isHorizontal && !isThisXAxis && "left" === axisSpec.orient && "linear" === axisSpec.type) return !0; } if ((0, vutils_1.isArray)(tableAxesConfig) && tableAxesConfig.length > 0) for (let i = 0; i < tableAxesConfig.length; i++) { const axisSpec = tableAxesConfig[i]; if (!isHorizontal && isThisXAxis && "bottom" === axisSpec.orient && "linear" === axisSpec.type) return !0; if (isHorizontal && isThisXAxis && "bottom" === axisSpec.orient && "linear" !== axisSpec.type) return !0; if (!isHorizontal && !isThisXAxis && "left" === axisSpec.orient && "linear" !== axisSpec.type) return !0; if (isHorizontal && !isThisXAxis && "left" === axisSpec.orient && "linear" === axisSpec.type) return !0; } return isHorizontal && isThisXAxis || !isHorizontal && !isThisXAxis; } function getRange(position, colForAxisOption, rowForAxisOption, colForIndicatorKey, rowForIndicatorKey, col, row, defaultSeriesIndice, layout) { const indicatorKeys = layout.getIndicatorKeyInChartSpec(colForIndicatorKey, rowForIndicatorKey); let path; path = "top" === position || "bottom" === position ? layout.getColKeysPath(col, row) : layout.getRowKeysPath(col, row); const rangeConfig = getChartAxisRange(colForAxisOption, rowForAxisOption, defaultSeriesIndice, position, indicatorKeys, path, layout); if (!rangeConfig) return; const subAxisPosition = "bottom" === position ? "top" : "top" === position ? "bottom" : "left" === position ? "right" : "left", {targetRange: targetRange, targetTicks: targetTicks} = getTargetRangeAndTicks(colForAxisOption, rowForAxisOption, rangeConfig.index, rangeConfig.isZeroAlign, rangeConfig.isTickAlign, rangeConfig.range, indicatorKeys, subAxisPosition, path, layout); if (0 !== rangeConfig.index && targetTicks) { const getAxisDomainRangeAndLabels = factory_1.Factory.getFunction("getAxisDomainRangeAndLabels"), {range: newRange, ticks: newTicks} = getAxisDomainRangeAndLabels(rangeConfig.range.min, rangeConfig.range.max, rangeConfig.axisOption, rangeConfig.isZeroAlign, "bottom" === position || "top" === position ? layout._table.getColWidth(col) || layout._table.tableNoFrameWidth : layout._table.getRowHeight(row) || layout._table.tableNoFrameHeight, { targetTicks: targetTicks, targetRange: targetRange }); rangeConfig.range.min = newRange[0], rangeConfig.range.max = newRange[1], rangeConfig.ticks = newTicks; } return rangeConfig.targetRange = targetRange, rangeConfig.targetTicks = targetTicks, rangeConfig; } function getChartAxisRange(col, row, index, position, indicatorKeys, path, layout) { const {axisOption: axisOption, isPercent: isPercent, isZeroAlign: isZeroAlign, isTickAlign: isTickAlign, seriesIndice: seriesIndice, theme: theme, chartType: chartType} = getAxisOption(col, row, position, layout), range = getAxisRange(layout.dataset.collectedValues, indicatorKeys, isZeroAlign, path, null != seriesIndice ? seriesIndice : index); if (!range) return; isPercent && (range.min = range.min < 0 ? -1 : 0, range.max = range.max > 0 ? 1 : 0), ((null == axisOption ? void 0 : axisOption.zero) || range.min === range.max) && (range.min = Math.min(range.min, 0), range.max = Math.max(range.max, 0)); const getAxisDomainRangeAndLabels = factory_1.Factory.getFunction("getAxisDomainRangeAndLabels"), {range: axisRange, ticks: selfTicks} = getAxisDomainRangeAndLabels(range.min, range.max, axisOption, isZeroAlign, "bottom" === position || "top" === position ? layout._table.getColWidth(col) || layout._table.tableNoFrameWidth : layout._table.getRowHeight(row) || layout._table.tableNoFrameHeight); (null == axisOption ? void 0 : axisOption.nice) && (range.min = axisRange[0], range.max = axisRange[1]); const ticks = selfTicks; return (0, vutils_1.isNumber)(null == axisOption ? void 0 : axisOption.min) && (range.min = axisOption.min), (0, vutils_1.isNumber)(null == axisOption ? void 0 : axisOption.max) && (range.max = axisOption.max), { index: null != seriesIndice ? seriesIndice : index, range: range, ticks: ticks, isZeroAlign: isZeroAlign, isTickAlign: isTickAlign, axisOption: axisOption, theme: theme, chartType: chartType }; } function getAxisRangeAndTicks(col, row, index, position, subAxisPosition, indicatorKeys, path, layout) { const {range: range, isZeroAlign: isZeroAlign, isTickAlign: isTickAlign, axisOption: axisOption} = getChartAxisRange(col, row, index, position, indicatorKeys, path, layout), {targetRange: targetRange, targetTicks: targetTicks} = getTargetRangeAndTicks(col, row, index, isZeroAlign, isTickAlign, range, indicatorKeys, subAxisPosition, path, layout); if (0 !== index && targetTicks) { const getAxisDomainRangeAndLabels = factory_1.Factory.getFunction("getAxisDomainRangeAndLabels"), {range: newRange, ticks: newTicks} = getAxisDomainRangeAndLabels(range.min, range.max, (0, vutils_1.merge)({}, axisOption, { nice: !0, tick: { forceTickCount: targetTicks.length } }), isZeroAlign, "bottom" === position || "top" === position ? layout._table.getColWidth(col) || layout._table.tableNoFrameWidth : layout._table.getRowHeight(row) || layout._table.tableNoFrameHeight, { targetTicks: targetTicks, targetRange: targetRange }); range.min = newRange[0], range.max = newRange[1]; } return { axisOption: axisOption, range: range, targetTicks: targetTicks, targetRange: targetRange }; } function getTargetRangeAndTicks(col, row, index, isZeroAlign, isTickAlign, range, indicatorKeys, subAxisPosition, path, layout) { let targetTicks, targetRange; if (!isZeroAlign && !isTickAlign) return { targetTicks: targetTicks, targetRange: targetRange }; const subAxisRange = getChartAxisRange(col, row, indicatorKeys.length - 1 - index, subAxisPosition, indicatorKeys, path, layout); if (subAxisRange) { const {range: subRange, ticks: subTicks} = subAxisRange; if (targetRange = subRange, isZeroAlign) { const align = (0, zero_align_1.getNewRangeToAlign)(range, subRange); align && (range.min = align.range1[0], range.max = align.range1[1], targetRange.min = align.range2[0], targetRange.max = align.range2[1]); } isTickAlign && (targetTicks = isZeroAlign ? (0, tick_align_1.getZeroAlignTickAlignTicks)(targetRange, col, row, index, subAxisPosition, layout) : subTicks); } return { targetTicks: targetTicks, targetRange: targetRange }; } exports.getAxisConfigInPivotChart = getAxisConfigInPivotChart, exports.getAxisOption = getAxisOption, exports.getAxisRange = getAxisRange, exports.isTopOrBottomAxis = isTopOrBottomAxis, exports.isLeftOrRightAxis = isLeftOrRightAxis, function(Direction) { Direction.vertical = "vertical", Direction.horizontal = "horizontal"; }(Direction || (Direction = {})), exports.hasLinearAxis = hasLinearAxis, exports.getAxisRangeAndTicks = getAxisRangeAndTicks; //# sourceMappingURL=get-axis-config.js.map