@visactor/vseed 0.1.14 → 0.1.15

package/dist/umd/index.js

@@ -106,6 +106,7 @@
             columnAdvancedPipeline: ()=>columnAdvancedPipeline,
             zLabel: ()=>zLabel,
             registerColumn: ()=>registerColumn,
+            createFormatterByMeasure: ()=>createFormatterByMeasure,
             findAllMeasures: ()=>findAllMeasures,
             funnelSpecPipeline: ()=>funnelSpecPipeline,
             isDimensionSelector: ()=>isDimensionSelector,
@@ -193,21 +194,20 @@
             darkTheme: ()=>darkTheme,
             createNumFormatter: ()=>createNumFormatter,
             zAreaConfig: ()=>zAreaConfig,
-            zAxis: ()=>zAxis,
-            isVTable: ()=>isVTable,
             zMeasures: ()=>zMeasures,
+            isVTable: ()=>isVTable,
             zRadar: ()=>zRadar,
+            zRadarConfig: ()=>zRadarConfig,
             zLine: ()=>zLine,
             columnSpecPipeline: ()=>columnSpecPipeline,
             zFoldInfo: ()=>zFoldInfo,
             zDatasetReshapeInfo: ()=>zDatasetReshapeInfo,
             zLinearColor: ()=>zLinearColor,
-            zRadarConfig: ()=>zRadarConfig,
+            zStackCornerRadius: ()=>zStackCornerRadius,
             zAreaStyle: ()=>zAreaStyle,
             ORIGINAL_DATA: ()=>ORIGINAL_DATA,
-            zStackCornerRadius: ()=>zStackCornerRadius,
-            zAnnotationArea: ()=>zAnnotationArea,
             zUnfoldInfo: ()=>zUnfoldInfo,
+            zAnnotationArea: ()=>zAnnotationArea,
             DetailEncoding: ()=>DetailEncoding,
             zRose: ()=>zRose,
             columnParallelSpecPipeline: ()=>columnParallelSpecPipeline,
@@ -982,9 +982,6 @@
             });
             return result || [];
         };
-        function chunk_VCYTMP4D_n(e) {
-            return void 0 === e ? !0 : "string" == typeof e || Array.isArray(e) ? 0 === e.length : 0 === Object.keys(e).length;
-        }
         const createNumFormatter = (format, locale = intl.getLocale())=>{
             const { type = 'number', ratio = 1, symbol = '', thousandSeparator = true, prefix = '', suffix = '', fractionDigits = 2, significantDigits, roundingMode = 'halfExpand', roundingPriority = 'auto' } = format || {};
             const numFormatterOptions = {
@@ -1041,11 +1038,21 @@
             });
             return numFormatter.format(Number(value));
         };
-        const createFormatter = (format)=>createNumFormatter(format);
-        const autoFormatter = (value, locale)=>autoNumFormatter(value, locale);
+        const createFormatter = (format, locale)=>createNumFormatter(format, locale);
+        const autoFormatter = (value, locale = intl.getLocale())=>autoNumFormatter(value, locale);
+        function chunk_VCYTMP4D_n(e) {
+            return void 0 === e ? !0 : "string" == typeof e || Array.isArray(e) ? 0 === e.length : 0 === Object.keys(e).length;
+        }
+        const createFormatterByMeasure = (measure)=>{
+            if (!measure) return (v)=>String(v);
+            const { numFormat, format, autoFormat = true } = measure;
+            const formatterFormat = numFormat || format || {};
+            if (!chunk_VCYTMP4D_n(formatterFormat)) return createFormatter(formatterFormat);
+            if (autoFormat) return autoFormatter;
+            return (v)=>String(v);
+        };
         const measureTreeToColumns = (spec, context)=>{
             const { advancedVSeed } = context;
-            const { locale } = advancedVSeed;
             const measures = advancedVSeed.measures;
             const result = {
                 ...spec
@@ -1053,7 +1060,7 @@
             const eachNode = (node)=>{
                 if (isMeasure(node)) return {
                     width: 'auto',
-                    fieldFormat: fieldFormat(node, locale)
+                    fieldFormat: fieldFormat(node)
                 };
                 return {};
             };
@@ -1066,15 +1073,14 @@
                 ]
             };
         };
