@visactor/vseed 0.4.12 → 0.4.14

package/dist/umd/index.js

@@ -1092,6 +1092,7 @@
                 zMeasures: ()=>zMeasures,
                 darkTheme: ()=>darkTheme,
                 isFieldSelector: ()=>isFieldSelector,
+                zTimeFormat: ()=>zTimeFormat,
                 selectByField: ()=>selectByField,
                 isVTable: ()=>isVTable,
                 terminateWorkerPool: ()=>terminateWorkerPool,
@@ -1166,10 +1167,10 @@
                 selectByPartial: ()=>selectByPartial,
                 columnPercentSpecPipeline: ()=>columnPercentSpecPipeline,
                 areaAdvancedPipeline: ()=>areaAdvancedPipeline,
-                areaPercentSpecPipeline: ()=>areaPercentSpecPipeline,
+                barParallelSpecPipeline: ()=>barParallelSpecPipeline,
                 isRowWithFieldDynamicFilter: ()=>isRowWithFieldDynamicFilter,
                 executeFilterCode: ()=>executeFilterCode,
-                barParallelSpecPipeline: ()=>barParallelSpecPipeline,
+                areaPercentSpecPipeline: ()=>areaPercentSpecPipeline,
                 BAND_AXIS_INNER_OFFSET_IN_PIVOT: ()=>2,
                 zBar: ()=>zBar,
                 pieAdvancedPipeline: ()=>pieAdvancedPipeline,
@@ -1250,12 +1251,12 @@
                 Builder: ()=>Builder,
                 zWhiskersConfig: ()=>zWhiskersConfig,
                 matchDynamicFilterResult: ()=>matchDynamicFilterResult,
+                createTimeFormatter: ()=>createTimeFormatter,
                 revisedBoxPlotFieldKey: ()=>revisedBoxPlotFieldKey,
-                sunburstSpecPipeline: ()=>sunburstSpecPipeline,
                 radarSpecPipeline: ()=>radarSpecPipeline,
                 OutliersMeasureId: ()=>OutliersMeasureId,
+                sunburstSpecPipeline: ()=>sunburstSpecPipeline,
                 zRadar: ()=>zRadar,
-                zTable: ()=>zTable,
                 histogramSpecPipeline: ()=>histogramSpecPipeline,
                 isValueDynamicFilter: ()=>isValueDynamicFilter,
                 racePieAdvancedPipeline: ()=>racePieAdvancedPipeline,
@@ -1274,6 +1275,7 @@
                 createNumFormatter: ()=>createNumFormatter,
                 HAS_BUILTIN_UTILS: ()=>HAS_BUILTIN_UTILS,
                 zAreaConfig: ()=>zAreaConfig,
+                zTable: ()=>zTable,
                 zUnfoldInfo: ()=>zUnfoldInfo,
                 zPage: ()=>zPage,
                 zLine: ()=>zLine,
@@ -1339,18 +1341,19 @@
                 zScatterConfig: ()=>zScatterConfig,
                 zRaceLine: ()=>zRaceLine,
                 zTooltip: ()=>zTooltip,
+                isDualAxisChartType: ()=>isDualAxisChartType,
                 isBarLikeChart: ()=>isBarLikeChart,
-                barParallelAdvancedPipeline: ()=>barParallelAdvancedPipeline,
                 deleteMeasureTreeByCallback: ()=>deleteMeasureTreeByCallback,
+                barParallelAdvancedPipeline: ()=>barParallelAdvancedPipeline,
                 barPercentSpecPipeline: ()=>barPercentSpecPipeline,
-                circlePackingAdvancedPipeline: ()=>circlePackingAdvancedPipeline,
                 dataReshapeByEncoding: ()=>dataReshapeByEncoding,
                 lineSpecPipeline: ()=>lineSpecPipeline,
-                isDualAxisChartType: ()=>isDualAxisChartType,
+                circlePackingAdvancedPipeline: ()=>circlePackingAdvancedPipeline,
                 matchesFieldSelector: ()=>matchesFieldSelector,
                 raceBarAdvancedPipeline: ()=>raceBarAdvancedPipeline,
                 raceColumnAdvancedPipeline: ()=>raceColumnAdvancedPipeline,
                 isPositionMeasure: ()=>isPositionMeasure,
+                createFormatterByDimension: ()=>createFormatterByDimension,
                 zBarPercentConfig: ()=>zBarPercentConfig,
                 zDimensionGroup: ()=>zDimensionGroup,
                 zRacePie: ()=>zRacePie
@@ -3108,6 +3111,7 @@ self.R = R;
                 RaceBar: 'raceBar',
                 RaceColumn: 'raceColumn',
                 RaceScatter: 'raceScatter',
+                RaceLine: 'raceLine',
                 BarPercent: 'barPercent',
                 BarParallel: 'barParallel',
                 Area: 'area',
@@ -3755,6 +3759,161 @@ self.R = R;
                     }
                 };
             };
+            const DEFAULT_SEPARATOR = '-';
+            const parseTimeValue = (value)=>{
+                if (null == value) return;
+                if ('number' == typeof value && Number.isFinite(value)) {
+                    const date = new Date(value);
+                    return Number.isNaN(date.getTime()) ? void 0 : date;
+                }
+                const text = String(value).trim();
+                if (!text) return;
+                const timestamp = Number(text);
+                if (!Number.isNaN(timestamp)) {
+                    const date = new Date(timestamp);
+                    return Number.isNaN(date.getTime()) ? void 0 : date;
+                }
+                const date = new Date(text);
+                return Number.isNaN(date.getTime()) ? void 0 : date;
+            };
+            const parseTextParts = (value)=>{
+                if (null == value) return;
+                const text = String(value).trim();
+                if (!text) return;
+                const match = text.match(/^\\s*(\\d{4})-(\\d{2})-(\\d{2})(?:[T\\s](\\d{2}):(\\d{2}):(\\d{2}))?\\s*$/);
+                if (!match) return;
+                const [, year, month, day, hour, minute, second] = match;
+                return {
+                    year: Number(year),
+                    month: Number(month),
+                    day: Number(day),
+                    hour: hour ? Number(hour) : 0,
+                    minute: minute ? Number(minute) : 0,
+                    second: second ? Number(second) : 0
+                };
+            };
+            const pad2 = (value)=>String(value).padStart(2, '0');
+            const getWeekNumber = (date)=>{
+                const utcDate = new Date(Date.UTC(date.getFullYear(), date.getMonth(), date.getDate()));
+                const day = utcDate.getUTCDay() || 7;
+                utcDate.setUTCDate(utcDate.getUTCDate() + 4 - day);
+                const yearStart = new Date(Date.UTC(utcDate.getUTCFullYear(), 0, 1));
+                const week = Math.ceil(((utcDate.getTime() - yearStart.getTime()) / 86400000 + 1) / 7);
+                return {
+                    year: utcDate.getUTCFullYear(),
+                    week
+                };
+            };
+            const getIntlFormatter = (granularity, locale)=>{
+                const options = {};
+                switch(granularity){
+                    case 'year':
+                        options.year = 'numeric';
+                        break;
+                    case 'quarter':
+                        options.year = 'numeric';
+                        options.month = '2-digit';
+                        break;
+                    case 'month':
+                        options.year = 'numeric';
+                        options.month = '2-digit';
+                        break;
+                    case 'week':
+                        options.year = 'numeric';
+                        options.month = '2-digit';
+                        options.day = '2-digit';
+                        break;
+                    case 'day':
+                        options.year = 'numeric';
+                        options.month = '2-digit';
+                        options.day = '2-digit';
+                        break;
+                    case 'hour':
+                        options.year = 'numeric';
+                        options.month = '2-digit';
+                        options.day = '2-digit';
+                        options.hour = '2-digit';
+                        break;
+                    case 'minute':
+                        options.year = 'numeric';
+                        options.month = '2-digit';
+                        options.day = '2-digit';
+                        options.hour = '2-digit';
+                        options.minute = '2-digit';
+                        break;
+                    case 'second':
+                        options.year = 'numeric';
+                        options.month = '2-digit';
+                        options.day = '2-digit';
+                        options.hour = '2-digit';
+                        options.minute = '2-digit';
+                        options.second = '2-digit';
+                        break;
+                }
+                return new Intl.DateTimeFormat(locale, options);
+            };
+            const formatQuarter = (date, locale, rawText)=>{
+                const parts = rawText ? parseTextParts(rawText) : void 0;
+                const year = parts?.year ?? date.getFullYear();
+                const month = parts?.month ?? date.getMonth() + 1;
+                const quarter = Math.floor((month - 1) / 3) + 1;
+                return 'zh-CN' === locale ? `${year}年Q${quarter}` : `${year} Q${quarter}`;
+            };
+            const formatWeek = (date, locale, rawText)=>{
+                const parts = rawText ? parseTextParts(rawText) : void 0;
+                const weekInfo = parts ? getWeekNumber(new Date(Date.UTC(parts.year, parts.month - 1, parts.day))) : getWeekNumber(date);
+                return 'zh-CN' === locale ? `${weekInfo.year}年第${weekInfo.week}周` : `${weekInfo.year} W${weekInfo.week}`;
+            };
+            const formatDefault = (date, granularity, formatter, locale, rawText)=>{
+                if ('quarter' === granularity) return formatQuarter(date, locale, rawText);
+                if ('week' === granularity) return formatWeek(date, locale, rawText);
+                const parts = formatter.formatToParts(date);
+                const map = parts.reduce((prev, part)=>{
+                    prev[part.type] = part.value;
+                    return prev;
+                }, {});
+                const rawParts = rawText ? parseTextParts(rawText) : void 0;
+                const year = map.year ?? String(rawParts?.year ?? date.getFullYear());
+                const month = map.month ?? pad2(rawParts?.month ?? date.getMonth() + 1);
+                const day = map.day ?? pad2(rawParts?.day ?? date.getDate());
+                const hour = map.hour ?? pad2(rawParts?.hour ?? date.getHours());
+                const minute = map.minute ?? pad2(rawParts?.minute ?? date.getMinutes());
+                const second = map.second ?? pad2(rawParts?.second ?? date.getSeconds());
+                switch(granularity){
+                    case 'year':
+                        return year;
+                    case 'month':
+                        return `${year}-${month}`;
+                    case 'day':
+                        return `${year}-${month}-${day}`;
+                    case 'hour':
+                        return `${year}-${month}-${day} ${hour}`;
+                    case 'minute':
+                        return `${year}-${month}-${day} ${hour}:${minute}`;
+                    case 'second':
+                        return `${year}-${month}-${day} ${hour}:${minute}:${second}`;
+                    default:
+                        return formatter.format(date);
+                }
+            };
+            const createTimeFormatter = (format, fallbackLocale = intl.getLocale())=>{
+                if (!format) return (value)=>String(value);
+                const { type } = format;
+                const finalLocale = fallbackLocale;
+                const intlFormatter = getIntlFormatter(type, finalLocale);
+                return (value)=>{
+                    const date = parseTimeValue(value);
+                    if (!date) return String(value);
+                    const rawText = null == value ? void 0 : String(value);
+                    const formatted = formatDefault(date, type, intlFormatter, finalLocale, rawText);
+                    return formatted.replaceAll('/', DEFAULT_SEPARATOR).replaceAll('.', DEFAULT_SEPARATOR);
+                };
+            };
+            const createFormatterByDimension = (dimension, locale = intl.getLocale())=>{
+                if (!dimension) return (v)=>String(v);
+                if (dimension.timeFormat) return createTimeFormatter(dimension.timeFormat, locale);
+                return (v)=>String(v);
+            };
             function extractLeafIds(tree) {
                 const leafNodes = findTreeNodesBy(tree, ()=>true);
                 return new Set(leafNodes.map((node)=>node.id));
@@ -3794,7 +3953,11 @@ self.R = R;
                 };
                 const eachNode = (node)=>{
                     if (isMeasure(node)) return {
-                        width: 'auto'
+                        width: 'auto',
+                        fieldFormat: (datum)=>{
+                            const formatter = createFormatterByDimension(node, advancedVSeed.locale);
+                            return formatter(datum[node.id]);
+                        }
                     };
                     return {};
                 };
