@visactor/vrender-components 0.19.20-alpha.2 → 0.19.21-alpha.0

package/dist/index.es.js

@@ -17104,11 +17104,18 @@ class LabelBase extends AbstractComponent {
         return;
     }
     _createLabelLine(text, baseMark) {
+        var _a;
         const points = connectLineBetweenBounds(text.AABBBounds, baseMark === null || baseMark === void 0 ? void 0 : baseMark.AABBBounds);
         if (points) {
             const line = graphicCreator.line({
                 points
             });
+            if ((_a = line.style) === null || _a === void 0 ? void 0 : _a.customShape) {
+                const customShape = line.style.customShape;
+                line.pathProxy = (attrs) => {
+                    return customShape(attrs, new CustomPath2D());
+                };
+            }
             if (baseMark && baseMark.attribute.fill) {
                 line.setAttribute('stroke', baseMark.attribute.fill);
             }
@@ -18506,7 +18513,7 @@ class ArcLabel extends LabelBase {
         }
     }
     _createLabelLine(text, baseMark) {
-        var _a, _b, _c, _d, _e, _f, _g;
+        var _a, _b, _c, _d, _e, _f, _g, _h;
         const { points, line = {}, visible, fill } = text.attribute;
         const labelLine = text.attribute.points
             ? graphicCreator.line({
@@ -18518,6 +18525,12 @@ class ArcLabel extends LabelBase {
             })
             : undefined;
         if (labelLine) {
+            if ((_h = line.style) === null || _h === void 0 ? void 0 : _h.customShape) {
+                const customShape = line.style.customShape;
+                labelLine.pathProxy = (attrs) => {
+                    return customShape(attrs, new CustomPath2D());
+                };
+            }
             this._setStatesOfLabelLine(labelLine);
         }
         return labelLine;
@@ -29007,219 +29020,6 @@ class Tooltip extends AbstractComponent {
 }
 Tooltip.defaultAttributes = defaultAttributes;
 
-function loadTimelineComponent() {
-    registerGroup();
-    registerText();
-    registerSymbol();
-    registerLine();
-}
-
-loadTimelineComponent();
-class Timeline extends AbstractComponent {
-    constructor(attributes, options) {
-        super((options === null || options === void 0 ? void 0 : options.skipDefault) ? attributes : merge({}, Timeline.defaultAttributes, attributes));
-        this.name = 'timeline';
-    }
-    render() {
-        const { width, lineStyle, activeLineStyle, symbolStyle, activeSymbolStyle, labelStyle, activeLabelStyle, times, pointLayoutMode, labelSpace, clipRange, animation } = this.attribute;
-        if (!(times && times.length)) {
-            return;
-        }
-        const symbolHeight = (isArray(symbolStyle.size) ? symbolStyle.size[1] : symbolStyle.size) || 0;
-        const activeSymbolHeight = (isArray(activeSymbolStyle.size) ? activeSymbolStyle.size[1] : activeSymbolStyle.size) || 0;
-        const lineSymbolHeight = Math.max(lineStyle.lineWidth || 0, activeLineStyle.lineWidth || 0, symbolHeight, activeSymbolHeight);
-        const lineY = lineSymbolHeight / 2;
-        const lineAttr = {
-            y: lineY,
-            points: [
-                { x: 0, y: 0 },
-                { x: width, y: 0 }
-            ]
-        };
-        this._line = this.createOrUpdateChild('line-axes', Object.assign(Object.assign({}, lineStyle), lineAttr), 'line');
-        this._activeLine = this.createOrUpdateChild('active-line-axes', Object.assign(Object.assign(Object.assign({}, activeLineStyle), lineAttr), { clipRange }), 'line');
-        const activeWidth = width * clipRange;
-        const symbolGroup = this.createOrUpdateChild('symbol-group', {
-            y: lineY
-        }, 'group');
-        const symbolSpace = times.length === 1
-            ? width
-            : pointLayoutMode === 'space-between'
-                ? width / (times.length - 1)
-                : width / times.length;
-        const symbolStartX = pointLayoutMode === 'space-between' ? 0 : symbolSpace / 2;
-        this._timesPercent = times.map((_, i) => (symbolStartX + symbolSpace * i) / width);
-        times.forEach((item, i) => {
-            const x = this._timesPercent[i] * width;
-            symbolGroup.createOrUpdateChild(item.label, Object.assign(Object.assign({}, symbolStyle), { x }), 'symbol');
-        });
-        this._symbolGroup = symbolGroup;
-        const labelY = lineSymbolHeight + labelSpace;
-        const labelGroup = this.createOrUpdateChild('label-group', {
-            y: labelY
-        }, 'group');
-        times.forEach((item, i) => {
-            const x = this._timesPercent[i] * width;
-            labelGroup.createOrUpdateChild(item.label, Object.assign(Object.assign({}, labelStyle), { x, text: item.label }), 'text');
-        });
-        this._labelGroup = labelGroup;
-        const setActive = (group, activeStyle) => {
-            group.forEachChildren((label) => {
-                if (label.currentStates) {
-                    const currentStates = label.currentStates;
-                    label.clearStates();
-                    label.useStates(currentStates, false);
-                }
-                label.states = {
-                    active: activeStyle
-                };
-                if (label.attribute.x <= activeWidth) {
-                    label.useStates(['active'], animation);
-                }
-            });
-        };
-        setActive(labelGroup, activeLabelStyle);
-        setActive(symbolGroup, activeSymbolStyle);
-    }
-    appearAnimate(animateConfig) {
-        const { duration = 1000, easing = 'quadOut' } = animateConfig;
-        const { activeLabelStyle, activeSymbolStyle } = this.attribute;
-        const percent = duration / 1000;
-        const lineDuration = percent * 500;
-        const activeLineDuration = percent * 200;
-        const perSymbolDuration = percent * 100;
-        const perSymbolNormalDuration = percent * 90;
-        const symbolDelay = percent * 100;
-        const symbolNormalDelay = percent * 600;
-        if (this._line) {
-            this._line.setAttributes({ clipRange: 0 });
-            this._line.animate().to({ clipRange: 1 }, lineDuration, easing);
-        }
-        if (this._activeLine) {
-            this._activeLine.setAttributes({ opacity: 0 });
-            this._activeLine
-                .animate()
-                .wait(500)
-                .to({ opacity: 1 }, activeLineDuration, easing);
-        }
-        if (this._symbolGroup) {
-            const size = this._symbolGroup.count - 1;
-            const delay = percent * (size === 1 ? 0 : (500 - 100) / (size - 1));
-            const delayNormal = percent * (size === 1 ? 0 : (400 - 160) / (size - 1));
-            this._symbolGroup.forEachChildren((symbol, i) => {
-                const originAttrs = Object.assign({}, symbol.attribute);
-                symbol.setAttributes({ opacity: 0 });
-                symbol
-                    .animate()
-                    .wait(symbolDelay + delay * i)
-                    .to({ opacity: 1 }, perSymbolDuration, easing);
-                symbol
-                    .animate()
-                    .wait(symbolNormalDelay + delayNormal * i)
-                    .to(Object.assign({ scaleX: 1.8, scaleY: 1.8 }, activeSymbolStyle), perSymbolNormalDuration, easing)
-                    .to(Object.assign({ scaleX: 1, scaleY: 1 }, originAttrs), perSymbolNormalDuration, easing);
-            });
-        }
-        if (this._labelGroup) {
-            const size = this._labelGroup.count - 1;
-            const delay = percent * (size === 1 ? 0 : (500 - 100) / (size - 1));
-            const delayNormal = percent * (size === 1 ? 0 : (400 - 160) / (size - 1));
-            this._labelGroup.forEachChildren((label, i) => {
-                const originAttrs = Object.assign({}, label.attribute);
-                label.setAttributes({ opacity: 0 });
-                label
-                    .animate()
-                    .wait(symbolDelay + delay * i)
-                    .to({ opacity: 1 }, perSymbolDuration, easing);
-                label
-                    .animate()
-                    .wait(symbolNormalDelay + delayNormal * i)
-                    .to(Object.assign({ dy: 10 }, activeLabelStyle), perSymbolNormalDuration, easing)
-                    .to(Object.assign({ dy: 0 }, originAttrs), perSymbolNormalDuration, easing);
-            });
-        }
-    }
-    goto(flag, animateConfig) {
-        var _a;
-        let { clipRange } = this.attribute;
-        const { animation } = this.attribute;
-        if (flag > 0) {
-            if (clipRange >= 1) {
-                return;
-            }
-            else if (clipRange < 0) {
-                clipRange = 0;
-            }
-        }
-        else {
-            if (clipRange <= 0) {
-                return;
-            }
-            else if (clipRange > 1) {
-                clipRange = 1;
-            }
-        }
-        if (clipRange !== this.attribute.clipRange) {
-            this.setAttributes({ clipRange });
-        }
-        let i = 0;
-        for (; i < this._timesPercent.length; i++) {
-            if (clipRange < this._timesPercent[i]) {
-                break;
-            }
-        }
-        const nextClipRange = flag > 0 ? this._timesPercent[i] : this._timesPercent[i - 1] || 0;
-        if (animation) {
-            const { duration = 1000, easing = 'quadOut' } = animateConfig;
-            const actDuration = (Math.abs(nextClipRange - clipRange) / (this._timesPercent[i] - ((_a = this._timesPercent[i - 1]) !== null && _a !== void 0 ? _a : 0))) * duration;
-            this.animate().to({ clipRange: nextClipRange }, actDuration, easing);
-        }
-        else {
-            this.setAttributes({ clipRange: nextClipRange });
-        }
-    }
-    forward(animateConfig) {
-        this.goto(1, animateConfig);
-    }
-    backward(animateConfig) {
-        this.goto(-1, animateConfig);
-    }
-}
-Timeline.defaultAttributes = {
-    labelSpace: 10,
-    pointLayoutMode: 'space-around',
-    animation: true,
-    symbolStyle: {
-        fill: 'black',
-        size: 12,
-        symbolType: 'circle'
-    },
-    activeSymbolStyle: {
-        fill: 'orange'
-    },
-    lineStyle: {
-        lineDash: [2, 2],
-        lineCap: 'butt',
-        stroke: 'black',
-        lineWidth: 2
-    },
-    activeLineStyle: {
-        stroke: 'orange',
-        lineWidth: 4
-    },
-    labelStyle: {
-        fontSize: 12,
-        fill: 'black',
-        textAlign: 'center',
-        textBaseline: 'top'
-    },
-    activeLabelStyle: {
-        fontSize: 14,
-        fill: 'orange'
-    },
-    clipRange: 0
-};
-
 function VTag(params) {
     return new Tag(params ? params.attribute : {});
 }
@@ -29575,6 +29375,6 @@ EmptyTip.defaultAttributes = {
     }
 };
 
-const version = "0.19.20-alpha.2";
+const version = "0.19.21-alpha.0";
 
-export { AXIS_ELEMENT_NAME, AbstractComponent, ArcInfo, ArcLabel, ArcSegment, AreaLabel, AxisStateValue, BasePlayer, Brush, CheckBox, CircleAxis, CircleAxisGrid, CircleCrosshair, ColorContinuousLegend, ContinuousPlayer, DEFAULT_ITEM_SPACE_COL, DEFAULT_ITEM_SPACE_ROW, DEFAULT_LABEL_SPACE, DEFAULT_PAGER_SPACE, DEFAULT_SHAPE_SIZE, DEFAULT_SHAPE_SPACE, DEFAULT_STATES$1 as DEFAULT_STATES, DEFAULT_TITLE_SPACE, DEFAULT_VALUE_SPACE, DataLabel, DataZoom, DataZoomActiveTag, DirectionEnum, DiscreteLegend, DiscretePlayer, EmptyTip, GroupFadeIn, GroupFadeOut, GroupTransition, IMarkAreaLabelPosition, IMarkCommonArcLabelPosition, IMarkLineLabelPosition, IMarkPointItemPosition, IOperateType, Indicator, LEGEND_ELEMENT_NAME, LabelBase, LegendEvent, LegendStateValue, LineAxis, LineAxisGrid, LineCrosshair, LineDataLabel, LineLabel, LinkPath, MarkArcArea, MarkArcLine, MarkArea, MarkLine, MarkPoint, Pager, PlayerEventEnum, PolygonCrosshair, PopTip, Radio, RectCrosshair, RectLabel, SLIDER_ELEMENT_NAME, ScrollBar, SectorCrosshair, Segment, SizeContinuousLegend, Slider, SymbolLabel, Tag, Timeline, Title, Tooltip, VTag, alignTextInLine, angle, angleLabelOrientAttribute, angleTo, clampRadian, contrastAccessibilityChecker, convertDomainToTickData, createTextGraphicByType, deltaXYToAngle, direction, fuzzyEqualNumber, getCircleLabelPosition, getCircleVerticalVector, getElMap, getHorizontalPath, getMarksByName, getNoneGroupMarksByName, getPolarAngleLabelPosition, getSizeHandlerPath, getTextAlignAttrOfVerticalDir, getTextType, getVerticalCoord, getVerticalPath, htmlAttributeTransform, initTextMeasure, isInRange, isPostiveXAxis, isRichText, isVisible, labelSmartInvert, length, loadPoptip, measureTextSize, normalize, reactAttributeTransform, registerMarkArcAreaAnimate, registerMarkArcLineAnimate, registerMarkAreaAnimate, registerMarkLineAnimate, registerMarkPointAnimate, removeRepeatPoint, richTextAttributeTransform, scale, setPoptipTheme, smartInvertStrategy, tan2AngleToAngle, ticks, traverseGroup, version };
+export { AXIS_ELEMENT_NAME, AbstractComponent, ArcInfo, ArcLabel, ArcSegment, AreaLabel, AxisStateValue, BasePlayer, Brush, CheckBox, CircleAxis, CircleAxisGrid, CircleCrosshair, ColorContinuousLegend, ContinuousPlayer, DEFAULT_ITEM_SPACE_COL, DEFAULT_ITEM_SPACE_ROW, DEFAULT_LABEL_SPACE, DEFAULT_PAGER_SPACE, DEFAULT_SHAPE_SIZE, DEFAULT_SHAPE_SPACE, DEFAULT_STATES$1 as DEFAULT_STATES, DEFAULT_TITLE_SPACE, DEFAULT_VALUE_SPACE, DataLabel, DataZoom, DataZoomActiveTag, DirectionEnum, DiscreteLegend, DiscretePlayer, EmptyTip, GroupFadeIn, GroupFadeOut, GroupTransition, IMarkAreaLabelPosition, IMarkCommonArcLabelPosition, IMarkLineLabelPosition, IMarkPointItemPosition, IOperateType, Indicator, LEGEND_ELEMENT_NAME, LabelBase, LegendEvent, LegendStateValue, LineAxis, LineAxisGrid, LineCrosshair, LineDataLabel, LineLabel, LinkPath, MarkArcArea, MarkArcLine, MarkArea, MarkLine, MarkPoint, Pager, PlayerEventEnum, PolygonCrosshair, PopTip, Radio, RectCrosshair, RectLabel, SLIDER_ELEMENT_NAME, ScrollBar, SectorCrosshair, Segment, SizeContinuousLegend, Slider, SymbolLabel, Tag, Title, Tooltip, VTag, alignTextInLine, angle, angleLabelOrientAttribute, angleTo, clampRadian, contrastAccessibilityChecker, convertDomainToTickData, createTextGraphicByType, deltaXYToAngle, direction, fuzzyEqualNumber, getCircleLabelPosition, getCircleVerticalVector, getElMap, getHorizontalPath, getMarksByName, getNoneGroupMarksByName, getPolarAngleLabelPosition, getSizeHandlerPath, getTextAlignAttrOfVerticalDir, getTextType, getVerticalCoord, getVerticalPath, htmlAttributeTransform, initTextMeasure, isInRange, isPostiveXAxis, isRichText, isVisible, labelSmartInvert, length, loadPoptip, measureTextSize, normalize, reactAttributeTransform, registerMarkArcAreaAnimate, registerMarkArcLineAnimate, registerMarkAreaAnimate, registerMarkLineAnimate, registerMarkPointAnimate, removeRepeatPoint, richTextAttributeTransform, scale, setPoptipTheme, smartInvertStrategy, tan2AngleToAngle, ticks, traverseGroup, version };

package/es/brush/brush.js

@@ -194,5 +194,4 @@ export class Brush extends AbstractComponent {
     }
 }
 
-Brush.defaultAttributes = DEFAULT_BRUSH_ATTRIBUTES;
-//# sourceMappingURL=brush.js.map
+Brush.defaultAttributes = DEFAULT_BRUSH_ATTRIBUTES;

package/es/brush/type.js

@@ -4,4 +4,5 @@ export var IOperateType;
     IOperateType.drawStart = "drawStart", IOperateType.drawEnd = "drawEnd", IOperateType.drawing = "drawing", 
     IOperateType.moving = "moving", IOperateType.moveStart = "moveStart", IOperateType.moveEnd = "moveEnd", 
     IOperateType.brushClear = "brushClear";
-}(IOperateType || (IOperateType = {}));
+}(IOperateType || (IOperateType = {}));
+//# sourceMappingURL=type.js.map