-        const fieldFormat = (node, locale)=>(datum)=>{
-                const { format = {}, autoFormat = true, id } = node;
+        const fieldFormat = (node)=>{
+            const formatter = createFormatterByMeasure(node);
+            return (datum)=>{
+                const { id } = node;
                 const value = datum[id];
-                if (!chunk_VCYTMP4D_n(format)) {
-                    const formatter = createFormatter(format);
-                    return formatter(value);
-                }
-                if (autoFormat) return autoFormatter(value, locale);
+                return formatter(value);
             };
+        };
         const measuresToColumns_treeTreeToColumns = (tree, callback)=>{
             const result = tree.map((item)=>{
                 if ('children' in item && Array.isArray(item.children)) {
@@ -1515,7 +1521,7 @@
         };
         const pivotIndicators = (spec, context)=>{
             const { advancedVSeed } = context;
-            const { locale, measures, datasetReshapeInfo } = advancedVSeed;
+            const { measures, datasetReshapeInfo } = advancedVSeed;
             const { foldInfo } = datasetReshapeInfo[0];
             return {
                 ...spec,
@@ -1528,25 +1534,20 @@
                         indicatorKey: foldInfo.measureValue,
                         title: 'indicator',
                         width: 'auto',
-                        format: pivotIndicators_fieldFormat(measures, foldInfo, locale)
+                        format: pivotIndicators_fieldFormat(measures, foldInfo)
                     }
                 ]
             };
         };
-        const pivotIndicators_fieldFormat = (measures, foldInfo, locale)=>(value, col, row, table)=>{
+        const pivotIndicators_fieldFormat = (measures, foldInfo)=>(value, col, row, table)=>{
                 if (!chunk_6GTAPB47_e(col) || !chunk_6GTAPB47_e(row) || !table) return value;
                 const datum = table.getCellOriginRecord(col, row);
                 if (!datum[0]) return value;
                 const { measureId: foldMeasureId } = foldInfo;
                 const measureId = datum[0][foldMeasureId];
-                const node = findMeasureById(measures, measureId);
-                if (!node) return value;
-                const { format = {}, autoFormat = true } = node;
-                if (!chunk_VCYTMP4D_n(format)) {
-                    const formatter = createFormatter(format);
-                    return formatter(value);
-                }
-                if (autoFormat) return autoFormatter(value, locale);
+                const measure = findMeasureById(measures, measureId);
+                const formatter = createFormatterByMeasure(measure);
+                return formatter(value);
             };
         const rowHeaderStyle = (spec, context)=>{
             const result = {
@@ -2687,7 +2688,8 @@
                 ];
                 return result;
             }
-            const { visible = true, label, tick, title, grid, line, zero, nice, inverse, max, min, log, logBase = 10 } = config;
+            const { visible = true, label, tick, title, grid, line, zero, nice, inverse, max, min, log, logBase = 10, autoFormat = true, numFormat = {} } = config;
+            const formatter = createNumFormatter(numFormat);
             const linearAxis = {
                 visible,
                 type: log ? 'log' : 'linear',
@@ -2700,7 +2702,11 @@
                 min,
                 label: {
                     visible: label?.visible,
-                    formatMethod: (value)=>autoFormatter(value, locale),
+                    formatMethod: (value)=>{
+                        if (!chunk_VCYTMP4D_n(numFormat)) return formatter(value);
+                        if (autoFormat) return autoFormatter(value, locale);
+                        return value;
+                    },
                     style: {
                         fill: label?.labelColor,
                         angle: label?.labelAngle,
@@ -3278,31 +3284,58 @@
                 ...spec
             };
             const { advancedVSeed, vseed } = context;
-            const { measures, datasetReshapeInfo } = advancedVSeed;
+            const { datasetReshapeInfo } = advancedVSeed;
             const { chartType, encoding } = advancedVSeed;
             const baseConfig = advancedVSeed.config[chartType];
+            const foldInfo = datasetReshapeInfo[0].foldInfo;
             if (!baseConfig || chunk_VCYTMP4D_n(baseConfig.label)) return result;
-            const { measureId, measureValue, statistics } = datasetReshapeInfo[0].foldInfo;
             const { label } = baseConfig;
+            result.label = buildLabel(label, vseed.measures, vseed.dimensions, advancedVSeed.measures, encoding, [
+                foldInfo
+            ]);
+            return result;
+        };
+        const generateMeasureValue = (value, measure, labelAutoFormat = true, numFormat = {})=>{
+            if (!measure) return value;
+            const format = chunk_5S4PYKVY_t(numFormat, measure.numFormat || measure.format);
+            const mergedMeasure = {
+                ...measure,
+                numFormat: format,
+                autoFormat: labelAutoFormat || measure.autoFormat
+            };
+            const formatter = createFormatterByMeasure(mergedMeasure);
+            return formatter(value);
+        };
+        const generateMeasurePercent = (value, sum, formatter)=>{
+            if (null == value) return String(value);
+            const num = Number(value);
+            if (Number.isNaN(num)) return String(value);
+            const percentValue = num / sum;
+            return formatter(percentValue);
+        };
+        const buildLabel = (label, vseedMeasures = [], vseedDimensions = [], advancedVSeedMeasures, encoding, foldInfoList)=>{
             const { enable, wrap, showValue, showValuePercent, labelOverlap, labelColorSmartInvert, labelColor, labelFontSize, labelFontWeight, labelBackgroundColor, labelPosition, autoFormat = true, numFormat = {} } = label;
-            const labelDims = T((vseed.dimensions || []).filter((item)=>encoding.label?.includes(item.id)), (item)=>item.id);
-            const labelMeas = T((vseed.measures || []).filter((item)=>encoding.label?.includes(item.id)), (item)=>item.id);
+            const labelDims = T((vseedDimensions || []).filter((item)=>encoding.label?.includes(item.id)), (item)=>item.id);
+            const labelMeas = T((vseedMeasures || []).filter((item)=>encoding.label?.includes(item.id)), (item)=>item.id);
             const percentFormat = chunk_5S4PYKVY_t(numFormat, {
                 type: 'percent'
             });
             const percentFormatter = createFormatter(percentFormat);
-            result.label = {
+            const result = {
                 visible: enable,
                 formatMethod: (_, datum)=>{
                     const result = [];
                     const dimLabels = labelDims.map((item)=>item.alias || item.id);
                     const meaLabels = labelMeas.map((item)=>generateMeasureValue(datum[item.id], item, autoFormat, numFormat));
-                    const measure = findMeasureById(measures, datum[measureId]);
-                    const measureValueLabel = generateMeasureValue(datum[measureValue], measure, autoFormat, numFormat);
-                    const measurePercentLabel = generateMeasurePercent(datum[measureValue], statistics.sum, percentFormatter);
                     result.push(...dimLabels);
-                    if (showValue) result.push(measureValueLabel);
-                    if (showValuePercent) result.push(measurePercentLabel);
+                    foldInfoList.forEach((foldInfo)=>{
+                        const { measureId, measureValue, statistics } = foldInfo;
+                        const measure = findMeasureById(advancedVSeedMeasures, datum[measureId]);
+                        const measureValueLabel = generateMeasureValue(datum[measureValue], measure, autoFormat, numFormat);
+                        const measurePercentLabel = generateMeasurePercent(datum[measureValue], statistics.sum, percentFormatter);
+                        if (showValue) result.push(measureValueLabel);
+                        if (showValuePercent) result.push(measurePercentLabel);
+                    });
                     result.push(...meaLabels);
                     if (wrap) return result;
                     return result.join(' ');
@@ -3316,36 +3349,18 @@
                 },
                 smartInvert: labelColorSmartInvert
             };
-            if (labelOverlap) result.label.overlap = {
+            if (labelOverlap) result.overlap = {
                 hideOnHit: true,
                 clampForce: true
             };
             return result;
         };
-        const generateMeasureValue = (value, measure, labelAutoFormat = true, numFormat = {})=>{
-            if (!measure) return value;
-            const format = chunk_5S4PYKVY_t(numFormat, measure.format);
-            const autoFormat = labelAutoFormat || measure.autoFormat;
-            if (!chunk_VCYTMP4D_n(format)) {
-                const formatter = createFormatter(format);
-                return formatter(value);
-            }
-            if (autoFormat) return autoFormatter(value, intl.getLocale());
-            return String(value);
-        };
-        const generateMeasurePercent = (value, sum, formatter)=>{
-            if (null == value) return String(value);
-            const num = Number(value);
-            if (Number.isNaN(num)) return String(value);
-            const percentValue = num / sum;
-            return formatter(percentValue);
-        };
         const tooltip_tooltip = (spec, context)=>{
             const result = {
                 ...spec
             };
             const { advancedVSeed, vseed } = context;
-            const { measures, datasetReshapeInfo, chartType, locale, dimensions, encoding } = advancedVSeed;
+            const { measures, datasetReshapeInfo, chartType, dimensions, encoding } = advancedVSeed;
             const baseConfig = advancedVSeed.config[chartType];
             const { tooltip = {
                 enable: true
@@ -3358,18 +3373,18 @@
                     title: {
                         visible: false
                     },
-                    content: createMarkContent(encoding.tooltip || [], dimensions, findAllMeasures(vseed.measures), locale, foldInfo, unfoldInfo)
+                    content: createMarkContent(encoding.tooltip || [], dimensions, findAllMeasures(vseed.measures), foldInfo, unfoldInfo)
                 },
                 dimension: {
                     title: {
                         visible: true
                     },
-                    content: createDimensionContent(measures, foldInfo, unfoldInfo, locale)
+                    content: createDimensionContent(measures, foldInfo, unfoldInfo)
                 }
             };
             return result;
         };
-        const createDimensionContent = (measures, foldInfo, unfoldInfo, locale)=>{
+        const createDimensionContent = (measures, foldInfo, unfoldInfo)=>{
             const { measureId, measureValue } = foldInfo;
             const { encodingColor } = unfoldInfo;
             return [
@@ -3387,19 +3402,13 @@
                         const value = datum[measureValue];
                         const id = datum[measureId];
                         const measure = findMeasureById(measures, id);
-                        if (!measure) return String(value);
-                        const { format = {}, autoFormat = true } = measure;
-                        if (!chunk_VCYTMP4D_n(format)) {
-                            const formatter = createFormatter(format);
-                            return formatter(value);
-                        }
-                        if (autoFormat) return autoFormatter(value, locale);
-                        return String(value);
+                        const formatter = createFormatterByMeasure(measure);
+                        return formatter(value);
                     }
                 }
             ];
         };
-        const createMarkContent = (tooltip, dimensions, measures, locale, foldInfo, unfoldInfo)=>{
+        const createMarkContent = (tooltip, dimensions, measures, foldInfo, unfoldInfo)=>{
             const dims = C(dimensions.filter((item)=>tooltip.includes(item.id)), T((item)=>item.id), T((item)=>item.alias));
             const meas = C(measures.filter((item)=>tooltip.includes(item.id)), T((item)=>item.id), T((item)=>item.alias));
             const dimContent = dims.map((item)=>({
@@ -3429,14 +3438,8 @@
                         const originalData = datum[ORIGINAL_DATA];
                         const value = originalData[id];
                         const measure = findMeasureById(measures, id);
-                        if (!measure) return String(value);
-                        const { format = {}, autoFormat = true } = measure;
-                        if (!chunk_VCYTMP4D_n(format)) {
-                            const formatter = createFormatter(format);
-                            return formatter(value);
-                        }
-                        if (autoFormat) return autoFormatter(value, locale);
-                        return String(value);
+                        const formatter = createFormatterByMeasure(measure);
+                        return formatter(value);
                     }
                 }));
             const defaultContent = {
@@ -3457,13 +3460,8 @@
                     const id = datum[measureId];
                     const measure = findMeasureById(measures, id);
                     if (!measure) return String(value);
-                    const { format = {}, autoFormat = true } = measure;
-                    if (!chunk_VCYTMP4D_n(format)) {
-                        const formatter = createFormatter(format);
-                        return formatter(value);
-                    }
-                    if (autoFormat) return autoFormatter(value, locale);
-                    return String(value);
+                    const formatter = createFormatterByMeasure(measure);
+                    return formatter(value);
                 }
             };
             return [
@@ -5213,7 +5211,8 @@
                 ];
                 return result;
             }
-            const { visible = true, label, tick, title, grid, line, zero, nice, inverse, max, min, log, logBase = 10 } = config;
+            const { visible = true, label, tick, title, grid, line, zero, nice, inverse, max, min, log, logBase = 10, autoFormat = true, numFormat = {} } = config;
+            const formatter = createNumFormatter(numFormat, locale);
             const linearAxis = {
                 visible,
                 type: log ? 'log' : 'linear',
@@ -5226,7 +5225,11 @@
                 min,
                 label: {
                     visible: label?.visible,
-                    formatMethod: (value)=>autoFormatter(value, locale),
+                    formatMethod: (value)=>{
+                        if (!chunk_VCYTMP4D_n(numFormat)) return formatter(value);
+                        if (autoFormat) return autoFormatter(value, locale);
+                        return value;
+                    },
                     style: {
                         fill: label?.labelColor,
                         angle: label?.labelAngle,
@@ -6257,6 +6260,20 @@
                 }
             };
         };
+        const labelScatter = (spec, context)=>{
+            const result = {
+                ...spec
+            };
+            const { advancedVSeed, vseed } = context;
+            const { datasetReshapeInfo } = advancedVSeed;
+            const { chartType, encoding } = advancedVSeed;
+            const baseConfig = advancedVSeed.config[chartType];
+            if (!baseConfig || chunk_VCYTMP4D_n(baseConfig.label)) return result;
+            const foldInfoList = datasetReshapeInfo[0].foldInfoList;
+            const { label } = baseConfig;
+            result.label = buildLabel(label, vseed.measures, vseed.dimensions, advancedVSeed.measures, encoding, foldInfoList);
+            return result;
+        };
         const tooltipScatter = (spec, context)=>{
             const result = {
                 ...spec
@@ -6313,14 +6330,8 @@
                         const originalData = datum[ORIGINAL_DATA];
                         const value = originalData[id];
                         const measure = findMeasureById(measures, id);
-                        if (!measure) return String(value);
-                        const { format = {}, autoFormat = true } = measure;
-                        if (!chunk_VCYTMP4D_n(format)) {
-                            const formatter = createFormatter(format);
-                            return formatter(value);
-                        }
-                        if (autoFormat) return autoFormatter(value, locale);
-                        return String(value);
+                        const formatter = createFormatterByMeasure(measure);
+                        return formatter(value);
                     }
                 }));
             const foldMeaContent = foldInfoList.map((foldInfo)=>({
@@ -6340,14 +6351,8 @@
                         const value = datum[measureValue];
                         const id = datum[measureId];
                         const measure = findMeasureById(measures, id);
-                        if (!measure) return String(value);
-                        const { format = {}, autoFormat = true } = measure;
-                        if (!chunk_VCYTMP4D_n(format)) {
-                            const formatter = createFormatter(format);
-                            return formatter(value);
-                        }
-                        if (autoFormat) return autoFormatter(value, locale);
-                        return String(value);
+                        const formatter = createFormatterByMeasure(measure);
+                        return formatter(value);
                     }
                 }));
             return [
@@ -6408,7 +6413,7 @@
             progressive,
             xLinear,
             yLinear,
-            label_label,
+            labelScatter,
             tooltipScatter,
             colorAdapter(discreteLegend, colorLegend),
             verticalCrosshairLine,
@@ -6433,7 +6438,7 @@
                 progressive,
                 xLinear,
                 yLinear,
-                label_label,
+                labelScatter,
                 tooltipScatter,
                 verticalCrosshairLine,
                 horizontalCrosshairLine,
@@ -6819,6 +6824,7 @@
             const result = {
                 type: 'common',
                 padding: 0,
+                labelLayout: 'region',
                 region: [
                     {
                         clip: true
@@ -7074,71 +7080,33 @@
             const result = {
                 ...spec
             };
-            const { advancedVSeed } = context;
-            const { measures, datasetReshapeInfo, locale } = advancedVSeed;
+            const { advancedVSeed, vseed } = context;
+            const { datasetReshapeInfo, encoding } = advancedVSeed;
             const { chartType } = advancedVSeed;
             const baseConfig = advancedVSeed.config[chartType];
             if (!baseConfig || !baseConfig.label) return result;
             const foldInfoList = datasetReshapeInfo[0].foldInfoList;
-            const { measureId, measureValue } = foldInfoList[0];
-            const { label } = baseConfig;
-            const { enable } = label;
-            result.label = {
-                visible: enable,
-                formatMethod: (value, datum)=>{
-                    const result = [];
-                    const formatValue = (value)=>{
-                        const id = datum[measureId];
-                        const measure = findMeasureById(measures, id);
-                        if (!measure) return value;
-                        const { format = {}, autoFormat = true } = measure;
-                        if (!chunk_VCYTMP4D_n(format)) {
-                            const formatter = createFormatter(format);
-                            return formatter(value);
-                        }
-                        if (autoFormat) return autoFormatter(value, locale);
-                        return String(value);
-                    };
-                    result.push(formatValue(datum[measureValue]));
-                    return result.join(' ');
-                }
-            };
+            result.label = buildLabel(baseConfig.label, vseed.measures, vseed.dimensions, advancedVSeed.measures, encoding, [
+                foldInfoList[0]
+            ]);
+            result.label.zIndex = 1002;
             return result;
         };
         const labelSecondary = (spec, context)=>{
             const result = {
                 ...spec
             };
-            const { advancedVSeed } = context;
-            const { measures, datasetReshapeInfo, locale } = advancedVSeed;
+            const { advancedVSeed, vseed } = context;
+            const { datasetReshapeInfo, encoding } = advancedVSeed;
             const { chartType } = advancedVSeed;
             const baseConfig = advancedVSeed.config[chartType];
             if (!baseConfig || !baseConfig.label) return result;
             if (chunk_JK3VNB42_n(datasetReshapeInfo[0].foldInfoList?.[1])) return result;
             const foldInfoList = datasetReshapeInfo[0].foldInfoList;
-            const { measureId, measureValue } = foldInfoList[1];
-            const { label } = baseConfig;
-            const { enable } = label;
-            result.label = {
-                visible: enable,
-                formatMethod: (value, datum)=>{
-                    const result = [];
-                    const formatValue = (value)=>{
-                        const id = datum[measureId];
-                        const measure = findMeasureById(measures, id);
-                        if (!measure) return value;
-                        const { format = {}, autoFormat = true } = measure;
-                        if (!chunk_VCYTMP4D_n(format)) {
-                            const formatter = createFormatter(format);
-                            return formatter(value);
-                        }
-                        if (autoFormat) return autoFormatter(value, locale);
-                        return String(value);
-                    };
-                    result.push(formatValue(datum[measureValue]));
-                    return result.join(' ');
-                }
-            };
+            result.label = buildLabel(baseConfig.label, vseed.measures, vseed.dimensions, advancedVSeed.measures, encoding, [
+                foldInfoList[1]
+            ]);
+            result.label.zIndex = 1002;
             return result;
         };
         const tooltipPrimary = (spec, context)=>{
@@ -7146,7 +7114,7 @@
                 ...spec
             };
             const { advancedVSeed, vseed } = context;
-            const { measures, datasetReshapeInfo, chartType, locale, dimensions, encoding } = advancedVSeed;
+            const { measures, datasetReshapeInfo, chartType, dimensions, encoding } = advancedVSeed;
             const baseConfig = advancedVSeed.config[chartType];
             const { tooltip = {
                 enable: true
@@ -7160,13 +7128,13 @@
                     title: {
                         visible: false
                     },
-                    content: createMarkContent(encoding.tooltip || [], dimensions, findAllMeasures(vseed.measures), locale, foldInfoList[0], unfoldInfo)
+                    content: createMarkContent(encoding.tooltip || [], dimensions, findAllMeasures(vseed.measures), foldInfoList[0], unfoldInfo)
                 },
                 dimension: {
                     title: {
                         visible: true
                     },
-                    content: createDimensionContent(measures, foldInfoList[0], unfoldInfo, locale)
+                    content: createDimensionContent(measures, foldInfoList[0], unfoldInfo)
                 }
             };
             return result;
@@ -7176,7 +7144,7 @@
                 ...spec
             };
             const { advancedVSeed, vseed } = context;
-            const { measures, datasetReshapeInfo, chartType, locale, dimensions, encoding } = advancedVSeed;
+            const { measures, datasetReshapeInfo, chartType, dimensions, encoding } = advancedVSeed;
             const baseConfig = advancedVSeed.config[chartType];
             const { tooltip = {
                 enable: true
@@ -7191,13 +7159,13 @@
                     title: {
                         visible: false
                     },
-                    content: createMarkContent(encoding.tooltip || [], dimensions, findAllMeasures(vseed.measures), locale, foldInfoList[1], unfoldInfo)
+                    content: createMarkContent(encoding.tooltip || [], dimensions, findAllMeasures(vseed.measures), foldInfoList[1], unfoldInfo)
                 },
                 dimension: {
                     title: {
                         visible: true
                     },
-                    content: createDimensionContent(measures, foldInfoList[1], unfoldInfo, locale)
+                    content: createDimensionContent(measures, foldInfoList[1], unfoldInfo)
                 }
             };
             return result;
@@ -7236,7 +7204,8 @@
                 ];
                 return result;
             }
-            const { visible = true, label, tick, title, grid, line, zero, nice, inverse, max, min, log, logBase = 10 } = yAxisConfig;
+            const { visible = true, label, tick, title, grid, line, zero, nice, inverse, max, min, log, logBase = 10, autoFormat = true, numFormat = {} } = yAxisConfig;
+            const formatter = createNumFormatter(numFormat, locale);
             const linearAxis = {
                 visible: isEmptySecondary ? false : visible,
                 id,
@@ -7251,7 +7220,11 @@
                 min,
                 label: {
                     visible: label?.visible,
-                    formatMethod: (value)=>autoFormatter(value, locale),
+                    formatMethod: (value)=>{
+                        if (!chunk_VCYTMP4D_n(numFormat)) return formatter(value);
+                        if (autoFormat) return autoFormatter(value, locale);
+                        return value;
+                    },
                     style: {
                         fill: label?.labelColor,
                         angle: label?.labelAngle,
@@ -7340,7 +7313,8 @@
                 ];
                 return result;
             }
-            const { visible = true, label, tick, title, grid, line, zero, nice, inverse, max, min, log, logBase = 10 } = yAxisConfig;
+            const { visible = true, label, tick, title, grid, line, zero, nice, inverse, max, min, log, logBase = 10, numFormat = {}, autoFormat = true } = yAxisConfig;
+            const formatter = createNumFormatter(numFormat, locale);
             const linearAxis = {
                 visible: isEmptySecondary ? false : visible,
                 id,
@@ -7356,7 +7330,11 @@
                 min,
                 label: {
                     visible: label?.visible,
-                    formatMethod: (value)=>autoFormatter(value, locale),
+                    formatMethod: (value)=>{
+                        if (!chunk_VCYTMP4D_n(numFormat)) return formatter(value);
+                        if (autoFormat) return autoFormatter(value, locale);
+                        return value;
+                    },
                     style: {
                         fill: label?.labelColor,
                         angle: label?.labelAngle,
@@ -8717,16 +8695,6 @@
             markStyle_markStyle,
             annotation_annotation
         ];
-        const labelColorInversion = (spec)=>{
-            const result = {
-                ...spec
-            };
-            if (result.label) result.label.smartInvert = true;
-            else result.label = {
-                smartInvert: true
-            };
-            return result;
-        };
         const colorCellStyleFill = (stylePipe)=>(spec, context)=>{
                 const result = stylePipe(spec, context);
                 const { advancedVSeed } = context;
@@ -8814,14 +8782,8 @@
                         const originalData = datum[ORIGINAL_DATA];
                         const value = originalData[id];
                         const measure = findMeasureById(measures, id);
-                        if (!measure) return String(value);
-                        const { format = {}, autoFormat = true } = measure;
-                        if (!chunk_VCYTMP4D_n(format)) {
-                            const formatter = createFormatter(format);
-                            return formatter(value);
-                        }
-                        if (autoFormat) return autoFormatter(value, locale);
-                        return String(value);
+                        const formatter = createFormatterByMeasure(measure);
+                        return formatter(value);
                     }
                 }));
             const foldMeaContent = [
@@ -8843,14 +8805,8 @@
                         const value = datum[measureValue];
                         const id = datum[measureId];
                         const measure = findMeasureById(measures, id);
-                        if (!measure) return String(value);
-                        const { format = {}, autoFormat = true } = measure;
-                        if (!chunk_VCYTMP4D_n(format)) {
-                            const formatter = createFormatter(format);
-                            return formatter(value);
-                        }
-                        if (autoFormat) return autoFormatter(value, locale);
-                        return String(value);
+                        const formatter = createFormatterByMeasure(measure);
+                        return formatter(value);
                     }
                 }));
             return [
@@ -8899,7 +8855,6 @@
             datasetXY,
             colorAdapter(color_color, linearColor),
             label_label,
-            labelColorInversion,
             colorAdapter(discreteLegend, colorLegend),
             colorCellStyleFill(cellStyle),
             tooltipHeatmap,
@@ -8919,7 +8874,6 @@
                 datasetXY,
                 colorAdapter(color_color, linearColor),
                 label_label,
-                labelColorInversion,
                 discreteLegend,
                 tooltipHeatmap,
                 colorCellStyleFill(cellStyle),
@@ -9139,7 +9093,12 @@
                     columnPercent: {
                         ...baseConfig,
                         xAxis: bandAxis,
-                        yAxis: linearAxis,
+                        yAxis: {
+                            ...linearAxis,
+                            numFormat: {
+                                type: 'percent'
+                            }
+                        },
                         crosshairRect,
                         stackCornerRadius: [
                             4,
@@ -9174,7 +9133,12 @@
                     },
                     barPercent: {
                         ...baseConfig,
-                        xAxis: linearAxis,
+                        xAxis: {
+                            ...linearAxis,
+                            numFormat: {
+                                type: 'percent'
+                            }
+                        },
                         yAxis: barBandAxis,
                         crosshairRect,
                         stackCornerRadius: [
@@ -9193,7 +9157,12 @@
                     areaPercent: {
                         ...baseConfig,
                         xAxis: bandAxis,
-                        yAxis: linearAxis,
+                        yAxis: {
+                            ...linearAxis,
+                            numFormat: {
+                                type: 'percent'
+                            }
+                        },
                         crosshairLine
                     },
                     scatter: {
@@ -9261,7 +9230,11 @@
                         ...baseConfig
                     },
                     heatmap: {
-                        ...baseConfig
+                        ...baseConfig,
+                        label: {
+                            ...baseConfig.label,
+                            labelColorSmartInvert: true
+                        }
                     }
                 }
             };
@@ -9586,7 +9559,11 @@
                         ...baseConfig
                     },
                     heatmap: {
-                        ...baseConfig
+                        ...baseConfig,
+                        label: {
+                            ...baseConfig.label,
+                            labelColorSmartInvert: true
+                        }
                     }
                 }
             };