@@ -4471,11 +4634,15 @@ self.R = R;
                 const columns = dimensions.filter((item)=>encoding.column?.includes(item.id));
                 return {
                     ...spec,
-                    columns: columns.map((item)=>({
+                    columns: columns.map((item)=>{
+                        const formatter = createFormatterByDimension(item, advancedVSeed.locale);
+                        return {
                             dimensionKey: item.id,
                             title: item.alias || item.id,
-                            width: 'auto'
-                        }))
+                            width: 'auto',
+                            headerFormat: (value)=>formatter(value)
+                        };
+                    })
                 };
             };
             const pivotRows = (spec, context)=>{
@@ -4485,11 +4652,15 @@ self.R = R;
                 const rows = dimensions.filter((item)=>encoding.row?.includes(item.id));
                 return {
                     ...spec,
-                    rows: rows.map((item)=>({
+                    rows: rows.map((item)=>{
+                        const formatter = createFormatterByDimension(item, advancedVSeed.locale);
+                        return {
                             dimensionKey: item.id,
                             title: item.alias || item.id,
-                            width: 'auto'
-                        }))
+                            width: 'auto',
+                            headerFormat: (value)=>formatter(value)
+                        };
+                    })
                 };
             };
             const pivotIndicators = (spec, context)=>{
@@ -5082,7 +5253,7 @@ self.R = R;
                 };
             };
             const unfoldDimensions = (dataset, dimensions, encoding, options)=>{
-                const { separator } = options;
+                const { separator, formatDimensionValue } = options;
                 const unfoldInfo = {
                     encodingAngle: AngleEncoding,
                     encodingX: XEncoding,
@@ -5119,7 +5290,7 @@ self.R = R;
                     datum[ColorIdEncoding] = colorId;
                     colorIdMap[colorId] = {
                         id: colorId,
-                        alias: getColorAliasItem(ColorEncoding, colorDimensions, datum, separator)
+                        alias: getColorAliasItem(ColorEncoding, colorDimensions, datum, separator, formatDimensionValue)
                     };
                     colorItems.add(colorId);
                 }
@@ -5133,15 +5304,16 @@ self.R = R;
             const applyEncoding = (encoding, dimensions, datum, separator)=>{
                 if (encoding && dimensions.length) datum[encoding] = dimensions.map((dim)=>String(datum[dim.id])).join(separator);
             };
-            const getColorAliasItem = (encoding, dimensions, datum, separator)=>{
+            const getColorAliasItem = (encoding, dimensions, datum, separator, formatDimensionValue)=>{
                 if (encoding && dimensions.length) return dimensions.map((dim)=>{
                     if (dim.id === MeasureId) return String(datum[MeasureName]);
-                    return String(datum[dim.id]);
+                    const rawValue = datum[dim.id];
+                    return formatDimensionValue ? formatDimensionValue(dim, rawValue) : String(rawValue);
                 }).join(separator);
                 return '';
             };
             const dataReshapeByEncoding = (dataset, dimensions, measures, encoding, options)=>{
-                const { foldMeasureId = FoldMeasureId, foldMeasureName = FoldMeasureName, foldMeasureValue = FoldMeasureValue, colorItemAsId = false, colorMeasureId, omitIds } = options || {};
+                const { foldMeasureId = FoldMeasureId, foldMeasureName = FoldMeasureName, foldMeasureValue = FoldMeasureValue, colorItemAsId = false, colorMeasureId, locale, omitIds } = options || {};
                 const { dataset: foldedDataset, foldInfo } = foldMeasures(dataset, measures, {
                     measureId: foldMeasureId,
                     measureName: foldMeasureName,
@@ -5152,7 +5324,11 @@ self.R = R;
                 const { dataset: finalDataset, unfoldInfo } = unfoldDimensions(foldedDataset, dimensions, encoding, {
                     foldMeasureId,
                     separator: "-",
-                    colorItemAsId
+                    colorItemAsId,
+                    formatDimensionValue: (dimension, value)=>{
+                        const formatter = createFormatterByDimension(dimension, locale);
+                        return formatter(value);
+                    }
                 });
                 return {
                     dataset: finalDataset,
@@ -5192,7 +5368,8 @@ self.R = R;
                 const { dataset: newDatasets, foldInfo, unfoldInfo } = dataReshapeByEncoding(dataset, T(advancedVSeed.reshapeDimensions ?? advancedVSeed.dimensions ?? [], (item)=>item.id), T(advancedVSeed.reshapeMeasures?.[0] ?? [], (item)=>item.id), encoding, {
                     colorItemAsId: false,
                     colorMeasureId,
-                    omitIds: allMeasuresIds
+                    omitIds: allMeasuresIds,
+                    locale: advancedVSeed.locale
                 });
                 return {
                     ...result,
@@ -5226,7 +5403,8 @@ self.R = R;
                         colorItemAsId: false,
                         foldMeasureValue: `${FoldMeasureValue}${groupId}`,
                         colorMeasureId: getColorMeasureId(advancedVSeed, vseed),
-                        omitIds: allMeasuresIds
+                        omitIds: allMeasuresIds,
+                        locale: advancedVSeed.locale
                     });
                     const reshapeInfo = {
                         id: `${groupId}`,
@@ -5660,13 +5838,25 @@ self.R = R;
                     0.1
                 ];
                 if (common_isNil(bandAxis.title?.text)) bandAxis.title.text = defaultTitleText(measures, dimensions, encoding.x);
-                if (onlyMeasureId && bandAxis.label) {
+                if (bandAxis.label) {
                     const allDatasetReshapeInfo = pivotAllDatasetReshapeInfo || datasetReshapeInfo;
                     const colorIdMap = allDatasetReshapeInfo.reduce((prev, cur)=>({
                             ...prev,
                             ...cur.unfoldInfo.colorIdMap
                         }), {});
-                    bandAxis.label.formatMethod = (text)=>common_isArray(text) ? text : colorIdMap[String(text)]?.alias ?? text;
+                    const dimensionMap = new Map(dimensions.map((item)=>[
+                            item.id,
+                            item
+                        ]));
+                    const dimIds = (encoding.x || []).filter((v)=>v !== MeasureId);
+                    const dimFormatter = dimIds.length ? createFormatterByDimension(dimensionMap.get(dimIds[0]), advancedVSeed.locale) : null;
+                    bandAxis.label.formatMethod = (text)=>{
+                        if (common_isArray(text)) return text;
+                        if (onlyMeasureId) return colorIdMap[String(text)]?.alias ?? text;
+                        const rawText = String(text ?? '');
+                        if (!dimFormatter) return rawText;
+                        return dimFormatter(rawText);
+                    };
                 }
                 result.axes = [
                     ...result.axes,
@@ -6340,7 +6530,7 @@ self.R = R;
                 const percentValue = num / sum;
                 return formatter(percentValue);
             };
-            const buildLabel = (label, vseedMeasures = [], vseedDimensions = [], advancedVSeedDimensions, advancedVSeedMeasures, encoding, foldInfoList)=>{
+            const buildLabel = (label, vseedMeasures = [], vseedDimensions = [], advancedVSeedDimensions, advancedVSeedMeasures, encoding, foldInfoList, locale = 'zh-CN')=>{
                 const { enable, wrap, showValue, showValuePercent, showDimension, labelOverlap, labelColorSmartInvert, labelStroke, labelColor, labelFontSize, labelFontWeight, labelBackgroundColor, labelPosition, autoFormat, numFormat = {} } = label;
                 const hasDimLabelEncoding = vseedDimensions.some((item)=>encoding.label?.includes(item.id));
                 const labelDims = T(hasDimLabelEncoding ? vseedDimensions.filter((item)=>encoding.label?.includes(item.id)) : showDimension ? advancedVSeedDimensions.filter((d)=>d.id !== MeasureId && 'row' !== d.encoding && 'column' !== d.encoding) : [], (item)=>item.id);
@@ -6360,7 +6550,8 @@ self.R = R;
                         const result = [];
                         const dimLabels = labelDims.map((item)=>{
                             const id = item.id;
-                            return datum[id];
+                            const formatter = createFormatterByDimension(item, locale);
+                            return formatter(datum[id]);
                         });
                         const meaLabels = labelMeas.map((item)=>generateMeasureValue(datum[item.id], item, autoFormat, numFormat));
                         result.push(...dimLabels);
@@ -6481,37 +6672,55 @@ self.R = R;
                 const color = actualTooltip.content[0].shapeFill ?? 'transparent';
                 setWholeIcon(shapeContainer, color);
             };
-            const tooltip_tooltip = (spec, context)=>{
-                const result = {
-                    ...spec
-                };
-                const { advancedVSeed, vseed } = context;
-                const { measures = [], datasetReshapeInfo, chartType, dimensions = [], encoding, reshapeMeasures = [] } = advancedVSeed;
-                const baseConfig = advancedVSeed.config[chartType];
-                const { tooltip = {
-                    enable: true
-                } } = baseConfig;
-                const { enable = true } = tooltip;
-                const { foldInfo, unfoldInfo } = datasetReshapeInfo[0];
-                result.tooltip = {
-                    style: getTooltipStyle(tooltip),
-                    visible: !!enable,
-                    mark: {
-                        title: {
-                            visible: false
+            const tooltip_tooltip = (tooltipOptions)=>(spec, context)=>{
+                    const result = {
+                        ...spec
+                    };
+                    if (!context) return result;
+                    const { advancedVSeed, vseed } = context;
+                    const { measures = [], datasetReshapeInfo, chartType, dimensions = [], encoding, reshapeMeasures = [] } = advancedVSeed;
+                    const baseConfig = advancedVSeed.config?.[chartType];
+                    const { tooltip = {
+                        enable: true
+                    } } = baseConfig ?? {};
+                    const { enable = true } = tooltip;
+                    const { foldInfo, unfoldInfo } = datasetReshapeInfo[0];
+                    const { titleEncoding } = tooltipOptions || {};
+                    result.tooltip = {
+                        style: getTooltipStyle(tooltip),
+                        visible: !!enable,
+                        group: {
+                            title: {
+                                visible: false
+                            }
                         },
-                        content: createMarkContent(encoding.tooltip || [], dimensions, vseed.measures, foldInfo, unfoldInfo)
-                    },
-                    dimension: {
-                        title: {
-                            visible: true
+                        mark: {
+                            title: {
+                                visible: false
+                            },
+                            content: createMarkContent(encoding.tooltip || [], dimensions, vseed.measures, foldInfo, unfoldInfo, advancedVSeed.locale)
                         },
-                        content: createDimensionContent(encoding.tooltip || [], encoding.color || [], measures, foldInfo, unfoldInfo, reshapeMeasures.length > 1)
-                    },
-                    updateElement: updateTooltipElement
+                        dimension: {
+                            title: {
+                                visible: true,
+                                value: titleEncoding ? (datum)=>{
+                                    if (!datum) return '';
+                                    const dimIds = encoding[titleEncoding] || [];
+                                    const formatted = dimIds.map((id)=>{
+                                        const dim = dimensions.find((item)=>item.id === id);
+                                        if (!dim) return datum?.[id];
+                                        const formatter = createFormatterByDimension(dim, advancedVSeed.locale);
+                                        return formatter(datum?.[id]);
+                                    });
+                                    return formatted.join("-");
+                                } : void 0
+                            },
+                            content: createDimensionContent(encoding.tooltip || [], encoding.color || [], measures, foldInfo, unfoldInfo, reshapeMeasures.length > 1)
+                        },
+                        updateElement: updateTooltipElement
+                    };
+                    return result;
                 };
-                return result;
-            };
             const createDimensionContent = (tooltips, colors, measures = [], foldInfo, unfoldInfo, hasMultiMeasureGroup)=>{
                 const { measureId, measureValue, foldMap } = foldInfo;
                 const { encodingColor } = unfoldInfo;
@@ -6552,7 +6761,7 @@ self.R = R;
                     }
                 ];
             };
-            const createMarkContent = (tooltip, dimensions = [], measures = [], foldInfo, unfoldInfo)=>{
+            const createMarkContent = (tooltip, dimensions = [], measures = [], foldInfo, unfoldInfo, locale)=>{
                 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)=>({
@@ -6566,7 +6775,8 @@ self.R = R;
                         },
                         value: (v)=>{
                             const datum = v;
-                            return datum && datum[item.id];
+                            const formatter = createFormatterByDimension(item, locale);
+                            return datum ? formatter(datum[item.id]) : '';
                         }
                     }));
                 const meaContent = meas.map((item)=>({
@@ -8084,6 +8294,10 @@ self.R = R;
                         const measure = measures.find((m)=>m.id === title);
                         return measure ? measure.alias ?? measure.id : title;
                     };
+                    else if (dim.timeFormat) {
+                        const formatter = createFormatterByDimension(dim, advancedVSeed.locale);
+                        baseConfig.headerFormat = (value)=>formatter(value);
+                    }
                     return baseConfig;
                 });
                 return {
@@ -8109,6 +8323,10 @@ self.R = R;
                         const measure = measures.find((m)=>m.id === title);
                         return measure ? measure.alias ?? measure.id : title;
                     };
+                    else if (dim.timeFormat) {
+                        const formatter = createFormatterByDimension(dim, advancedVSeed.locale);
+                        baseConfig.headerFormat = (value)=>formatter(value);
+                    }
                     return baseConfig;
                 });
                 return {
@@ -8405,7 +8623,9 @@ self.R = R;
                 pointStateDimensionHover,
                 colorLineStyleFill(lineStyle_lineStyle),
                 label_label,
-                tooltip_tooltip,
+                tooltip_tooltip({
+                    titleEncoding: 'x'
+                }),
                 annotationPoint_annotationPoint,
                 annotationVerticalLine_annotationVerticalLine,
                 annotationHorizontalLine_annotationHorizontalLine,
@@ -8431,7 +8651,9 @@ self.R = R;
                     pointStateDimensionHover,
                     colorLineStyleFill(lineStyle_lineStyle),
                     label_label,
-                    tooltip_tooltip,
+                    tooltip_tooltip({
+                        titleEncoding: 'x'
+                    }),
                     annotationPoint_annotationPoint,
                     annotationVerticalLine_annotationVerticalLine,
                     annotationHorizontalLine_annotationHorizontalLine,
@@ -9391,7 +9613,9 @@ self.R = R;
                 yLinear,
                 label_label,
                 brush_brush,
-                tooltip_tooltip,
+                tooltip_tooltip({
+                    titleEncoding: 'x'
+                }),
                 verticalCrosshairRect,
                 colorAdapter(discreteLegend, colorLegend),
                 colorBarStyleFill(barStyle_barStyle),
@@ -9419,7 +9643,9 @@ self.R = R;
                     pivotAxisStyle(yLinear),
                     brush_brush,
                     label_label,
-                    tooltip_tooltip,
+                    tooltip_tooltip({
+                        titleEncoding: 'x'
+                    }),
                     verticalCrosshairRect,
                     colorBarStyleFill(barStyle_barStyle),
                     annotationPoint_annotationPoint,
@@ -9600,7 +9826,9 @@ self.R = R;
                 yLinear,
                 label_label,
                 brush_brush,
-                tooltip_tooltip,
+                tooltip_tooltip({
+                    titleEncoding: 'x'
+                }),
                 colorAdapter(discreteLegend, colorLegend),
                 verticalCrosshairRect,
                 colorBarStyleFill(barStyle_barStyle),
@@ -9626,7 +9854,9 @@ self.R = R;
                     pivotAxisStyle(yLinear),
                     brush_brush,
                     label_label,
-                    tooltip_tooltip,
+                    tooltip_tooltip({
+                        titleEncoding: 'x'
+                    }),
                     verticalCrosshairRect,
                     colorBarStyleFill(barStyle_barStyle),
                     annotationPoint_annotationPoint,
@@ -9700,7 +9930,9 @@ self.R = R;
                 yLinear,
                 label_label,
                 brush_brush,
-                tooltip_tooltip,
+                tooltip_tooltip({
+                    titleEncoding: 'x'
+                }),
                 colorAdapter(discreteLegend, colorLegend),
                 verticalCrosshairRect,
                 colorBarStyleFill(barStyle_barStyle),
@@ -9728,7 +9960,9 @@ self.R = R;
                     pivotAxisStyle(yLinear),
                     brush_brush,
                     label_label,
-                    tooltip_tooltip,
+                    tooltip_tooltip({
+                        titleEncoding: 'x'
+                    }),
                     verticalCrosshairRect,
                     colorBarStyleFill(barStyle_barStyle),
                     annotationPoint_annotationPoint,
@@ -9991,13 +10225,25 @@ self.R = R;
                     0.1
                 ];
                 if (common_isNil(bandAxis.title?.text)) bandAxis.title.text = defaultTitleText(measures, dimensions, encoding.y);
-                if (onlyMeasureId && bandAxis.label) {
+                if (bandAxis.label) {
                     const allDatasetReshapeInfo = pivotAllDatasetReshapeInfo || datasetReshapeInfo;
                     const colorIdMap = allDatasetReshapeInfo.reduce((prev, cur)=>({
                             ...prev,
                             ...cur.unfoldInfo.colorIdMap
                         }), {});
-                    bandAxis.label.formatMethod = (text)=>common_isArray(text) ? text : colorIdMap[String(text)]?.alias ?? text;
+                    const dimensionMap = new Map(dimensions.map((item)=>[
+                            item.id,
+                            item
+                        ]));
+                    const dimIds = (encoding.y || []).filter((v)=>v !== MeasureId);
+                    const dimFormatter = dimIds.length ? createFormatterByDimension(dimensionMap.get(dimIds[0]), advancedVSeed.locale) : null;
+                    bandAxis.label.formatMethod = (text)=>{
+                        if (common_isArray(text)) return text;
+                        if (onlyMeasureId) return colorIdMap[String(text)]?.alias ?? text;
+                        const rawText = String(text ?? '');
+                        if (!dimFormatter) return rawText;
+                        return dimFormatter(rawText);
+                    };
                 }
                 result.axes = [
                     ...result.axes,
@@ -10060,7 +10306,9 @@ self.R = R;
                 yBand,
                 label_label,
                 brush_brush,
-                tooltip_tooltip,
+                tooltip_tooltip({
+                    titleEncoding: 'y'
+                }),
                 colorAdapter(discreteLegend, colorLegend),
                 horizontalCrosshairRect,
                 colorBarStyleFill(barStyle_barStyle),
@@ -10086,7 +10334,9 @@ self.R = R;
                     pivotAxisStyle(yBand),
                     label_label,
                     brush_brush,
-                    tooltip_tooltip,
+                    tooltip_tooltip({
+                        titleEncoding: 'y'
+                    }),
                     colorBarStyleFill(barStyle_barStyle),
                     horizontalCrosshairRect,
                     annotationPoint_annotationPoint,
@@ -10422,7 +10672,9 @@ self.R = R;
                 yBand,
                 label_label,
                 brush_brush,
-                tooltip_tooltip,
+                tooltip_tooltip({
+                    titleEncoding: 'y'
+                }),
                 colorAdapter(discreteLegend, colorLegend),
                 horizontalCrosshairRect,
                 colorBarStyleFill(barStyle_barStyle),
@@ -10745,7 +10997,9 @@ self.R = R;
                 yLinear,
                 label_label,
                 brush_brush,
-                tooltip_tooltip,
+                tooltip_tooltip({
+                    titleEncoding: 'x'
+                }),
                 colorAdapter(discreteLegend, colorLegend),
                 horizontalCrosshairRect,
                 colorBarStyleFill(barStyle_barStyle),
@@ -10911,7 +11165,8 @@ self.R = R;
                     foldMeasureId: FoldXMeasureId,
                     colorItemAsId: true,
                     colorMeasureId: getColorMeasureId(advancedVSeed, vseed),
-                    omitIds: xMeasures.map((m)=>m.id).filter((id)=>!sizeEncodingIds.includes(id))
+                    omitIds: xMeasures.map((m)=>m.id).filter((id)=>!sizeEncodingIds.includes(id)),
+                    locale: advancedVSeed.locale
                 });
                 datasets.push(xResult.dataset);
                 foldInfoList.push(xResult.foldInfo);
@@ -10921,7 +11176,8 @@ self.R = R;
                     foldMeasureId: FoldYMeasureId,
                     colorItemAsId: true,
                     colorMeasureId: getColorMeasureId(advancedVSeed, vseed),
-                    omitIds: yMeasures.map((m)=>m.id).filter((id)=>!sizeEncodingIds.includes(id))
+                    omitIds: yMeasures.map((m)=>m.id).filter((id)=>!sizeEncodingIds.includes(id)),
+                    locale: advancedVSeed.locale
                 });
                 datasets[0] = yResult.dataset;
                 foldInfoList.push(yResult.foldInfo);
@@ -10972,7 +11228,8 @@ self.R = R;
                         foldMeasureId: FoldXMeasureId,
                         colorItemAsId: true,
                         colorMeasureId: getColorMeasureId(advancedVSeed, vseed),
-                        omitIds: allMeasuresIds
+                        omitIds: allMeasuresIds,
+                        locale: advancedVSeed.locale
                     });
                     datasets.push(xResult.dataset);
                     foldInfoList.push(xResult.foldInfo);
@@ -10982,7 +11239,8 @@ self.R = R;
                         foldMeasureId: FoldYMeasureId,
                         colorItemAsId: true,
                         colorMeasureId: getColorMeasureId(advancedVSeed, vseed),
-                        omitIds: allMeasuresIds
+                        omitIds: allMeasuresIds,
+                        locale: advancedVSeed.locale
                     });
                     datasets.push(yResult.dataset);
                     foldInfoList.push(yResult.foldInfo);