package/es/index.d.ts

@@ -1,4 +1,4 @@
-export declare const version = "0.19.20-alpha.2";
+export declare const version = "0.19.21-alpha.0";
 export * from './core/base';
 export * from './core/type';
 export * from './scrollbar';
@@ -20,7 +20,6 @@ export * from './link-path';
 export * from './player';
 export * from './brush';
 export * from './tooltip';
-export * from './timeline';
 export * from './interface';
 export * from './jsx';
 export * from './checkbox';

package/es/index.js

@@ -1,4 +1,4 @@
-export const version = "0.19.20-alpha.2";
+export const version = "0.19.21-alpha.0";
 
 export * from "./core/base";
 
@@ -42,8 +42,6 @@ export * from "./brush";
 
 export * from "./tooltip";
 
-export * from "./timeline";
-
 export * from "./interface";
 
 export * from "./jsx";

package/es/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts"],"names":[],"mappings":"AACA,MAAM,CAAC,MAAM,OAAO,GAAG,iBAAiB,CAAC;AAEzC,cAAc,aAAa,CAAC;AAC5B,cAAc,aAAa,CAAC;AAC5B,cAAc,aAAa,CAAC;AAC5B,cAAc,OAAO,CAAC;AACtB,cAAc,UAAU,CAAC;AACzB,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,aAAa,CAAC;AAC5B,cAAc,WAAW,CAAC;AAC1B,cAAc,aAAa,CAAC;AAC5B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,aAAa,CAAC;AAC5B,cAAc,UAAU,CAAC;AACzB,cAAc,aAAa,CAAC;AAC5B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,cAAc,YAAY,CAAC;AAC3B,cAAc,aAAa,CAAC;AAC5B,cAAc,OAAO,CAAC;AACtB,cAAc,YAAY,CAAC;AAC3B,cAAc,SAAS,CAAC;AACxB,cAAc,aAAa,CAAC;AAC5B,cAAc,QAAQ,CAAC","file":"index.js","sourcesContent":["// 导出版本号\nexport const version = \"0.19.20-alpha.2\";\n\nexport * from './core/base';\nexport * from './core/type';\nexport * from './scrollbar';\nexport * from './tag';\nexport * from './poptip';\nexport * from './crosshair';\nexport * from './label';\nexport * from './axis';\nexport * from './axis/grid';\nexport * from './segment';\nexport * from './data-zoom';\nexport * from './marker';\nexport * from './pager';\nexport * from './legend';\nexport * from './title';\nexport * from './indicator';\nexport * from './slider';\nexport * from './link-path';\nexport * from './player';\nexport * from './brush';\nexport * from './tooltip';\nexport * from './timeline';\nexport * from './interface';\nexport * from './jsx';\nexport * from './checkbox';\nexport * from './radio';\nexport * from './empty-tip';\nexport * from './util';\n"]}
+{"version":3,"sources":["../src/index.ts"],"names":[],"mappings":"AACA,MAAM,CAAC,MAAM,OAAO,GAAG,iBAAiB,CAAC;AAEzC,cAAc,aAAa,CAAC;AAC5B,cAAc,aAAa,CAAC;AAC5B,cAAc,aAAa,CAAC;AAC5B,cAAc,OAAO,CAAC;AACtB,cAAc,UAAU,CAAC;AACzB,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,aAAa,CAAC;AAC5B,cAAc,WAAW,CAAC;AAC1B,cAAc,aAAa,CAAC;AAC5B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,aAAa,CAAC;AAC5B,cAAc,UAAU,CAAC;AACzB,cAAc,aAAa,CAAC;AAC5B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,cAAc,aAAa,CAAC;AAC5B,cAAc,OAAO,CAAC;AACtB,cAAc,YAAY,CAAC;AAC3B,cAAc,SAAS,CAAC;AACxB,cAAc,aAAa,CAAC;AAC5B,cAAc,QAAQ,CAAC","file":"index.js","sourcesContent":["// 导出版本号\nexport const version = \"0.19.21-alpha.0\";\n\nexport * from './core/base';\nexport * from './core/type';\nexport * from './scrollbar';\nexport * from './tag';\nexport * from './poptip';\nexport * from './crosshair';\nexport * from './label';\nexport * from './axis';\nexport * from './axis/grid';\nexport * from './segment';\nexport * from './data-zoom';\nexport * from './marker';\nexport * from './pager';\nexport * from './legend';\nexport * from './title';\nexport * from './indicator';\nexport * from './slider';\nexport * from './link-path';\nexport * from './player';\nexport * from './brush';\nexport * from './tooltip';\nexport * from './interface';\nexport * from './jsx';\nexport * from './checkbox';\nexport * from './radio';\nexport * from './empty-tip';\nexport * from './util';\n"]}