@@ -13015,6 +12992,7 @@
             id: schemas_string(),
             alias: schemas_string().optional(),
             autoFormat: schemas_boolean().default(true),
+            numFormat: zNumFormat["default"]({}),
             format: zNumFormat["default"]({}),
             encoding: schemas_enum([
                 'primaryYAxis',
@@ -13215,6 +13193,7 @@
             log: schemas_boolean().default(false).nullish(),
             logBase: schemas_number().default(10).nullish(),
             inverse: schemas_boolean().default(false).nullish(),
+            numFormat: zNumFormat.nullish(),
             label: schemas_object({
                 visible: schemas_boolean().default(true).nullish(),
                 labelColor: schemas_string().default('#797B85').nullish(),
@@ -13501,56 +13480,6 @@
             funnel: zFunnelConfig.nullish(),
             heatmap: zHeatmapConfig.nullish()
         });
-        const zAxis = schemas_object({
-            visible: schemas_boolean().default(true).nullish(),
-            min: schemas_number().nullish(),
-            max: schemas_number().nullish(),
-            nice: schemas_boolean().default(true).nullish(),
-            zero: schemas_boolean().default(true).nullish(),
-            inverse: schemas_boolean().default(false).nullish(),
-            log: schemas_boolean().default(false).nullish(),
-            logBase: schemas_number().default(10).nullish(),
-            labelAutoHide: schemas_boolean().default(true).nullish(),
-            labelAutoHideGap: schemas_number().default(4).nullish(),
-            labelAutoRotate: schemas_boolean().default(true).nullish(),
-            labelAutoRotateAngleRange: schemas_array(schemas_number()).default([
-                0,
-                -45,
-                -90
-            ]).nullish(),
-            labelAutoLimit: schemas_boolean().default(true).nullish(),
-            labelAutoLimitLength: schemas_number().default(100).nullish(),
-            label: schemas_object({
-                visible: schemas_boolean().default(true).nullish(),
-                labelColor: schemas_string().default('#797B85').nullish(),
-                labelFontSize: schemas_number().default(12).nullish(),
-                labelFontWeight: schemas_number().default(400).nullish(),
-                labelAngle: schemas_number().default(0).nullish()
-            }).nullish(),
-            line: schemas_object({
-                visible: schemas_boolean().default(true).nullish(),
-                lineColor: schemas_string().default('rgba(54, 65, 89, 0.30)').nullish(),
-                lineWidth: schemas_number().default(1).nullish()
-            }).nullish(),
-            tick: schemas_object({
-                visible: schemas_boolean().default(true).nullish(),
-                tickInside: schemas_boolean().default(false).nullish(),
-                tickColor: schemas_string().default('rgba(54, 65, 89, 0.30)').nullish(),
-                tickSize: schemas_number().default(4).nullish()
-            }).nullish(),
-            title: schemas_object({
-                visible: schemas_boolean().default(false).nullish(),
-                titleText: schemas_string().default('').nullish(),
-                titleColor: schemas_string().default('#646A73').nullish(),
-                titleFontSize: schemas_number().default(12).nullish(),
-                titleFontWeight: schemas_number().default(400).nullish()
-            }).nullish(),
-            grid: schemas_object({
-                visible: schemas_boolean().default(false).nullish(),
-                gridColor: schemas_string().default('rgba(54, 65, 89, 0.15)').nullish(),
-                gridWidth: schemas_number().default(0.5).nullish()
-            }).nullish()
-        });
         const zCustomThemeConfig = schemas_object({
             config: zConfig.nullish()
         });