@@ -11312,7 +11570,7 @@ self.R = R;
                 const baseConfig = advancedVSeed.config[chartType];
                 const foldInfoList = datasetReshapeInfo[0].foldInfoList;
                 const { label } = baseConfig;
-                result.label = buildLabel(label, vseed.measures, vseed.dimensions, advancedVSeed.dimensions, advancedVSeed.measures, encoding, foldInfoList);
+                result.label = buildLabel(label, vseed.measures, vseed.dimensions, advancedVSeed.dimensions, advancedVSeed.measures, encoding, foldInfoList, advancedVSeed?.locale);
                 return result;
             };
             const tooltipScatter = (spec, context)=>{
@@ -11358,7 +11616,8 @@ self.R = R;
                         },
                         value: (v)=>{
                             const datum = v;
-                            return datum && datum[item.id];
+                            const formatter = createFormatterByDimension(item, locale);
+                            return datum ? formatter(datum[item.id]) : '';
                         }
                     }));
                 const meaContent = meas.map((item)=>({
@@ -12195,7 +12454,9 @@ self.R = R;
                 colorAdapter(discreteLegend, colorLegend),
                 colorLineStyleFill(lineStyle_lineStyle),
                 label_label,
-                tooltip_tooltip,
+                tooltip_tooltip({
+                    titleEncoding: 'x'
+                }),
                 annotationPoint_annotationPoint,
                 annotationVerticalLine_annotationVerticalLine,
                 annotationHorizontalLine_annotationHorizontalLine,
@@ -12540,7 +12801,7 @@ self.R = R;
                 const { label } = baseConfig;
                 result.label = buildLabel(label, vseed.measures, vseed.dimensions, advancedVSeed.dimensions, advancedVSeed.measures, encoding, [
                     foldInfo
-                ]);
+                ], advancedVSeed?.locale);
                 if (label.labelLayout) result.label.layout = {
                     align: label.labelLayout
                 };
@@ -12556,7 +12817,9 @@ self.R = R;
                 colorPieStyleFill(pieStyle),
                 colorAdapter(discreteLegend, colorLegend),
                 labelPie,
-                tooltip_tooltip,
+                tooltip_tooltip({
+                    titleEncoding: 'color'
+                }),
                 annotationPoint_annotationPoint,
                 annotationVerticalLine_annotationVerticalLine,
                 annotationHorizontalLine_annotationHorizontalLine,
@@ -12693,7 +12956,9 @@ self.R = R;
                 labelPie,
                 colorPieStyleFill(pieStyle),
                 colorAdapter(discreteLegend, colorLegend),
-                tooltip_tooltip,
+                tooltip_tooltip({
+                    titleEncoding: 'color'
+                }),
                 annotationPoint_annotationPoint,
                 annotationVerticalLine_annotationVerticalLine,
                 annotationHorizontalLine_annotationHorizontalLine,
@@ -12777,7 +13042,9 @@ self.R = R;
                 yBand,
                 label_label,
                 brush_brush,
-                tooltip_tooltip,
+                tooltip_tooltip({
+                    titleEncoding: 'y'
+                }),
                 colorAdapter(discreteLegend, colorLegend),
                 horizontalCrosshairRect,
                 colorBarStyleFill(barStyle_barStyle),
@@ -12802,7 +13069,9 @@ self.R = R;
                     pivotAxisStyle(yBand),
                     brush_brush,
                     label_label,
-                    tooltip_tooltip,
+                    tooltip_tooltip({
+                        titleEncoding: 'y'
+                    }),
                     colorBarStyleFill(barStyle_barStyle),
                     horizontalCrosshairRect,
                     annotationPoint_annotationPoint,
@@ -12868,7 +13137,9 @@ self.R = R;
                 yBand,
                 label_label,
                 brush_brush,
-                tooltip_tooltip,
+                tooltip_tooltip({
+                    titleEncoding: 'y'
+                }),
                 colorAdapter(discreteLegend, colorLegend),
                 horizontalCrosshairRect,
                 colorBarStyleFill(barStyle_barStyle),
@@ -12894,7 +13165,9 @@ self.R = R;
                     pivotAxisStyle(yBand),
                     brush_brush,
                     label_label,
-                    tooltip_tooltip,
+                    tooltip_tooltip({
+                        titleEncoding: 'y'
+                    }),
                     colorBarStyleFill(barStyle_barStyle),
                     horizontalCrosshairRect,
                     annotationPoint_annotationPoint,
@@ -13047,7 +13320,9 @@ self.R = R;
                 yLinear,
                 label_label,
                 brush_brush,
-                tooltip_tooltip,
+                tooltip_tooltip({
+                    titleEncoding: 'x'
+                }),
                 colorAdapter(discreteLegend, colorLegend),
                 verticalCrosshairLine,
                 colorPointStyleFill(pointStyle_pointStyle),
@@ -13076,7 +13351,9 @@ self.R = R;
                     pivotAxisStyle(yLinear),
                     label_label,
                     brush_brush,
-                    tooltip_tooltip,
+                    tooltip_tooltip({
+                        titleEncoding: 'x'
+                    }),
                     verticalCrosshairLine,
                     colorPointStyleFill(pointStyle_pointStyle),
                     pointStateDimensionHover,
@@ -13145,7 +13422,9 @@ self.R = R;
                 yLinear,
                 label_label,
                 brush_brush,
-                tooltip_tooltip,
+                tooltip_tooltip({
+                    titleEncoding: 'x'
+                }),
                 colorAdapter(discreteLegend, colorLegend),
                 verticalCrosshairLine,
                 colorPointStyleFill(pointStyle_pointStyle),
@@ -13174,7 +13453,9 @@ self.R = R;
                     pivotAxisStyle(yLinear),
                     label_label,
                     brush_brush,
-                    tooltip_tooltip,
+                    tooltip_tooltip({
+                        titleEncoding: 'x'
+                    }),
                     verticalCrosshairLine,
                     colorPointStyleFill(pointStyle_pointStyle),
                     pointStateDimensionHover,
@@ -13490,7 +13771,8 @@ self.R = R;
                         colorItemAsId: false,
                         foldMeasureValue: FoldPrimaryMeasureValue,
                         colorMeasureId: getColorMeasureId(advancedVSeed, vseed),
-                        omitIds: allMeasuresIds
+                        omitIds: allMeasuresIds,
+                        locale: advancedVSeed.locale
                     });
                     primaryResult.dataset.forEach((row)=>{
                         row[DimAxisType] = 'primaryYAxis';
@@ -13504,7 +13786,8 @@ self.R = R;
                         colorItemAsId: false,
                         foldMeasureValue: FoldSecondaryMeasureValue,
                         colorMeasureId: getColorMeasureId(advancedVSeed, vseed),
-                        omitIds: allMeasuresIds
+                        omitIds: allMeasuresIds,
+                        locale: advancedVSeed.locale
                     });
                     secondaryResult.dataset.forEach((row)=>{
                         row[DimAxisType] = 'secondaryYAxis';
@@ -13562,7 +13845,8 @@ self.R = R;
                             colorItemAsId: false,
                             foldMeasureValue: `${FoldPrimaryMeasureValue}${index}`,
                             colorMeasureId: getColorMeasureId(advancedVSeed, vseed),
-                            omitIds: allMeasuresIds
+                            omitIds: allMeasuresIds,
+                            locale: advancedVSeed.locale
                         });
                         primaryResult.dataset.forEach((row)=>{
                             row[DimAxisType] = 'primaryYAxis';
@@ -13576,7 +13860,8 @@ self.R = R;
                             colorItemAsId: false,
                             foldMeasureValue: `${FoldSecondaryMeasureValue}${index}`,
                             colorMeasureId: getColorMeasureId(advancedVSeed, vseed),
-                            omitIds: allMeasuresIds
+                            omitIds: allMeasuresIds,
+                            locale: advancedVSeed.locale
                         });
                         secondaryResult.dataset.forEach((row)=>{
                             row[DimAxisType] = 'secondaryYAxis';
@@ -13856,7 +14141,7 @@ self.R = R;
                     const baseConfig = advancedVSeed.config[chartType];
                     result.label = buildLabel(baseConfig.label, vseed.measures, vseed.dimensions, advancedVSeed.dimensions, advancedVSeed.measures, encoding, [
                         options.foldInfo
-                    ]);
+                    ], advancedVSeed?.locale);
                     result.label.zIndex = 1002;
                     return result;
                 };
