@visactor/vseed 0.0.25 → 0.0.27

package/dist/index.js

@@ -2167,6 +2167,20 @@ const datasetPivot = (spec, context)=>{
         records: records
     };
 };
+const progressive = (spec, context)=>{
+    const result = {
+        ...spec
+    };
+    const { advancedVSeed } = context;
+    const { dataset } = advancedVSeed;
+    const size = dataset.length;
+    if (size < 5000) return result;
+    result.large = true;
+    result.largeThreshold = 5000;
+    result.progressiveStep = 400;
+    result.progressiveThreshold = 8000;
+    return result;
+};
 const initColumn = (spec, context)=>{
     const result = {
         ...spec
@@ -2221,7 +2235,7 @@ const initBarParallel = (spec, context)=>{
     result.direction = 'horizontal';
     result.yField = [
         encoding[0].y[0],
-        unfoldInfo.groupName
+        unfoldInfo.groupId
     ];
     result.xField = encoding[0].x[0];
     result.seriesField = encoding[0].group[0];
@@ -2370,7 +2384,7 @@ const initColumnParallel = (spec, context)=>{
     result.direction = 'vertical';
     result.xField = [
         encoding[0].x[0],
-        unfoldInfo.groupName
+        unfoldInfo.groupId
     ];
     result.yField = encoding[0].y[0];
     result.seriesField = encoding[0].group[0];
@@ -2390,7 +2404,7 @@ const initPie = (spec, context)=>{
     const { advancedVSeed } = context;
     const { encoding, dataset } = advancedVSeed;
     if (!encoding[0].angle || !encoding[0].radius || !encoding[0].group) return result;
-    const showStroke = dataset.length > 20;
+    const showStroke = dataset.length <= 30;
     result.type = 'pie';
     result.outerRadius = 0.8;
     result.innerRadius = 0;
@@ -2426,7 +2440,7 @@ const initDonut = (spec, context)=>{
     const { advancedVSeed } = context;
     const { encoding, dataset } = advancedVSeed;
     if (!encoding[0].angle || !encoding[0].radius || !encoding[0].group) return result;
-    const showStroke = dataset.length > 20;
+    const showStroke = dataset.length <= 30;
     result.type = 'pie';
     result.outerRadius = 0.8;
     result.innerRadius = 0.8 * result.outerRadius;
@@ -2501,7 +2515,7 @@ const initRoseParallel = (spec, context)=>{
     result.type = 'rose';
     result.categoryField = [
         encoding[0].angle[0],
-        unfoldInfo.groupName
+        unfoldInfo.groupId
     ];
     result.valueField = encoding[0].radius[0];
     result.seriesField = encoding[0].group[0];
@@ -3149,7 +3163,7 @@ const tooltip_tooltip = (spec, context)=>{
         ...spec
     };
     const { advancedVSeed } = context;
-    const { measures, datasetReshapeInfo, chartType } = advancedVSeed;
+    const { measures, datasetReshapeInfo, chartType, locale } = advancedVSeed;
     const baseConfig = advancedVSeed.config[chartType];
     const { tooltip = {
         enable: true
@@ -3178,7 +3192,7 @@ const tooltip_tooltip = (spec, context)=>{
                             const formatter = createFormatter(format);
                             return formatter(value);
                         }
-                        if (autoFormat) return autoFormatter(value);
+                        if (autoFormat) return autoFormatter(value, locale);
                         return String(value);
                     }
                 }
@@ -3200,7 +3214,7 @@ const tooltip_tooltip = (spec, context)=>{
                             const formatter = createFormatter(format);
                             return formatter(value);
                         }
-                        if (autoFormat) return autoFormatter(value);
+                        if (autoFormat) return autoFormatter(value, locale);
                         return String(value);
                     }
                 }
@@ -3891,14 +3905,15 @@ const isDimensionSelector = (selector)=>'object' == typeof selector && null !==
     ].includes(selector.op));
 const barStyle_barStyle = (spec, context)=>{
     const { advancedVSeed } = context;
-    const { markStyle } = advancedVSeed;
+    const { markStyle, dataset } = advancedVSeed;
     const { barStyle } = markStyle;
+    const showStroke = dataset.length <= 100;
     const result = {
         ...spec,
         bar: {
             style: {
                 stroke: '#fff',
-                lineWidth: 1
+                lineWidth: showStroke ? 1 : 0
             },
             state: {
                 hover: {
@@ -3934,10 +3949,13 @@ const barStyle_barStyle = (spec, context)=>{
                 style: {
                     fill: barColor,
                     fillOpacity: barColorOpacity,
-                    stroke: barBorderColor,
-                    lineWidth: barBorderWidth,
-                    lineDash: lineDash,
-                    cornerRadius: barRadius
+                    cornerRadius: barRadius,
+                    innerBorder: {
+                        stroke: barBorderColor,
+                        lineWidth: barBorderWidth,
+                        distance: (barBorderWidth || 0) / 2,
+                        lineDash: lineDash
+                    }
                 }
             }
         };
@@ -3986,9 +4004,12 @@ const pointStyle_pointStyle = (spec, context)=>{
                     size: pointSize,
                     fill: pointColor,
                     fillOpacity: pointColorOpacity,
-                    stroke: pointBorderColor,
-                    lineWidth: pointBorderWidth,
-                    lineDash: lineDash
+                    innerBorder: {
+                        stroke: pointBorderColor,
+                        lineWidth: pointBorderWidth,
+                        distance: (pointBorderWidth || 0) / 2,
+                        lineDash: lineDash
+                    }
                 }
             }
         };
@@ -4806,6 +4827,7 @@ const line_line = [
     color_color,
     background_backgroundColor,
     datasetXY,
+    progressive,
     xBand,
     yLinear,
     label_label,
@@ -4830,6 +4852,7 @@ const pivotLine = [
         color_color,
         background_backgroundColor,
         datasetXY,
+        progressive,
         xBand,
         yLinear,
         label_label,
@@ -4857,6 +4880,7 @@ const column = [
     color_color,
     background_backgroundColor,
     datasetXY,
+    progressive,
     xBand,
     yLinear,
     label_label,
@@ -4881,6 +4905,7 @@ const pivotColumn = [
         color_color,
         background_backgroundColor,
         datasetXY,
+        progressive,
         xBand,
         yLinear,
         label_label,
@@ -4905,6 +4930,7 @@ const columnParallel = [
     color_color,
     background_backgroundColor,
     datasetXY,
+    progressive,
     xBand,
     yLinear,
     label_label,
@@ -4928,6 +4954,7 @@ const pivotColumnParallel = [
         color_color,
         background_backgroundColor,
         datasetXY,
+        progressive,
         xBand,
         yLinear,
         label_label,
@@ -4954,6 +4981,7 @@ const columnPercent = [
     background_backgroundColor,
     percent,
     datasetXY,
+    progressive,
     xBand,
     yLinear,
     label_label,
@@ -4979,6 +5007,7 @@ const pivotColumnPercent = [
         percent,
         background_backgroundColor,
         datasetXY,
+        progressive,
         xBand,
         yLinear,
         label_label,
@@ -5003,6 +5032,7 @@ const bar = [
     color_color,
     background_backgroundColor,
     datasetYX,
+    progressive,
     xLinear,
     yBand,
     label_label,
@@ -5026,6 +5056,7 @@ const pivotBar = [
         color_color,
         background_backgroundColor,
         datasetYX,
+        progressive,
         xLinear,
         yBand,
         label_label,
@@ -5051,6 +5082,7 @@ const barParallel = [
     color_color,
     background_backgroundColor,
     datasetYX,
+    progressive,
     xLinear,
     yBand,
     label_label,
@@ -5099,6 +5131,7 @@ const barPercent = [
     background_backgroundColor,
     percent,
     datasetYX,
+    progressive,
     xLinear,
     yBand,
     label_label,
@@ -5147,6 +5180,7 @@ const area_area = [
     color_color,
     background_backgroundColor,
     datasetXY,
+    progressive,
     xBand,
     yLinear,
     label_label,
@@ -5173,6 +5207,7 @@ const pivotArea = [
         background_backgroundColor,
         stackInverse,
         datasetXY,
+        progressive,
         xBand,
         yLinear,
         label_label,
@@ -5201,6 +5236,7 @@ const areaPercent = [
     background_backgroundColor,
     percent,
     datasetXY,
+    progressive,
     xBand,
     yLinear,
     label_label,
@@ -5227,6 +5263,7 @@ const pivotAreaPercent = [
         background_backgroundColor,
         percent,
         datasetXY,
+        progressive,
         xBand,
         yLinear,
         label_label,
@@ -5263,6 +5300,7 @@ const areaRange = [
         pointStateDimensionHover
     ]),
     datasetXY,
+    progressive,
     background_backgroundColor,
     xBand,
     yLinear,
@@ -5295,6 +5333,7 @@ const pivotAreaRange = [
         ]),
         background_backgroundColor,
         datasetXY,
+        progressive,
         xBand,
         yLinear,
         label_label,
@@ -5315,6 +5354,7 @@ const scatter = [
     color_color,
     background_backgroundColor,
     datasetXY,
+    progressive,
     xLinear,
     yLinear,
     label_label,
@@ -5339,6 +5379,7 @@ const pivotScatter = [
         color_color,
         background_backgroundColor,
         datasetXY,
+        progressive,
         xLinear,
         yLinear,
         label_label,
@@ -5364,6 +5405,7 @@ const pie = [
     color_color,
     background_backgroundColor,
     datasetXY,
+    progressive,
     label_label,
     tooltip_tooltip,
     discreteLegend,
@@ -5382,6 +5424,7 @@ const pivotPie = [
         color_color,
         background_backgroundColor,
         datasetXY,
+        progressive,
         label_label,
         tooltip_tooltip,
         annotationPoint_annotationPoint,
@@ -5401,6 +5444,7 @@ const donut = [
     color_color,
     background_backgroundColor,
     datasetXY,
+    progressive,
     label_label,
     tooltip_tooltip,
     discreteLegend,
@@ -5419,6 +5463,7 @@ const pivotDonut = [
         color_color,
         background_backgroundColor,
         datasetXY,
+        progressive,
         label_label,
         tooltip_tooltip,
         annotationPoint_annotationPoint,
@@ -5440,6 +5485,7 @@ const rose = [
     color_color,
     background_backgroundColor,
     datasetXY,
+    progressive,
     radiusAxis,
     angleAxis,
     label_label,
@@ -5459,6 +5505,7 @@ const pivotRose = [
         color_color,
         background_backgroundColor,
         datasetXY,
+        progressive,
         radiusAxis,
         angleAxis,
         label_label,
@@ -5478,6 +5525,7 @@ const roseParallel = [
     color_color,
     background_backgroundColor,
     datasetXY,
+    progressive,
     radiusAxis,
     angleAxis,
     label_label,
@@ -5500,6 +5548,7 @@ const pivotRoseParallel = [
         color_color,
         background_backgroundColor,
         datasetXY,
+        progressive,
         radiusAxis,
         angleAxis,
         label_label,
@@ -5522,6 +5571,7 @@ const radar = [
     color_color,
     background_backgroundColor,
     datasetXY,
+    progressive,
     radarAngleAxis,
     radarRadiusAxis,
     label_label,
@@ -5543,6 +5593,7 @@ const pivotRadar = [
         color_color,
         background_backgroundColor,
         datasetXY,
+        progressive,
         radarAngleAxis,
         radarRadiusAxis,
         label_label,
@@ -6109,6 +6160,7 @@ const pivotTableSpecPipeline = [
     selectionStyle
 ];
 const buildAdvanced = (builder)=>{
+    const start = 'undefined' != typeof performance ? performance.now() : Date.now();
     const { chartType } = builder.vseed;
     if (!chartType) throw new Error('chartType is nil in buildAdvanced');
     const pipeline = builder.getAdvancedPipeline(chartType);
@@ -6122,9 +6174,13 @@ const buildAdvanced = (builder)=>{
     } catch (e) {
         console.error(e);
         throw new Error("buildAdvanced error, see error info in console");
+    } finally{
+        const end = 'undefined' != typeof performance ? performance.now() : Date.now();
+        builder.performance['buildAdvanced'] = `${(end - start).toFixed(4)}ms`;
     }
 };
 const buildSpec = (builder, advancedVSeed)=>{
+    const start = 'undefined' != typeof performance ? performance.now() : Date.now();
     const { chartType } = builder.vseed;
     if (!chartType) throw new Error('chartType is nil in buildSpec');
     const pipeline = builder.getSpecPipeline(chartType);
@@ -6138,6 +6194,9 @@ const buildSpec = (builder, advancedVSeed)=>{
     } catch (e) {
         console.error(e);
         throw new Error("buildSpec error, see error info in console");
+    } finally{
+        const end = 'undefined' != typeof performance ? performance.now() : Date.now();
+        builder.performance['buildSpec'] = `${(end - start).toFixed(4)}ms`;
     }
 };
 const build = (builder)=>{
@@ -6173,6 +6232,7 @@ class Builder {
     _vseed;
     _advancedVSeed = null;
     _spec = null;
+    _performance = {};
     constructor(vseed){
         this._vseed = vseed;
         this._vseed.locale = vseed.locale || intl.getLocale();
@@ -6214,6 +6274,12 @@ class Builder {
     set spec(value) {
         this._spec = value;
     }
+    get performance() {
+        return this._performance;
+    }
+    set performance(value) {
+        this._performance = value;
+    }
     static _advancedPipelineMap = {};
     static _specPipelineMap = {};
     static _customAdvancedPipe = {};
@@ -7813,8 +7879,8 @@ const zLine = z.object({
     sortAxis: zSortAxis.optional(),
     sortLegend: zSortLegend.optional(),
     theme: zTheme.optional(),
-    pointStyle: zPointStyle.optional(),
-    lineStyle: zLineStyle.optional(),
+    pointStyle: z.array(zPointStyle).or(zPointStyle).optional(),
+    lineStyle: z.array(zLineStyle).or(zLineStyle).optional(),
     annotationPoint: z.array(zAnnotationPoint).or(zAnnotationPoint).optional(),
     annotationVerticalLine: z.array(zAnnotationVerticalLine).or(zAnnotationVerticalLine).optional(),
     annotationHorizontalLine: z.array(zAnnotationHorizontalLine).or(zAnnotationHorizontalLine).optional(),
@@ -7836,7 +7902,7 @@ const zColumn = z.object({
     crosshairRect: zCrosshairRect.optional(),
     stackCornerRadius: zStackCornerRadius.optional(),
     theme: zTheme.optional(),
-    barStyle: zBarStyle.optional(),
+    barStyle: z.array(zBarStyle).or(zBarStyle).optional(),
     annotationPoint: z.array(zAnnotationPoint).or(zAnnotationPoint).optional(),
     annotationVerticalLine: z.array(zAnnotationVerticalLine).or(zAnnotationVerticalLine).optional(),
     annotationHorizontalLine: z.array(zAnnotationHorizontalLine).or(zAnnotationHorizontalLine).optional(),
@@ -7858,7 +7924,7 @@ const zColumnParallel = z.object({
     crosshairRect: zCrosshairRect.optional(),
     stackCornerRadius: zStackCornerRadius.optional(),
     theme: zTheme.optional(),
-    barStyle: zBarStyle.optional(),
+    barStyle: z.array(zBarStyle).or(zBarStyle).optional(),
     annotationPoint: z.array(zAnnotationPoint).or(zAnnotationPoint).optional(),
     annotationVerticalLine: z.array(zAnnotationVerticalLine).or(zAnnotationVerticalLine).optional(),
     annotationHorizontalLine: z.array(zAnnotationHorizontalLine).or(zAnnotationHorizontalLine).optional(),
@@ -7880,7 +7946,7 @@ const zColumnPercent = z.object({
     crosshairRect: zCrosshairRect.optional(),
     stackCornerRadius: zStackCornerRadius.optional(),
     theme: zTheme.optional(),
-    barStyle: zBarStyle.optional(),
+    barStyle: z.array(zBarStyle).or(zBarStyle).optional(),
     annotationPoint: z.array(zAnnotationPoint).or(zAnnotationPoint).optional(),
     annotationVerticalLine: z.array(zAnnotationVerticalLine).or(zAnnotationVerticalLine).optional(),
     annotationHorizontalLine: z.array(zAnnotationHorizontalLine).or(zAnnotationHorizontalLine).optional(),
@@ -7902,7 +7968,7 @@ const zBar = z.object({
     crosshairRect: zCrosshairRect.optional(),
     stackCornerRadius: zStackCornerRadius.optional(),
     theme: zTheme.optional(),
-    barStyle: zBarStyle.optional(),
+    barStyle: z.array(zBarStyle).or(zBarStyle).optional(),
     annotationPoint: z.array(zAnnotationPoint).or(zAnnotationPoint).optional(),
     annotationVerticalLine: z.array(zAnnotationVerticalLine).or(zAnnotationVerticalLine).optional(),
     annotationHorizontalLine: z.array(zAnnotationHorizontalLine).or(zAnnotationHorizontalLine).optional(),
@@ -7924,7 +7990,7 @@ const zBarParallel = z.object({
     crosshairRect: zCrosshairRect.optional(),
     stackCornerRadius: zStackCornerRadius.optional(),
     theme: zTheme.optional(),
-    barStyle: zBarStyle.optional(),
+    barStyle: z.array(zBarStyle).or(zBarStyle).optional(),
     annotationPoint: z.array(zAnnotationPoint).or(zAnnotationPoint).optional(),
     annotationVerticalLine: z.array(zAnnotationVerticalLine).or(zAnnotationVerticalLine).optional(),
     annotationHorizontalLine: z.array(zAnnotationHorizontalLine).or(zAnnotationHorizontalLine).optional(),
@@ -7946,7 +8012,7 @@ const zBarPercent = z.object({
     crosshairRect: zCrosshairRect.optional(),
     stackCornerRadius: zStackCornerRadius.optional(),
     theme: zTheme.optional(),
-    barStyle: zBarStyle.optional(),
+    barStyle: z.array(zBarStyle).or(zBarStyle).optional(),
     annotationPoint: z.array(zAnnotationPoint).or(zAnnotationPoint).optional(),
     annotationVerticalLine: z.array(zAnnotationVerticalLine).or(zAnnotationVerticalLine).optional(),
     annotationHorizontalLine: z.array(zAnnotationHorizontalLine).or(zAnnotationHorizontalLine).optional(),
@@ -7967,9 +8033,9 @@ const zArea = z.object({
     yAxis: zYLinearAxis.optional(),
     crosshairLine: zCrosshairLine.optional(),
     theme: zTheme.optional(),
-    pointStyle: zPointStyle.optional(),
-    lineStyle: zLineStyle.optional(),
-    areaStyle: zAreaStyle.optional(),
+    pointStyle: z.array(zPointStyle).or(zPointStyle).optional(),
+    lineStyle: z.array(zLineStyle).or(zLineStyle).optional(),
+    areaStyle: z.array(zAreaStyle).or(zAreaStyle).optional(),
     annotationPoint: z.array(zAnnotationPoint).or(zAnnotationPoint).optional(),
     annotationVerticalLine: z.array(zAnnotationVerticalLine).or(zAnnotationVerticalLine).optional(),
     annotationHorizontalLine: z.array(zAnnotationHorizontalLine).or(zAnnotationHorizontalLine).optional(),
@@ -7990,9 +8056,9 @@ const zAreaPercent = z.object({
     yAxis: zYLinearAxis.optional(),
     crosshairLine: zCrosshairLine.optional(),
     theme: zTheme.optional(),
-    pointStyle: zPointStyle.optional(),
-    lineStyle: zLineStyle.optional(),
-    areaStyle: zAreaStyle.optional(),
+    pointStyle: z.array(zPointStyle).or(zPointStyle).optional(),
+    lineStyle: z.array(zLineStyle).or(zLineStyle).optional(),
+    areaStyle: z.array(zAreaStyle).or(zAreaStyle).optional(),
     annotationPoint: z.array(zAnnotationPoint).or(zAnnotationPoint).optional(),
     annotationVerticalLine: z.array(zAnnotationVerticalLine).or(zAnnotationVerticalLine).optional(),
     annotationHorizontalLine: z.array(zAnnotationHorizontalLine).or(zAnnotationHorizontalLine).optional(),
@@ -8010,9 +8076,9 @@ const zAreaRange = z.object({
     yAxis: zYLinearAxis.optional(),
     crosshairLine: zCrosshairLine.optional(),
     theme: zTheme.optional(),
-    pointStyle: zPointStyle.optional(),
-    lineStyle: zLineStyle.optional(),
-    areaStyle: zAreaStyle.optional(),
+    pointStyle: z.array(zPointStyle).or(zPointStyle).optional(),
+    lineStyle: z.array(zLineStyle).or(zLineStyle).optional(),
+    areaStyle: z.array(zAreaStyle).or(zAreaStyle).optional(),
     annotationPoint: z.array(zAnnotationPoint).or(zAnnotationPoint).optional(),
     annotationVerticalLine: z.array(zAnnotationVerticalLine).or(zAnnotationVerticalLine).optional(),
     annotationHorizontalLine: z.array(zAnnotationHorizontalLine).or(zAnnotationHorizontalLine).optional(),
@@ -8033,7 +8099,7 @@ const zScatter = z.object({
     yAxis: zYLinearAxis.optional(),
     crosshairLine: zCrosshairLine.optional(),
     theme: zTheme.optional(),
-    pointStyle: zPointStyle.optional(),
+    pointStyle: z.array(zPointStyle).or(zPointStyle).optional(),
     annotationPoint: z.array(zAnnotationPoint).or(zAnnotationPoint).optional(),
     annotationVerticalLine: z.array(zAnnotationVerticalLine).or(zAnnotationVerticalLine).optional(),
     annotationHorizontalLine: z.array(zAnnotationHorizontalLine).or(zAnnotationHorizontalLine).optional(),