package/es/label/arc.js

@@ -2,7 +2,7 @@ import { merge, isValidNumber, isNil, isLess, isGreater, isNumberClose as isClos
 
 import { LabelBase } from "./base";
 
-import { graphicCreator } from "@visactor/vrender-core";
+import { graphicCreator, CustomPath2D } from "@visactor/vrender-core";
 
 import { circlePoint, isQuadrantRight, isQuadrantLeft, lineCirclePoints, connectLineRadian, checkBoundsOverlap, computeQuadrant } from "./util";
 
@@ -419,7 +419,7 @@ export class ArcLabel extends LabelBase {
         }
     }
     _createLabelLine(text, baseMark) {
-        var _a, _b, _c, _d, _e, _f, _g;
+        var _a, _b, _c, _d, _e, _f, _g, _h;
         const {points: points, line: line = {}, visible: visible, fill: fill} = text.attribute, labelLine = text.attribute.points ? graphicCreator.line({
             visible: null === (_c = null !== (_a = line.visible && visible) && void 0 !== _a ? _a : null === (_b = text.attribute) || void 0 === _b ? void 0 : _b.visible) || void 0 === _c || _c,
             stroke: null !== (_e = null === (_d = line.style) || void 0 === _d ? void 0 : _d.stroke) && void 0 !== _e ? _e : fill,
@@ -427,7 +427,14 @@ export class ArcLabel extends LabelBase {
             points: points,
             curveType: line.smooth ? "basis" : null
         }) : void 0;
-        return labelLine && this._setStatesOfLabelLine(labelLine), labelLine;
+        if (labelLine) {
+            if (null === (_h = line.style) || void 0 === _h ? void 0 : _h.customShape) {
+                const customShape = line.style.customShape;
+                labelLine.pathProxy = attrs => customShape(attrs, new CustomPath2D);
+            }
+            this._setStatesOfLabelLine(labelLine);
+        }
+        return labelLine;
     }
     computeRadius(r, width, height, k) {
         return this.computeLayoutRadius(width || 0, height || 0) * r * (isNil(k) ? 1 : k);