@@ -13878,11 +14163,22 @@ self.R = R;
                             title: {
                                 visible: false
                             },
-                            content: createMarkContent(encoding.tooltip || [], dimensions, vseed.measures, options.foldInfo, unfoldInfo)
+                            content: createMarkContent(encoding.tooltip || [], dimensions, vseed.measures, options.foldInfo, unfoldInfo, advancedVSeed.locale)
                         },
                         dimension: {
                             title: {
-                                visible: true
+                                visible: true,
+                                value: (datum)=>{
+                                    if (!datum) return '';
+                                    const dimIds = encoding.x || [];
+                                    const formatted = dimIds.map((id)=>{
+                                        const dim = dimensions.find((item)=>item.id === id);
+                                        if (!dim) return datum?.[id];
+                                        const formatter = createFormatterByDimension(dim, advancedVSeed.locale);
+                                        return formatter(datum?.[id]);
+                                    });
+                                    return formatted.join("-");
+                                }
                             },
                             content: createDimensionContent(encoding.tooltip || [], encoding.color || [], measures, options.foldInfo, unfoldInfo, reshapeMeasures.length > 1)
                         }
@@ -14056,21 +14352,21 @@ self.R = R;
             };
             const isObjectLike = (value)=>"object" == typeof value && null !== value;
             const common_isObjectLike = isObjectLike;
-            const isPlainObject_isPlainObject = function(value) {
+            const isPlainObject = function(value) {
                 if (!common_isObjectLike(value) || !isType(value, "Object")) return !1;
                 if (null === Object.getPrototypeOf(value)) return !0;
                 let proto = value;
                 for(; null !== Object.getPrototypeOf(proto);)proto = Object.getPrototypeOf(proto);
                 return Object.getPrototypeOf(value) === proto;
             };
-            const isPlainObject = isPlainObject_isPlainObject;
+            const common_isPlainObject = isPlainObject;
             const isString_isString = (value, fuzzy = !1)=>{
                 const type = typeof value;
                 return fuzzy ? "string" === type : "string" === type || isType(value, "String");
             };
             const isString = isString_isString;
             function pickWithout(obj, keys) {
-                if (!obj || !isPlainObject(obj)) return obj;
+                if (!obj || !common_isPlainObject(obj)) return obj;
                 const result = {};
                 return Object.keys(obj).forEach((k)=>{
                     const v = obj[k];
@@ -14302,7 +14598,9 @@ self.R = R;
                 colorPieStyleFill(pieStyle),
                 colorAdapter(discreteLegend, colorLegend),
                 labelPie,
-                tooltip_tooltip,
+                tooltip_tooltip({
+                    titleEncoding: 'color'
+                }),
                 annotationPoint_annotationPoint,
                 annotationVerticalLine_annotationVerticalLine,
                 annotationHorizontalLine_annotationHorizontalLine,
@@ -14323,7 +14621,9 @@ self.R = R;
                     brush_brush,
                     colorPieStyleFill(pieStyle),
                     labelPie,
-                    tooltip_tooltip,
+                    tooltip_tooltip({
+                        titleEncoding: 'color'
+                    }),
                     annotationPoint_annotationPoint,
                     annotationVerticalLine_annotationVerticalLine,
                     annotationHorizontalLine_annotationHorizontalLine,
@@ -14382,7 +14682,9 @@ self.R = R;
                 labelPie,
                 colorPieStyleFill(pieStyle),
                 colorAdapter(discreteLegend, colorLegend),
-                tooltip_tooltip,
+                tooltip_tooltip({
+                    titleEncoding: 'color'
+                }),
                 annotationPoint_annotationPoint,
                 annotationVerticalLine_annotationVerticalLine,
                 annotationHorizontalLine_annotationHorizontalLine,
@@ -14404,7 +14706,9 @@ self.R = R;
                     brush_brush,
                     labelPie,
                     colorPieStyleFill(pieStyle),
-                    tooltip_tooltip,
+                    tooltip_tooltip({
+                        titleEncoding: 'color'
+                    }),
                     annotationPoint_annotationPoint,
                     annotationVerticalLine_annotationVerticalLine,
                     annotationHorizontalLine_annotationHorizontalLine,
@@ -14611,7 +14915,9 @@ self.R = R;
                 colorRoseStyleFill(roseStyle),
                 colorAdapter(discreteLegend, colorLegend),
                 labelPie,
-                tooltip_tooltip
+                tooltip_tooltip({
+                    titleEncoding: 'angle'
+                })
             ];
             const pivotRose = [
                 initPivot,
@@ -14632,7 +14938,9 @@ self.R = R;
                     verticalCrosshairRect,
                     colorRoseStyleFill(roseStyle),
                     labelPie,
-                    tooltip_tooltip
+                    tooltip_tooltip({
+                        titleEncoding: 'angle'
+                    })
                 ]),
                 pivotRowDimensions,
                 pivotColumnDimensions,
@@ -14731,7 +15039,9 @@ self.R = R;
                 colorRoseStyleFill(roseStyle),
                 colorAdapter(discreteLegend, colorLegend),
                 labelPie,
-                tooltip_tooltip,
+                tooltip_tooltip({
+                    titleEncoding: 'angle'
+                }),
                 verticalCrosshairRect,
                 annotationPoint_annotationPoint,
                 annotationVerticalLine_annotationVerticalLine,
@@ -14756,7 +15066,9 @@ self.R = R;
                     verticalCrosshairRect,
                     colorRoseStyleFill(roseStyle),
                     labelPie,
-                    tooltip_tooltip,
+                    tooltip_tooltip({
+                        titleEncoding: 'angle'
+                    }),
                     annotationPoint_annotationPoint,
                     annotationVerticalLine_annotationVerticalLine,
                     annotationHorizontalLine_annotationHorizontalLine,
@@ -14896,16 +15208,39 @@ self.R = R;
                 result.animation = true;
                 return result;
             };
-            const radarAngleAxis = (spec)=>{
+            const radarAngleAxis = (spec, context)=>{
                 const result = {
                     ...spec
                 };
+                const { advancedVSeed } = context;
+                const { dimensions = [], encoding, datasetReshapeInfo, pivotAllDatasetReshapeInfo } = advancedVSeed;
                 if (!result.axes) result.axes = [];
+                const onlyMeasureId = 0 === (encoding.angle || []).filter((v)=>v !== MeasureId).length;
+                const dimensionMap = new Map(dimensions.map((item)=>[
+                        item.id,
+                        item
+                    ]));
+                const dimIds = (encoding.angle || []).filter((v)=>v !== MeasureId);
+                const dimFormatter = dimIds.length ? createFormatterByDimension(dimensionMap.get(dimIds[0]), advancedVSeed.locale) : null;
+                const allDatasetReshapeInfo = pivotAllDatasetReshapeInfo || datasetReshapeInfo;
+                const colorIdMap = allDatasetReshapeInfo.reduce((prev, cur)=>({
+                        ...prev,
+                        ...cur.unfoldInfo.colorIdMap
+                    }), {});
                 result.axes.push({
                     orient: 'angle',
                     visible: true,
                     zero: true,
                     nice: true,
+                    label: {
+                        formatMethod: (text)=>{
+                            if (common_isArray(text)) return text;
+                            if (onlyMeasureId) return colorIdMap[String(text)]?.alias ?? text;
+                            const rawText = String(text ?? '');
+                            if (!dimFormatter) return rawText;
+                            return dimFormatter(rawText);
+                        }
+                    },
                     grid: {
                         visible: true
                     },
@@ -14952,7 +15287,9 @@ self.R = R;
                 radarAngleAxis,
                 radarRadiusAxis,
                 label_label,
-                tooltip_tooltip,
+                tooltip_tooltip({
+                    titleEncoding: 'angle'
+                }),
                 colorAdapter(discreteLegend, colorLegend),
                 verticalCrosshairLine,
                 colorPointStyleFill(pointStyle_pointStyle),
@@ -14976,7 +15313,9 @@ self.R = R;
                     radarAngleAxis,
                     radarRadiusAxis,
                     label_label,
-                    tooltip_tooltip,
+                    tooltip_tooltip({
+                        titleEncoding: 'angle'
+                    }),
                     verticalCrosshairLine,
                     colorPointStyleFill(pointStyle_pointStyle),
                     pointStateDimensionHover,
@@ -15176,7 +15515,9 @@ self.R = R;
                 colorAdapter(discreteLegend, colorLegend),
                 colorFunnelStyleFill(funnelStyle),
                 funnelTransformStyle,
-                tooltip_tooltip,
+                tooltip_tooltip({
+                    titleEncoding: 'color'
+                }),
                 annotationPoint_annotationPoint,
                 annotationVerticalLine_annotationVerticalLine,
                 annotationHorizontalLine_annotationHorizontalLine,
@@ -15195,7 +15536,9 @@ self.R = R;
                     datasetXY,
                     colorAdapter(color_color, linearColor),
                     label_label,
-                    tooltip_tooltip,
+                    tooltip_tooltip({
+                        titleEncoding: 'color'
+                    }),
                     colorFunnelStyleFill(funnelStyle),
                     funnelTransformStyle,
                     annotationPoint_annotationPoint,
@@ -15350,6 +15693,7 @@ self.R = R;
                 };
                 const { advancedVSeed, vseed } = context;
                 const { chartType } = vseed;
+                const { dimensions = [], encoding } = advancedVSeed;
                 const xAxisConfig = advancedVSeed.config?.[chartType]?.xAxis ?? {};
                 const yAxisConfig = advancedVSeed.config?.[chartType]?.yAxis ?? {};
                 const xBandAxis = bandAxisStyle(xAxisConfig);
@@ -15358,6 +15702,18 @@ self.R = R;
                 xBandAxis.bandPadding = 0;
                 yBandAxis.orient = 'left';
                 yBandAxis.bandPadding = 0;
+                const formatBandLabel = (axis)=>{
+                    const dimIds = ('x' === axis ? encoding.x : encoding.y) || [];
+                    const dimFormatter = dimIds.length ? createFormatterByDimension(dimensions.find((item)=>item.id === dimIds[0]), advancedVSeed.locale) : null;
+                    return (text)=>{
+                        if (Array.isArray(text)) return text;
+                        const rawText = String(text ?? '');
+                        if (!dimFormatter) return rawText;
+                        return dimFormatter(rawText);
+                    };
+                };
+                if (xBandAxis.label) xBandAxis.label.formatMethod = formatBandLabel('x');
+                if (yBandAxis.label) yBandAxis.label.formatMethod = formatBandLabel('y');
                 result.axes = [
                     xBandAxis,
                     yBandAxis
@@ -15450,7 +15806,8 @@ self.R = R;
                         },
                         value: (v)=>{
                             const datum = v;
-                            return datum && datum[item.id];
+                            const formatter = createFormatterByDimension(item, locale);
+                            return datum ? formatter(datum[item.id]) : '';
                         }
                     }));
                 const meaContent = meas.map((item)=>({
@@ -15784,7 +16141,11 @@ self.R = R;
                     const res = unfoldDimensions(boxPlotDataList, uniqDims, encoding, {
                         foldMeasureId: FoldMeasureId,
                         separator: "-",
-                        colorItemAsId: false
+                        colorItemAsId: false,
+                        formatDimensionValue: (dimension, value)=>{
+                            const formatter = createFormatterByDimension(dimension, advancedVSeed.locale);
+                            return formatter(value);
+                        }
                     });
                     res.dataset.forEach((d)=>{
                         newDatasets.push(d);
@@ -15794,7 +16155,11 @@ self.R = R;
                     const res = unfoldDimensions(dataset, uniqDims, encoding, {
                         foldMeasureId: FoldMeasureId,
                         separator: "-",
-                        colorItemAsId: false
+                        colorItemAsId: false,
+                        formatDimensionValue: (dimension, value)=>{
+                            const formatter = createFormatterByDimension(dimension, advancedVSeed.locale);
+                            return formatter(value);
+                        }
                     });
                     res.dataset.forEach((datum)=>{
                         datum[UpperWhisker] = datum[encoding.max[0]];
@@ -15881,7 +16246,11 @@ self.R = R;
                         const res = unfoldDimensions(boxPlotDataList, uniqDims, encoding, {
                             foldMeasureId: FoldMeasureId,
                             separator: "-",
-                            colorItemAsId: false
+                            colorItemAsId: false,
+                            formatDimensionValue: (dimension, value)=>{
+                                const formatter = createFormatterByDimension(dimension, advancedVSeed.locale);
+                                return formatter(value);
+                            }
                         });
                         res.dataset.forEach((d)=>{
                             newDatasets.push(d);
@@ -15891,7 +16260,11 @@ self.R = R;
                         const res = unfoldDimensions(dataset, uniqDims, encoding, {
                             foldMeasureId: FoldMeasureId,
                             separator: "-",
-                            colorItemAsId: false
+                            colorItemAsId: false,
+                            formatDimensionValue: (dimension, value)=>{
+                                const formatter = createFormatterByDimension(dimension, advancedVSeed.locale);
+                                return formatter(value);
+                            }
                         });
                         res.dataset.forEach((datum)=>{
                             datum[UpperWhisker] = datum[encoding.max[0]];
@@ -16045,7 +16418,7 @@ self.R = R;
                         measureId: FoldMeasureId,
                         measureValue: MedianMeasureId
                     }
-                ]);
+                ], advancedVSeed?.locale);
                 return result;
             };
             const boxPlotMeasureKeys = [
@@ -16061,7 +16434,7 @@ self.R = R;
                     ...spec
                 };
                 const { advancedVSeed, vseed } = context;
-                const { chartType, dimensions = [], encoding, datasetReshapeInfo } = advancedVSeed;
+                const { chartType, dimensions = [], encoding, datasetReshapeInfo, locale } = advancedVSeed;
                 const baseConfig = advancedVSeed.config[chartType];
                 const { tooltip = {
                     enable: true
@@ -16086,7 +16459,7 @@ self.R = R;
                         title: {
                             visible: false
                         },
-                        content: tooltipBoxplot_createMarkContent(encoding.tooltip || [], dimensions, encoding),
+                        content: tooltipBoxplot_createMarkContent(encoding.tooltip || [], dimensions, encoding, locale),
                         updateContent: (prev, data)=>{
                             const datum = data?.[0]?.datum?.[0];
                             if (!chunk_JK3VNB42_n(datum?.[VCHART_OUTLIER_KEY])) {
@@ -16118,13 +16491,13 @@ self.R = R;
                         title: {
                             visible: true
                         },
-                        content: tooltipBoxplot_createDimensionContent(dimensions, meas, unfoldInfo, measureAliasMapping[MedianMeasureId])
+                        content: tooltipBoxplot_createDimensionContent(dimensions, meas, unfoldInfo, measureAliasMapping[MedianMeasureId], locale)
                     },
                     updateElement: updateTooltipElement
                 };
                 return result;
             };
-            const tooltipBoxplot_createMarkContent = (tooltip, dimensions, encoding)=>{
+            const tooltipBoxplot_createMarkContent = (tooltip, dimensions, encoding, locale)=>{
                 const dims = C(dimensions.filter((item)=>tooltip.includes(item.id)), T((item)=>item.id), T((item)=>item.alias));
                 const dimContent = dims.map((item)=>({
                         visible: true,
@@ -16136,7 +16509,8 @@ self.R = R;
                                 if (encoding.color?.includes(item.id)) return datum?.[ColorEncoding];
                                 if (encoding.x?.includes(item.id)) return datum?.[XEncoding];
                             }
-                            return datum?.[item.id];
+                            const formatter = createFormatterByDimension(item, locale);
+                            return formatter(datum?.[item.id]);
                         }
                     }));
                 const defaultContent = boxPlotMeasureKeys.map((key)=>({
@@ -16154,7 +16528,7 @@ self.R = R;
                     defaultContent
                 ];
             };
-            const tooltipBoxplot_createDimensionContent = (dimensions, measures, unfoldInfo, medianAlias, hasMultiMeasureGroup)=>{
+            const tooltipBoxplot_createDimensionContent = (dimensions, measures, unfoldInfo, medianAlias, locale, hasMultiMeasureGroup)=>{
                 const { encodingColor } = unfoldInfo;
                 return [
                     {
@@ -16406,7 +16780,7 @@ self.R = R;
                         const length = objValue.length;
                         for(; ++index < length;)newValue[index] = objValue[index];
                     }
-                } else isPlainObject(srcValue) ? (newValue = null != objValue ? objValue : {}, "function" != typeof objValue && "object" == typeof objValue || (newValue = {})) : isCommon = !1;
+                } else common_isPlainObject(srcValue) ? (newValue = null != objValue ? objValue : {}, "function" != typeof objValue && "object" == typeof objValue || (newValue = {})) : isCommon = !1;
                 isCommon && baseMerge(newValue, srcValue, shallowArray, skipTargetArray), assignMergeValue(target, key, newValue);
             }
             function assignMergeValue(target, key, value) {
@@ -16768,7 +17142,11 @@ self.R = R;
                     const res = unfoldDimensions(binData, uniqDims, encoding, {
                         foldMeasureId: FoldMeasureId,
                         separator: "-",
-                        colorItemAsId: false
+                        colorItemAsId: false,
+                        formatDimensionValue: (dimension, value)=>{
+                            const formatter = createFormatterByDimension(dimension, advancedVSeed.locale);
+                            return formatter(value);
+                        }
                     });
                     res.dataset.forEach((d)=>{
                         newDatasets.push(d);
@@ -16778,7 +17156,8 @@ self.R = R;
                     const res = dataReshapeByEncoding(dataset, T(dimensions, (item)=>item.id), measures.filter((item)=>encoding.y?.includes(item.id)).slice(0, 1), encoding, {
                         colorItemAsId: false,
                         colorMeasureId,
-                        omitIds: []
+                        omitIds: [],
+                        locale: advancedVSeed.locale
                     });
                     res.dataset.forEach((datum)=>{
                         datum[BinStartMeasureId] = datum[encoding.x0[0]];
@@ -16872,7 +17251,11 @@ self.R = R;
                         const res = unfoldDimensions(binData, uniqDims, encoding, {
                             foldMeasureId: FoldMeasureId,
                             separator: "-",
-                            colorItemAsId: false
+                            colorItemAsId: false,
+                            formatDimensionValue: (dimension, value)=>{
+                                const formatter = createFormatterByDimension(dimension, advancedVSeed.locale);
+                                return formatter(value);
+                            }
                         });
                         res.dataset.forEach((d)=>{
                             newDatasets.push(d);
@@ -16882,7 +17265,8 @@ self.R = R;
                         const res = dataReshapeByEncoding(dataset, T(dimensions, (item)=>item.id), subMeasures.filter((item)=>encoding.y?.includes(item.id)).slice(0, 1), encoding, {
                             colorItemAsId: false,
                             colorMeasureId,
-                            omitIds: []
+                            omitIds: [],
+                            locale: advancedVSeed.locale
                         });
                         res.dataset.forEach((datum)=>{
                             datum[BinStartMeasureId] = datum[encoding.x0[0]];
@@ -17875,7 +18259,9 @@ self.R = R;
                     const resultText = [];
                     const dimLabels = labelDims.map((item)=>{
                         const id = item.id;
-                        return realDatum[id] ?? realDatum.__OriginalData__?.[id];
+                        const rawValue = realDatum[id] ?? realDatum.__OriginalData__?.[id];
+                        const formatter = createFormatterByDimension(item, advancedVSeed.locale);
+                        return formatter(rawValue);
                     }).filter((v)=>null != v && '' !== v);
                     resultText.push(...dimLabels);
                     const meaLabels = labelMeas.map((item)=>generateMeasureValue(realDatum[item.id] ?? realDatum.__OriginalData__?.[item.id], item, autoFormat, numFormat));
@@ -17903,13 +18289,22 @@ self.R = R;
                     ...spec
                 };
                 const { advancedVSeed } = context;
-                const { chartType } = advancedVSeed;
+                const { chartType, dimensions = [], encoding } = advancedVSeed;
                 const baseConfig = advancedVSeed.config[chartType];
                 const { label } = baseConfig;
                 if (!label.enable) return result;
                 result.nonLeaf = {
                     visible: true
                 };
+                const dimIds = encoding.hierarchy || [];
+                const dimFormatters = dimIds.map((id)=>{
+                    const dim = dimensions.find((item)=>item.id === id);
+                    return createFormatterByDimension(dim, advancedVSeed.locale);
+                });
+                const formatHierarchyName = (name, depth)=>{
+                    if (!dimFormatters?.[depth]) return name;
+                    return dimFormatters[depth](name);
+                };
                 result.nonLeafLabel = {
                     visible: true,
                     position: 'top',
@@ -17917,9 +18312,7 @@ self.R = R;
                     style: {
                         x: (data)=>(data.labelRect?.x0 || 0) + 4,
                         textAlign: 'left',
-                        text: (data)=>[
-                                data.name
-                            ],
+                        text: (data)=>formatHierarchyName(String(data.name ?? ''), data.depth),
                         fontSize: 12,
                         fill: '#000'
                     }
@@ -17993,23 +18386,30 @@ self.R = R;
                 return result;
             }
             const tooltipTreeMap = (spec, context)=>{
-                const result = tooltip_tooltip(spec, context);
+                const result = tooltip_tooltip()(spec, context);
                 const { advancedVSeed, vseed } = context;
                 const { datasetReshapeInfo, dimensions = [], encoding } = advancedVSeed;
                 const { foldInfo, unfoldInfo } = datasetReshapeInfo[0];
                 if (result.tooltip) {
                     if (!result.tooltip.mark) result.tooltip.mark = {};
+                    const formatterList = (encoding.hierarchy || []).map((id)=>{
+                        const dim = dimensions.find((item)=>item.id === id);
+                        return createFormatterByDimension(dim, advancedVSeed.locale);
+                    });
                     result.tooltip.mark = {
                         title: {
                             visible: true,
-                            value: (val)=>val?.datum?.map((data)=>data.name).join(' / ')
+                            value: (val)=>val?.datum?.map((data, index)=>{
+                                    if (formatterList[index]) return formatterList[index](data.name);
+                                    return data.name;
+                                }).join(' / ')
                         },
-                        content: tooltipTreeMap_createMarkContent(encoding.tooltip || [], dimensions, vseed.measures, foldInfo, unfoldInfo)
+                        content: tooltipTreeMap_createMarkContent(encoding.tooltip || [], dimensions, vseed.measures, foldInfo, unfoldInfo, advancedVSeed.locale)
                     };
                 }
                 return result;
             };
-            const tooltipTreeMap_createMarkContent = (tooltip, dimensions = [], measures = [], foldInfo, unfoldInfo)=>{
+            const tooltipTreeMap_createMarkContent = (tooltip, dimensions = [], measures = [], foldInfo, unfoldInfo, locale)=>{
                 const dims = C(dimensions.filter((item)=>tooltip.includes(item.id)), T((item)=>item.id), T((item)=>item.alias), 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)=>({
@@ -18029,7 +18429,8 @@ self.R = R;
                         value: (v)=>{
                             const { depth } = v;
                             const datum = v?.datum[depth];
-                            return datum && datum[item.id];
+                            const formatter = createFormatterByDimension(item, locale);
+                            return datum ? formatter(datum[item.id]) : '';
                         }
                     }));
                 const defaultContent = {
@@ -18209,7 +18610,7 @@ self.R = R;
                 return result;
             };
             const tooltipHierarchy = (spec, context)=>{
-                const result = tooltip_tooltip(spec, context);
+                const result = tooltip_tooltip()(spec, context);
                 const { advancedVSeed, vseed } = context;
                 const { datasetReshapeInfo, dimensions = [], encoding } = advancedVSeed;
                 const { foldInfo, unfoldInfo } = datasetReshapeInfo[0];
@@ -18220,12 +18621,12 @@ self.R = R;
                             visible: true,
                             value: (val)=>val?.datum?.map((data)=>data.name).join(' / ')
                         },
-                        content: tooltipHierarchy_createMarkContent(encoding.tooltip || [], dimensions, vseed.measures, foldInfo, unfoldInfo)
+                        content: tooltipHierarchy_createMarkContent(encoding.tooltip || [], dimensions, vseed.measures, foldInfo, unfoldInfo, advancedVSeed.locale)
                     };
                 }
                 return result;
             };
-            const tooltipHierarchy_createMarkContent = (tooltip, dimensions = [], measures = [], foldInfo, unfoldInfo)=>{
+            const tooltipHierarchy_createMarkContent = (tooltip, dimensions = [], measures = [], foldInfo, unfoldInfo, locale)=>{
                 const dims = C(dimensions.filter((item)=>tooltip.includes(item.id)), T((item)=>item.id), T((item)=>item.alias), 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)=>({
@@ -18239,7 +18640,8 @@ self.R = R;
                         },
                         value: (v)=>{
                             const datum = v;
-                            return datum && datum[item.id];
+                            const formatter = createFormatterByDimension(item, locale);
+                            return datum ? formatter(datum[item.id]) : '';
                         }
                     }));
                 const defaultContent = {
@@ -18288,14 +18690,29 @@ self.R = R;
             };
             const labelSunburst = (spec, context)=>{
                 const { advancedVSeed } = context;
-                const { chartType, encoding } = advancedVSeed;
+                const { chartType, encoding, dimensions = [] } = advancedVSeed;
                 const baseConfig = advancedVSeed.config[chartType];
                 const { label } = baseConfig;
                 const result = label_label(spec, context);
                 if (label?.enable) {
                     const labelSpec = result.label;
+                    const formatHierarchyName = (name)=>{
+                        const dimIds = encoding.hierarchy || [];
+                        if (!dimIds.length) return name;
+                        const dimFormatters = dimIds.map((id)=>{
+                            const dim = dimensions.find((item)=>item.id === id);
+                            return createFormatterByDimension(dim, advancedVSeed.locale);
+                        });
+                        const parts = String(name ?? '').split("-");
+                        const formatted = parts.map((part, index)=>{
+                            const formatter = dimFormatters[index] || ((v)=>v);
+                            return formatter(part);
+                        });
+                        return formatted.join("-");
+                    };
                     result.label = {
                         ...labelSpec,
+                        formatMethod: (_, datum)=>formatHierarchyName(String(datum?.name ?? '')),
                         style: {
                             ...labelSpec?.style,
                             fontSize: 12,
@@ -18429,14 +18846,29 @@ self.R = R;
             };
             const labelCirclePacking = (spec, context)=>{
                 const { advancedVSeed } = context;
-                const { chartType } = advancedVSeed;
+                const { chartType, encoding, dimensions = [] } = advancedVSeed;
                 const baseConfig = advancedVSeed.config[chartType];
                 const { label } = baseConfig;
                 const result = label_label(spec, context);
                 if (label?.enable) {
                     const labelSpec = result.label;
+                    const formatHierarchyName = (name)=>{
+                        const dimIds = encoding.hierarchy || [];
+                        if (!dimIds.length) return name;
+                        const dimFormatters = dimIds.map((id)=>{
+                            const dim = dimensions.find((item)=>item.id === id);
+                            return createFormatterByDimension(dim, advancedVSeed.locale);
+                        });
+                        const parts = String(name ?? '').split("-");
+                        const formatted = parts.map((part, index)=>{
+                            const formatter = dimFormatters[index] || ((v)=>v);
+                            return formatter(part);
+                        });
+                        return formatted.join("-");
+                    };
                     result.label = {
                         ...labelSpec,
+                        formatMethod: (_, datum)=>formatHierarchyName(String(datum?.name ?? '')),
                         style: {
                             ...labelSpec?.style,
                             fontSize: 10,
@@ -20547,7 +20979,7 @@ self.R = R;
             const hostname = /^(?=.{1,253}\.?$)[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[-0-9a-zA-Z]{0,61}[0-9a-zA-Z])?)*\.?$/;
             const e164 = /^\+(?:[0-9]){6,14}[0-9]$/;
             const dateSource = "(?:(?:\\d\\d[2468][048]|\\d\\d[13579][26]|\\d\\d0[48]|[02468][048]00|[13579][26]00)-02-29|\\d{4}-(?:(?:0[13578]|1[02])-(?:0[1-9]|[12]\\d|3[01])|(?:0[469]|11)-(?:0[1-9]|[12]\\d|30)|(?:02)-(?:0[1-9]|1\\d|2[0-8])))";
-            const date = /*@__PURE__*/ new RegExp(`^${dateSource}$`);
+            const regexes_date = /*@__PURE__*/ new RegExp(`^${dateSource}$`);
             function timeSource(args) {
                 const hhmm = "(?:[01]\\d|2[0-3]):[0-5]\\d";
                 const regex = "number" == typeof args.precision ? -1 === args.precision ? `${hhmm}` : 0 === args.precision ? `${hhmm}:[0-5]\\d` : `${hhmm}:[0-5]\\d\\.\\d{${args.precision}}` : `${hhmm}(?::[0-5]\\d(?:\\.\\d+)?)?`;
@@ -21665,7 +22097,7 @@ self.R = R;
                 $ZodStringFormat.init(inst, def);
             });
             const $ZodISODate = /*@__PURE__*/ $constructor("$ZodISODate", (inst, def)=>{
-                def.pattern ?? (def.pattern = date);
+                def.pattern ?? (def.pattern = regexes_date);
                 $ZodStringFormat.init(inst, def);
             });
             const $ZodISOTime = /*@__PURE__*/ $constructor("$ZodISOTime", (inst, def)=>{
@@ -23815,10 +24247,23 @@ self.R = R;
                 player: 'player',
                 hierarchy: 'hierarchy'
             };
+            const zTimeFormat = schemas_object({
+                type: schemas_enum([
+                    'year',
+                    'quarter',
+                    'month',
+                    'week',
+                    'day',
+                    'hour',
+                    'minute',
+                    'second'
+                ])
+            }).optional();
             const zDimension = schemas_object({
                 id: schemas_string(),
                 alias: schemas_string().optional(),
-                encoding: zDimensionEncoding.optional()
+                encoding: zDimensionEncoding.optional(),
+                timeFormat: zTimeFormat.optional()
             });
             const zDimensionGroup = schemas_object({
                 id: schemas_string(),