@visactor/vrender-components 0.13.9-alpha.5 → 0.13.9-alpha.6

package/dist/index.js

@@ -1311,6 +1311,9 @@
                 _clear(index >>> DIV, ~(1 << (index & MOD)));
             },
             getRange: ({ x1, y1, x2, y2 }) => {
+                if (x2 < 0 || y2 < 0 || x1 > w || y1 > h) {
+                    return true;
+                }
                 let r = y2;
                 let start;
                 let end;
@@ -1343,6 +1346,9 @@
                 return false;
             },
             setRange: ({ x1, y1, x2, y2 }) => {
+                if (x2 < 0 || y2 < 0 || x1 > w || y1 > h) {
+                    return;
+                }
                 let start;
                 let end;
                 let indexStart;
@@ -1592,10 +1598,6 @@
         _lastHover;
         _lastSelect;
         _enableAnimation;
-        layoutArcLabels(position, attribute, currentMarks) {
-            const arcs = [];
-            return arcs;
-        }
         render() {
             this._prepare();
             const { overlap, smartInvert, dataFilter, customLayoutFunc, customOverlapFunc } = this.attribute;
@@ -1609,14 +1611,12 @@
             }
             else {
                 labels = this.layout(data);
-                if (this.attribute.type !== 'arc') {
-                    if (vutils.isFunction(customOverlapFunc)) {
-                        labels = customOverlapFunc(labels, (d) => this._idToGraphic.get(d.id));
-                    }
-                    else {
-                        if (overlap !== false) {
-                            labels = this._overlapping(labels);
-                        }
+                if (vutils.isFunction(customOverlapFunc)) {
+                    labels = customOverlapFunc(labels, (d) => this._idToGraphic.get(d.id));
+                }
+                else {
+                    if (overlap !== false) {
+                        labels = this._overlapping(labels);
                     }
                 }
             }
@@ -1737,47 +1737,20 @@
                 const textData = data[i];
                 const baseMark = this._idToGraphic.get(textData.id);
                 const labelAttribute = {
-                    fill: baseMark.attribute.fill,
                     ...textStyle,
                     ...textData
                 };
                 const text = this._createLabelText(labelAttribute);
                 const textBounds = this.getGraphicBounds(text);
                 const graphicBounds = this.getGraphicBounds(baseMark, { x: textData.x, y: textData.y });
-                if (this.attribute.type === 'arc') {
-                    const graphicAttributes = baseMark.attribute;
-                    const { width, height } = this.attribute;
-                    this.labeling(textBounds, graphicBounds, vutils.isFunction(position) ? position(textData) : position, offset, graphicAttributes, textData, width, height, this.attribute);
-                    labels.push(text);
-                }
-                else {
-                    const textLocation = this.labeling(textBounds, graphicBounds, vutils.isFunction(position) ? position(textData) : position, offset);
-                    if (!textLocation) {
-                        continue;
-                    }
-                    labelAttribute.x = textLocation.x;
-                    labelAttribute.y = textLocation.y;
-                    text.setAttributes(textLocation);
-                    labels.push(text);
-                }
-            }
-            if (this.attribute.type === 'arc') {
-                const arcs = this.layoutArcLabels(position, this.attribute, Array.from(this._idToGraphic.values()));
-                for (let i = 0; i < data.length; i++) {
-                    const textData = data[i];
-                    const basedArc = arcs.find(arc => arc.labelText === textData.text);
-                    const labelAttribute = {
-                        x: basedArc.labelPosition.x,
-                        y: basedArc.labelPosition.y,
-                        textAlign: this.attribute.textAlign ?? basedArc.textAlign,
-                        textBaseline: this.attribute.textBaseline ?? basedArc.textBaseline,
-                        angle: this.attribute.angle ?? basedArc.angle
-                    };
-                    labels[i].setAttributes(labelAttribute);
-                    labels[i].pointA = basedArc.pointA;
-                    labels[i].pointB = basedArc.pointB;
-                    labels[i].pointC = basedArc.pointC;
+                const textLocation = this.labeling(textBounds, graphicBounds, vutils.isFunction(position) ? position(textData) : position, offset);
+                if (!textLocation) {
+                    continue;
                 }
+                labelAttribute.x = textLocation.x;
+                labelAttribute.y = textLocation.y;
+                text.setAttributes(textLocation);
+                labels.push(text);
             }
             return labels;
         }
@@ -1823,6 +1796,15 @@
                         continue;
                     }
                 }
+                let hasPlace = false;
+                for (let j = 0; j < strategy.length; j++) {
+                    hasPlace = place(bmpTool, bitmap, strategy[j], this.attribute, text, this.getGraphicBounds(baseMark, labels[i]), this.labeling);
+                    if (hasPlace !== false) {
+                        text.setAttributes({ x: hasPlace.x, y: hasPlace.y });
+                        result.push(text);
+                        break;
+                    }
+                }
                 if (clampForce) {
                     const { dx = 0, dy = 0 } = clampText(text, bmpTool.width, bmpTool.height);
                     if (!(dx === 0 && dy === 0) &&
@@ -1833,19 +1815,11 @@
                             y2: text.AABBBounds.y2 + dy
                         })) {
                         text.setAttributes({ x: text.attribute.x + dx, y: text.attribute.y + dy });
+                        bitmap.setRange(boundToRange(bmpTool, text.AABBBounds, true));
                         result.push(text);
                         continue;
                     }
                 }
-                let hasPlace = false;
-                for (let j = 0; j < strategy.length; j++) {
-                    hasPlace = place(bmpTool, bitmap, strategy[j], this.attribute, text, this.getGraphicBounds(baseMark, labels[i]), this.labeling);
-                    if (hasPlace !== false) {
-                        text.setAttributes({ x: hasPlace.x, y: hasPlace.y });
-                        result.push(text);
-                        break;
-                    }
-                }
                 !hasPlace && !hideOnHit && result.push(text);
             }
             if (vutils.isFunction(this.onAfterLabelOverlap)) {
@@ -1887,29 +1861,14 @@
             const prevTextMap = this._graphicToText || new Map();
             const texts = [];
             labels.forEach((text, index) => {
-                let labelLine;
-                if (this.attribute.type === 'arc' && this.attribute.position === 'outside') {
-                    labelLine = vrender.createPath({
-                        visible: text.attribute?.visible ?? true,
-                        stroke: text.attribute?.line?.stroke ?? text.attribute?.fill,
-                        lineWidth: 1,
-                        path: `M${Math.round(text.pointA.x)},${Math.round(text.pointA.y)}` +
-                            ` L${Math.round(text.pointB.x)},${Math.round(text.pointB.y)}` +
-                            ` L${Math.round(text.pointC.x)},${Math.round(text.pointC.y)}`
-                    });
-                }
                 const relatedGraphic = this._idToGraphic.get(text.attribute.id);
                 const state = prevTextMap?.get(relatedGraphic) ? 'update' : 'enter';
                 if (state === 'enter') {
                     texts.push(text);
-                    if (this.attribute.type === 'arc' && this.attribute.position === 'outside') ;
                     currentTextMap.set(relatedGraphic, text);
                     if (!disableAnimation && relatedGraphic) {
                         const { from, to } = getAnimationAttributes(text.attribute, 'fadeIn');
                         this.add(text);
-                        if (this.attribute.type === 'arc' && this.attribute.position === 'outside') {
-                            this.add(labelLine);
-                        }
                         relatedGraphic.onAnimateBind = () => {
                             text.setAttributes(from);
                             const listener = this._afterRelatedGraphicAttributeUpdate(text, texts, index, relatedGraphic, {
@@ -2017,15 +1976,7 @@
                     continue;
                 }
                 const baseMark = this._idToGraphic.get(label.attribute.id);
-                let isInside = canPlaceInside(label.AABBBounds, baseMark?.AABBBounds);
-                if (this.attribute.type === 'arc') {
-                    if (this.attribute.position === 'inside') {
-                        isInside = true;
-                    }
-                    else {
-                        isInside = false;
-                    }
-                }
+                const isInside = canPlaceInside(label.AABBBounds, baseMark?.AABBBounds);
                 if (label.attribute.stroke && label.attribute.lineWidth > 0) {
                     label.setAttributes({
                         fill: labelSmartInvert(label.attribute.fill, label.attribute.stroke, textType, contrastRatiosThreshold, alternativeColors)
@@ -2252,769 +2203,9 @@
         }
     }
 
-    function polarToCartesian(point) {
-        if (!point.radius) {
-            return { x: 0, y: 0 };
-        }
-        return {
-            x: Math.cos(point.angle) * point.radius,
-            y: Math.sin(point.angle) * point.radius
-        };
-    }
-    function circlePoint(x0, y0, radius, radian) {
-        const offset = polarToCartesian({
-            radius,
-            angle: radian
-        });
-        return {
-            x: x0 + offset.x,
-            y: y0 + offset.y
-        };
-    }
-    function computeQuadrant(angle) {
-        angle = normalizeAngle(angle);
-        if (angle > 0 && angle <= Math.PI / 2) {
-            return 2;
-        }
-        else if (angle > Math.PI / 2 && angle <= Math.PI) {
-            return 3;
-        }
-        else if (angle > Math.PI && angle <= (3 * Math.PI) / 2) {
-            return 4;
-        }
-        return 1;
-    }
-    function normalizeAngle(angle) {
-        while (angle < 0) {
-            angle += Math.PI * 2;
-        }
-        while (angle >= Math.PI * 2) {
-            angle -= Math.PI * 2;
-        }
-        return angle;
-    }
-    function isQuadrantLeft(quadrant) {
-        return quadrant === 3 || quadrant === 4;
-    }
-    function isQuadrantRight(quadrant) {
-        return quadrant === 1 || quadrant === 2;
-    }
-    function lineCirclePoints(a, b, c, x0, y0, r) {
-        if ((a === 0 && b === 0) || r <= 0) {
-            return [];
-        }
-        if (a === 0) {
-            const y1 = -c / b;
-            const fy = (y1 - y0) ** 2;
-            const fd = r ** 2 - fy;
-            if (fd < 0) {
-                return [];
-            }
-            else if (fd === 0) {
-                return [{ x: x0, y: y1 }];
-            }
-            const x1 = Math.sqrt(fd) + x0;
-            const x2 = -Math.sqrt(fd) + x0;
-            return [
-                { x: x1, y: y1 },
-                { x: x2, y: y1 }
-            ];
-        }
-        else if (b === 0) {
-            const x1 = -c / a;
-            const fx = (x1 - x0) ** 2;
-            const fd = r ** 2 - fx;
-            if (fd < 0) {
-                return [];
-            }
-            else if (fd === 0) {
-                return [{ x: x1, y: y0 }];
-            }
-            const y1 = Math.sqrt(fd) + y0;
-            const y2 = -Math.sqrt(fd) + y0;
-            return [
-                { x: x1, y: y1 },
-                { x: x1, y: y2 }
-            ];
-        }
-        const fa = (b / a) ** 2 + 1;
-        const fb = 2 * ((c / a + x0) * (b / a) - y0);
-        const fc = (c / a + x0) ** 2 + y0 ** 2 - r ** 2;
-        const fd = fb ** 2 - 4 * fa * fc;
-        if (fd < 0) {
-            return [];
-        }
-        const y1 = (-fb + Math.sqrt(fd)) / (2 * fa);
-        const y2 = (-fb - Math.sqrt(fd)) / (2 * fa);
-        const x1 = -(b * y1 + c) / a;
-        const x2 = -(b * y2 + c) / a;
-        if (fd === 0) {
-            return [{ x: x1, y: y1 }];
-        }
-        return [
-            { x: x1, y: y1 },
-            { x: x2, y: y2 }
-        ];
-    }
-    function connectLineRadian(radius, length) {
-        if (length > radius * 2) {
-            return NaN;
-        }
-        return Math.asin(length / 2 / radius) * 2;
-    }
-    function checkBoundsOverlap(boundsA, boundsB) {
-        const { x1: ax1, y1: ay1, x2: ax2, y2: ay2 } = boundsA;
-        const { x1: bx1, y1: by1, x2: bx2, y2: by2 } = boundsB;
-        return !((ax1 <= bx1 && ax2 <= bx1) ||
-            (ax1 >= bx2 && ax2 >= bx2) ||
-            (ay1 <= by1 && ay2 <= by1) ||
-            (ay1 >= by2 && ay2 >= by2));
-    }
-
-    class ArcInfo {
-        key;
-        refDatum;
-        center;
-        outerCenter;
-        labelSize;
-        labelPosition;
-        labelLimit;
-        labelVisible;
-        lastLabelY;
-        labelYRange;
-        labelText;
-        pointA;
-        pointB;
-        pointC;
-        quadrant;
-        radian;
-        middleAngle;
-        k;
-        textAlign;
-        textBaseline;
-        angle;
-        constructor(refDatum, center, outerCenter, quadrant, radian, middleAngle) {
-            this.refDatum = refDatum;
-            this.center = center;
-            this.outerCenter = outerCenter;
-            this.quadrant = quadrant;
-            this.radian = radian;
-            this.middleAngle = middleAngle;
-            this.labelVisible = true;
-            this.labelLimit = 0;
-        }
-        getLabelBounds() {
-            if (!this.labelPosition || !this.labelSize) {
-                return { x1: 0, x2: 0, y1: 0, y2: 0 };
-            }
-            return {
-                x1: this.labelPosition.x - this.labelSize.width / 2,
-                y1: this.labelPosition.y - this.labelSize.height / 2,
-                x2: this.labelPosition.x + this.labelSize.width / 2,
-                y2: this.labelPosition.y + this.labelSize.height / 2
-            };
-        }
-    }
-    class ArcLabel extends LabelBase {
-        name = 'arc-label';
-        static defaultAttributes = {
-            coverEnable: false,
-            spaceWidth: 5,
-            layoutArcGap: 6,
-            textStyle: {
-                visible: true,
-                fontSize: 14,
-                fontWeight: 'normal',
-                fillOpacity: 1
-            },
-            position: 'outside',
-            offset: 0,
-            line: {
-                visible: true,
-                line1MinLength: 20,
-                line2MinLength: 10
-            },
-            layout: {
-                align: 'arc',
-                strategy: 'priority',
-                tangentConstraint: true
-            }
-        };
-        _ellipsisWidth = 0;
-        _arcLeft = new Map();
-        _arcRight = new Map();
-        constructor(attributes) {
-            super(vutils.merge({}, ArcLabel.defaultAttributes, attributes));
-        }
-        labeling(textBounds, graphicBounds, position = 'outside', offset = 0, graphicAttributes, textData, width, height, attribute) {
-            if (!textBounds || !graphicBounds) {
-                return;
-            }
-            const radiusRatio = this.computeLayoutOuterRadius(graphicAttributes.outerRadius, width, height);
-            const radius = this.computeRadius(radiusRatio, width, height);
-            const center = { x: graphicAttributes?.x ?? 0, y: graphicAttributes?.y ?? 0 };
-            const item = textData;
-            const arcMiddleAngle = (graphicAttributes.startAngle + graphicAttributes.endAngle) / 2;
-            const intervalAngle = graphicAttributes.endAngle - graphicAttributes.startAngle;
-            const arcQuadrant = computeQuadrant(graphicAttributes.endAngle - intervalAngle / 2);
-            const arcMiddle = circlePoint(center.x, center.y, graphicAttributes.outerRadius, arcMiddleAngle);
-            const outerArcMiddle = circlePoint(center.x, center.y, radius + attribute.line.line1MinLength, arcMiddleAngle);
-            const arc = new ArcInfo(item, arcMiddle, outerArcMiddle, arcQuadrant, intervalAngle, arcMiddleAngle);
-            arc.pointA = circlePoint(center.x, center.y, this.computeDatumRadius(center.x * 2, center.y * 2, graphicAttributes.outerRadius), arc.middleAngle);
-            arc.labelSize = {
-                width: textBounds.x2 - textBounds.x1,
-                height: textBounds.y2 - textBounds.y1
-            };
-            if (isQuadrantRight(arc.quadrant)) {
-                arc.textAlign = 'left';
-                arc.textBaseline = 'middle';
-                this._arcRight.set(arc.refDatum, arc);
-            }
-            else if (isQuadrantLeft(arc.quadrant)) {
-                arc.textAlign = 'right';
-                arc.textBaseline = 'middle';
-                this._arcLeft.set(arc.refDatum, arc);
-            }
-        }
-        layoutArcLabels(position, attribute, currentMarks) {
-            const leftArcs = Array.from(this._arcLeft.values());
-            const rightArcs = Array.from(this._arcRight.values());
-            const arcs = [];
-            if (position === 'inside') {
-                arcs.push(...this._layoutInsideLabels(rightArcs, attribute, currentMarks));
-                arcs.push(...this._layoutInsideLabels(leftArcs, attribute, currentMarks));
-            }
-            else {
-                arcs.push(...this._layoutOutsideLabels(rightArcs, attribute, currentMarks));
-                arcs.push(...this._layoutOutsideLabels(leftArcs, attribute, currentMarks));
-            }
-            return arcs;
-        }
-        _layoutInsideLabels(arcs, attribute, currentMarks) {
-            const center = { x: currentMarks[0].attribute?.x ?? 0, y: currentMarks[0].attribute?.y ?? 0 };
-            const innerRadiusRatio = this.computeLayoutOuterRadius(currentMarks[0].attribute.innerRadius, attribute.width, attribute.height);
-            const outerRadiusRatio = this.computeLayoutOuterRadius(currentMarks[0].attribute.outerRadius, attribute.width, attribute.height);
-            const labelConfig = attribute;
-            const spaceWidth = labelConfig.spaceWidth;
-            arcs.forEach((arc) => {
-                const { labelSize, radian } = arc;
-                const innerRadius = this.computeRadius(innerRadiusRatio, attribute.width, attribute.height, 1);
-                const outerRadius = this.computeRadius(outerRadiusRatio, attribute.width, attribute.height, 1);
-                const minRadian = connectLineRadian(outerRadius, labelSize.height);
-                let limit;
-                if (radian < minRadian) {
-                    limit = 0;
-                }
-                else {
-                    let minRadius;
-                    if (radian >= Math.PI) {
-                        minRadius = innerRadius;
-                    }
-                    else {
-                        minRadius = Math.max(innerRadius, labelSize.height / 2 / Math.tan(radian / 2));
-                    }
-                    limit = outerRadius - minRadius - spaceWidth;
-                }
-                if (labelConfig?.rotate !== true) {
-                    limit = outerRadius - spaceWidth;
-                }
-                const text = this._getFormatLabelText(arc.refDatum, limit);
-                arc.labelText = text;
-                const labelWidth = Math.min(limit, arc.labelSize.width);
-                const align = this._computeAlign(arc, attribute);
-                const alignOffset = align === 'left' ? labelWidth : align === 'right' ? 0 : labelWidth / 2;
-                const labelRadius = outerRadius - spaceWidth - alignOffset;
-                arc.labelPosition = circlePoint(center.x, center.y, labelRadius, arc.middleAngle);
-                arc.labelLimit = labelWidth;
-                if (!vutils.isGreater(labelWidth, 0)) {
-                    arc.labelVisible = false;
-                }
-                (arc.textAlign = 'center'), (arc.textBaseline = 'middle');
-                arc.angle = arc.middleAngle;
-            });
-            return arcs;
-        }
-        _layoutOutsideLabels(arcs, attribute, currentMarks) {
-            const center = { x: currentMarks[0].attribute?.x ?? 0, y: currentMarks[0].attribute?.y ?? 0 };
-            const height = center.y * 2;
-            const line2MinLength = attribute.line.line2MinLength;
-            const labelLayout = attribute.layout;
-            const spaceWidth = attribute.spaceWidth;
-            arcs.forEach(arc => {
-                const direction = isQuadrantLeft(arc.quadrant) ? -1 : 1;
-                arc.labelPosition = {
-                    x: arc.outerCenter.x + direction * (arc.labelSize.width / 2 + line2MinLength + spaceWidth),
-                    y: arc.outerCenter.y
-                };
-            });
-            arcs.sort((a, b) => {
-                return a.labelPosition.y - b.labelPosition.y;
-            });
-            if (attribute.coverEnable !== false || labelLayout.strategy === 'none') {
-                for (const arc of arcs) {
-                    const { labelPosition, labelSize } = arc;
-                    arc.labelLimit = labelSize.width;
-                    arc.pointB = isQuadrantLeft(arc.quadrant)
-                        ? {
-                            x: labelPosition.x + labelSize.width / 2 + line2MinLength + spaceWidth,
-                            y: labelPosition.y
-                        }
-                        : {
-                            x: labelPosition.x - labelSize.width / 2 - line2MinLength - spaceWidth,
-                            y: labelPosition.y
-                        };
-                    this._computeX(arc, attribute, currentMarks);
-                }
-                if (attribute.coverEnable === false && labelLayout.strategy === 'none') {
-                    this._coverLabels(arcs);
-                }
-            }
-            else {
-                const maxLabels = height / (attribute.textStyle?.fontSize || 16);
-                this._adjustY(arcs, maxLabels, attribute, currentMarks);
-                const { minY, maxY } = arcs.reduce((yInfo, arc) => {
-                    const { y1, y2 } = arc.getLabelBounds();
-                    yInfo.minY = Math.max(0, Math.min(y1, yInfo.minY));
-                    yInfo.maxY = Math.min(height, Math.max(y2, yInfo.maxY));
-                    return yInfo;
-                }, { minY: Infinity, maxY: -Infinity });
-                const halfY = Math.max(Math.abs(height / 2 - minY), Math.abs(maxY - height / 2));
-                const r = this._computeLayoutRadius(halfY, attribute, currentMarks);
-                for (const arc of arcs) {
-                    this._computePointB(arc, r, attribute, currentMarks);
-                    this._computeX(arc, attribute, currentMarks);
-                }
-            }
-            const width = center.x * 2;
-            arcs.forEach(arc => {
-                if (arc.labelVisible &&
-                    (vutils.isLess(arc.pointB.x, line2MinLength + spaceWidth) ||
-                        vutils.isGreater(arc.pointB.x, width - line2MinLength - spaceWidth))) {
-                    arc.labelVisible = false;
-                }
-                arc.angle = 0;
-            });
-            return arcs;
-        }
-        _computeX(arc, attribute, currentMarks) {
-            const center = { x: currentMarks[0].attribute?.x ?? 0, y: currentMarks[0].attribute?.y ?? 0 };
-            const plotLayout = { width: center.x * 2, height: center.y * 2 };
-            const radiusRatio = this.computeLayoutOuterRadius(currentMarks[0].attribute.outerRadius, attribute.width, attribute.height);
-            const line1MinLength = attribute.line.line1MinLength;
-            const line2MinLength = attribute.line.line2MinLength;
-            const labelLayoutAlign = attribute.layout?.align;
-            const spaceWidth = attribute.spaceWidth;
-            const align = this._computeAlign(arc, attribute);
-            const { labelPosition, quadrant, pointB } = arc;
-            if (!vutils.isValidNumber(pointB.x * pointB.y)) {
-                arc.pointC = { x: NaN, y: NaN };
-                labelPosition.x = NaN;
-                arc.labelLimit = 0;
-            }
-            const radius = this.computeRadius(radiusRatio, attribute.width, attribute.height);
-            const flag = isQuadrantLeft(quadrant) ? -1 : 1;
-            let cx = 0;
-            const restWidth = flag > 0 ? plotLayout.width - pointB.x : pointB.x;
-            let limit = restWidth - line2MinLength - spaceWidth;
-            if (labelLayoutAlign === 'labelLine') {
-                cx = (radius + line1MinLength + line2MinLength) * flag + center.x;
-                limit = (flag > 0 ? plotLayout.width - cx : cx) - spaceWidth;
-            }
-            const text = this._getFormatLabelText(arc.refDatum, limit);
-            arc.labelText = text;
-            let labelWidth = Math.min(limit, arc.labelSize.width);
-            switch (labelLayoutAlign) {
-                case 'labelLine':
-                    break;
-                case 'edge':
-                    cx = flag > 0 ? plotLayout.width - labelWidth - spaceWidth : labelWidth + spaceWidth;
-                    break;
-                case 'arc':
-                default:
-                    cx = pointB.x + flag * line2MinLength;
-                    break;
-            }
-            labelWidth = Math.max(this._ellipsisWidth, labelWidth);
-            arc.pointC = { x: cx, y: labelPosition.y };
-            if (labelLayoutAlign === 'edge') {
-                const alignOffset = this._computeAlignOffset(align, labelWidth, -flag);
-                labelPosition.x = flag > 0 ? plotLayout.width + alignOffset : alignOffset;
-            }
-            else {
-                const alignOffset = this._computeAlignOffset(align, labelWidth, flag);
-                labelPosition.x = cx + alignOffset + flag * spaceWidth;
-            }
-            arc.labelLimit = labelWidth;
-        }
-        _computeAlignOffset(align, labelWidth, alignFlag) {
-            switch (align) {
-                case 'left':
-                    return alignFlag < 0 ? -labelWidth : 0;
-                case 'right':
-                    return alignFlag < 0 ? 0 : labelWidth;
-                case 'center':
-                default:
-                    return (labelWidth / 2) * alignFlag;
-            }
-        }
-        _computeAlign(arc, attribute) {
-            const labelConfig = attribute;
-            const textAlign = labelConfig.textStyle?.textAlign ?? labelConfig.textStyle?.align;
-            const layoutAlign = labelConfig.layout?.textAlign ?? labelConfig.layout?.align;
-            if (labelConfig.position !== 'inside') {
-                if (vutils.isNil(textAlign) || textAlign === 'auto') {
-                    if (layoutAlign === 'edge') {
-                        return isQuadrantLeft(arc.quadrant) ? 'left' : 'right';
-                    }
-                    return isQuadrantLeft(arc.quadrant) ? 'right' : 'left';
-                }
-                return textAlign;
-            }
-            return vutils.isNil(textAlign) || textAlign === 'auto' ? 'center' : textAlign;
-        }
-        _getFormatLabelText(value, limit) {
-            return value.text;
-        }
-        _adjustY(arcs, maxLabels, attribute, currentMarks) {
-            const center = { x: currentMarks[0].attribute?.x ?? 0, y: currentMarks[0].attribute?.y ?? 0 };
-            const plotRect = { width: center.x * 2, height: center.y * 2 };
-            const labelLayout = attribute.layout;
-            if (labelLayout.strategy === 'vertical') {
-                let lastY = 0;
-                let delta;
-                const len = arcs.length;
-                if (len <= 0) {
-                    return;
-                }
-                for (let i = 0; i < len; i++) {
-                    const { y1 } = arcs[i].getLabelBounds();
-                    delta = y1 - lastY;
-                    if (vutils.isLess(delta, 0)) {
-                        const index = this._shiftY(arcs, i, len - 1, -delta);
-                        this._shiftY(arcs, index, 0, delta / 2);
-                    }
-                    const { y2 } = arcs[i].getLabelBounds();
-                    lastY = y2;
-                }
-                const { y1: firstY1 } = arcs[0].getLabelBounds();
-                delta = firstY1 - 0;
-                if (vutils.isLess(delta, 0)) {
-                    this._shiftY(arcs, 0, len - 1, -delta);
-                }
-                for (let i = arcs.length - 1; i >= 0; i--) {
-                    if (arcs[i].getLabelBounds().y2 > plotRect.height) {
-                        arcs[i].labelVisible = false;
-                    }
-                    else {
-                        break;
-                    }
-                }
-            }
-            else if (labelLayout.strategy !== 'none') {
-                const priorityArcs = arcs.map((arc, i) => {
-                    return {
-                        arc,
-                        originIndex: i,
-                        priorityIndex: 0
-                    };
-                });
-                priorityArcs.sort((a, b) => {
-                    return b.arc.radian - a.arc.radian;
-                });
-                priorityArcs.forEach((priorityArc, i) => {
-                    priorityArc.priorityIndex = i;
-                    priorityArc.arc.labelVisible = false;
-                });
-                let topLabelIndex = Infinity;
-                let bottomLabelIndex = -Infinity;
-                for (let i = 0; i < maxLabels && i < arcs.length; i++) {
-                    this._storeY(arcs);
-                    const arc = priorityArcs[i].arc;
-                    this._computeYRange(arc, attribute, currentMarks);
-                    arc.labelVisible = true;
-                    const curY = arc.labelPosition.y;
-                    const { lastIndex, nextIndex } = this._findNeighborIndex(arcs, priorityArcs[i]);
-                    const lastArc = arcs[lastIndex];
-                    const nextArc = arcs[nextIndex];
-                    if (lastIndex === -1 && nextIndex !== -1) {
-                        const nextY = nextArc.labelPosition.y;
-                        if (curY > nextY) {
-                            arc.labelPosition.y = nextY - nextArc.labelSize.height / 2 - arc.labelSize.height / 2;
-                        }
-                        else {
-                            this._twoWayShift(arcs, arc, nextArc, nextIndex);
-                        }
-                    }
-                    else if (lastIndex !== -1 && nextIndex === -1) {
-                        const lastY = lastArc.labelPosition.y;
-                        if (curY < lastY) {
-                            arc.labelPosition.y = lastY + lastArc.labelSize.height / 2 + arc.labelSize.height / 2;
-                        }
-                        else {
-                            this._twoWayShift(arcs, lastArc, arc, priorityArcs[i].originIndex);
-                        }
-                    }
-                    else if (lastIndex !== -1 && nextIndex !== -1) {
-                        const lastY = lastArc.labelPosition.y;
-                        const nextY = nextArc.labelPosition.y;
-                        if (curY > nextY) {
-                            arc.labelPosition.y = nextY - nextArc.labelSize.height / 2 - arc.labelSize.height / 2;
-                            this._twoWayShift(arcs, lastArc, arc, priorityArcs[i].originIndex);
-                        }
-                        else if (curY < lastY) {
-                            arc.labelPosition.y = lastY + lastArc.labelSize.height / 2 + arc.labelSize.height / 2;
-                            this._twoWayShift(arcs, arc, nextArc, nextIndex);
-                        }
-                        else {
-                            this._twoWayShift(arcs, lastArc, arc, priorityArcs[i].originIndex);
-                            this._twoWayShift(arcs, arc, nextArc, nextIndex);
-                        }
-                    }
-                    const nextTopIndex = Math.min(topLabelIndex, priorityArcs[i].originIndex);
-                    const nextBottomIndex = Math.max(bottomLabelIndex, priorityArcs[i].originIndex);
-                    let delta;
-                    delta = arcs[nextBottomIndex].getLabelBounds().y2 - plotRect.height;
-                    if (vutils.isGreater(delta, 0)) {
-                        this._shiftY(arcs, nextBottomIndex, 0, -delta);
-                    }
-                    delta = arcs[nextTopIndex].getLabelBounds().y1 - 0;
-                    if (vutils.isLess(delta, 0)) {
-                        this._shiftY(arcs, nextTopIndex, arcs.length - 1, -delta);
-                    }
-                    delta = arcs[nextBottomIndex].getLabelBounds().y2 - plotRect.height;
-                    if (vutils.isGreater(delta, 0)) {
-                        arc.labelVisible = false;
-                        this._restoreY(arcs);
-                        break;
-                    }
-                    else if (labelLayout.tangentConstraint && !this._checkYRange(arcs)) {
-                        arc.labelVisible = false;
-                        this._restoreY(arcs);
-                    }
-                    else {
-                        topLabelIndex = nextTopIndex;
-                        bottomLabelIndex = nextBottomIndex;
-                    }
-                }
-            }
-        }
-        _shiftY(arcs, start, end, delta) {
-            const direction = start < end ? 1 : -1;
-            let index = start;
-            while (index !== -1) {
-                arcs[index].labelPosition.y += delta;
-                const nextIndex = this._findNextVisibleIndex(arcs, index, end, direction);
-                if (nextIndex >= 0 && nextIndex < arcs.length) {
-                    const { y1: curY1, y2: curY2 } = arcs[index].getLabelBounds();
-                    const { y1: nextY1, y2: nextY2 } = arcs[nextIndex].getLabelBounds();
-                    if ((direction > 0 && curY2 < nextY1) || (direction < 0 && curY1 > nextY2)) {
-                        return index;
-                    }
-                }
-                index = nextIndex;
-            }
-            return end;
-        }
-        _findNextVisibleIndex(arcs, start, end, direction) {
-            const diff = (end - start) * direction;
-            for (let i = 1; i <= diff; i++) {
-                const index = start + i * direction;
-                if (arcs[index].labelVisible) {
-                    return index;
-                }
-            }
-            return -1;
-        }
-        _computePointB(arc, r, attribute, currentMarks) {
-            const labelConfig = attribute;
-            const radiusRatio = this.computeLayoutOuterRadius(currentMarks[0].attribute.outerRadius, attribute.width, attribute.height);
-            const line1MinLength = labelConfig.line.line1MinLength;
-            const labelLayout = labelConfig.layout;
-            if (labelLayout.strategy === 'none') {
-                arc.pointB = {
-                    x: arc.outerCenter.x,
-                    y: arc.outerCenter.y
-                };
-            }
-            else {
-                const center = { x: currentMarks[0].attribute?.x ?? 0, y: currentMarks[0].attribute?.y ?? 0 };
-                const radius = this.computeRadius(radiusRatio, attribute.width, attribute.height);
-                const { labelPosition, quadrant } = arc;
-                const outerR = Math.max(radius + line1MinLength, currentMarks[0].attribute.outerRadius);
-                const rd = r - outerR;
-                const x = Math.sqrt(r ** 2 - Math.abs(center.y - labelPosition.y) ** 2) - rd;
-                if (vutils.isValidNumber(x)) {
-                    arc.pointB = {
-                        x: center.x + x * (isQuadrantLeft(quadrant) ? -1 : 1),
-                        y: labelPosition.y
-                    };
-                }
-                else {
-                    arc.pointB = { x: NaN, y: NaN };
-                }
-            }
-        }
-        _storeY(arcs) {
-            for (const arc of arcs) {
-                if (arc.labelVisible) {
-                    arc.lastLabelY = arc.labelPosition.y;
-                }
-            }
-        }
-        _computeYRange(arc, attribute, currentMarks) {
-            const center = { x: currentMarks[0].attribute?.x ?? 0, y: currentMarks[0].attribute?.y ?? 0 };
-            const plotRect = { width: center.x * 2, height: center.y * 2 };
-            const radiusRatio = this.computeLayoutOuterRadius(currentMarks[0].attribute.outerRadius, attribute.width, attribute.height);
-            const line1MinLength = attribute.line.line1MinLength;
-            const { width, height } = plotRect;
-            const radius = this.computeRadius(radiusRatio, attribute.width, attribute.height);
-            const r = this._computeLayoutRadius(height / 2, attribute, currentMarks);
-            const cx = Math.abs(arc.center.x - width / 2);
-            const cy = arc.center.y - height / 2;
-            let a;
-            let b;
-            let c;
-            if (vutils.isNumberClose(width / 2, cx)) {
-                a = 0;
-                b = 1;
-                c = -cy;
-            }
-            else if (vutils.isNumberClose(height / 2, cy)) {
-                a = 1;
-                b = 0;
-                c = -cx;
-            }
-            else {
-                const k = -1 / (cy / cx);
-                a = k;
-                b = -1;
-                c = cy - k * cx;
-            }
-            const points = lineCirclePoints(a, b, c, line1MinLength + radius - r, 0, r);
-            if (points.length < 2) {
-                return;
-            }
-            let min;
-            let max;
-            if (points[0].x > points[1].x) {
-                points.reverse();
-            }
-            if (points[0].x < 0) {
-                if (vutils.isNumberClose(points[0].y, points[1].y)) {
-                    if (Math.abs(arc.middleAngle) < Math.PI / 2) {
-                        min = 0;
-                        max = points[1].y + height / 2;
-                    }
-                    else {
-                        min = points[1].y + height / 2;
-                        max = height;
-                    }
-                }
-                else if (points[0].y < points[1].y) {
-                    min = 0;
-                    max = points[1].y + height / 2;
-                }
-                else {
-                    min = points[1].y + height / 2;
-                    max = plotRect.height;
-                }
-            }
-            else {
-                min = Math.min(points[0].y, points[1].y) + height / 2;
-                max = Math.max(points[0].y, points[1].y) + height / 2;
-            }
-            arc.labelYRange = [min, max];
-        }
-        _computeLayoutRadius(halfYLength, attribute, currentMarks) {
-            const labelConfig = attribute;
-            const layoutArcGap = labelConfig.layoutArcGap;
-            const line1MinLength = labelConfig.line.line1MinLength;
-            const radiusRatio = this.computeLayoutOuterRadius(currentMarks[0].attribute.outerRadius, attribute.width, attribute.height);
-            const radius = this.computeRadius(radiusRatio, attribute.width, attribute.height);
-            const outerR = radius + line1MinLength;
-            const a = outerR - layoutArcGap;
-            return Math.max((a ** 2 + halfYLength ** 2) / (2 * a), outerR);
-        }
-        _findNeighborIndex(arcs, priorityArc) {
-            const index = priorityArc.originIndex;
-            let lastIndex = -1;
-            let nextIndex = -1;
-            for (let i = index - 1; i >= 0; i--) {
-                if (arcs[i].labelVisible) {
-                    lastIndex = i;
-                    break;
-                }
-            }
-            for (let i = index + 1; i < arcs.length; i++) {
-                if (arcs[i].labelVisible) {
-                    nextIndex = i;
-                    break;
-                }
-            }
-            return {
-                lastIndex,
-                nextIndex
-            };
-        }
-        _twoWayShift(arcs, lastArc, nextArc, nextIndex) {
-            const delta = nextArc.getLabelBounds().y1 - lastArc.getLabelBounds().y2;
-            if (vutils.isLess(delta, 0)) {
-                const i = this._shiftY(arcs, nextIndex, arcs.length - 1, -delta);
-                this._shiftY(arcs, i, 0, delta / 2);
-            }
-        }
-        _restoreY(arcs) {
-            for (const arc of arcs) {
-                if (arc.labelVisible) {
-                    arc.labelPosition.y = arc.lastLabelY;
-                }
-            }
-        }
-        _checkYRange(arcs) {
-            for (const arc of arcs) {
-                const { labelYRange, labelPosition } = arc;
-                if (arc.labelVisible &&
-                    labelYRange &&
-                    (vutils.isLess(labelPosition.y, labelYRange[0]) || vutils.isGreater(labelPosition.y, labelYRange[1]))) {
-                    return false;
-                }
-            }
-            return true;
-        }
-        _coverLabels(arcs) {
-            if (arcs.length <= 1) {
-                return;
-            }
-            let lastBounds = arcs[0].getLabelBounds();
-            for (let i = 1; i < arcs.length; i++) {
-                const bounds = arcs[i].getLabelBounds();
-                if (!checkBoundsOverlap(lastBounds, bounds)) {
-                    lastBounds = bounds;
-                }
-                else {
-                    arcs[i].labelVisible = false;
-                }
-            }
-        }
-        computeRadius(r, width, height, k) {
-            return this.computeLayoutRadius(width ? width : 0, height ? height : 0) * r * (vutils.isNil(k) ? 1 : k);
-        }
-        computeLayoutRadius(width, height) {
-            return Math.min(width / 2, height / 2);
-        }
-        computeLayoutOuterRadius(r, width, height) {
-            return r / (Math.min(width, height) / 2);
-        }
-        computeDatumRadius(width, height, outerRadius) {
-            const outerRadiusRatio = this.computeLayoutOuterRadius(outerRadius, width, height);
-            return this.computeLayoutRadius(width ? width : 0, height ? height : 0) * outerRadiusRatio;
-        }
-    }
-
     const labelComponentMap = {
         rect: RectLabel,
-        symbol: SymbolLabel,
-        arc: ArcLabel
+        symbol: SymbolLabel
     };
     class DataLabel extends AbstractComponent {
         name = 'data-label';
@@ -9705,6 +8896,17 @@
         }
     }
 
+    exports.IOperateType = void 0;
+    (function (IOperateType) {
+        IOperateType["drawStart"] = "drawStart";
+        IOperateType["drawEnd"] = "drawEnd";
+        IOperateType["drawing"] = "drawing";
+        IOperateType["moving"] = "moving";
+        IOperateType["moveStart"] = "moveStart";
+        IOperateType["moveEnd"] = "moveEnd";
+        IOperateType["brushClear"] = "brushClear";
+    })(exports.IOperateType || (exports.IOperateType = {}));
+
     const DEFAULT_BRUSH_ATTRIBUTES = {
         brushMode: 'single',
         brushType: 'rect',
@@ -9736,6 +8938,8 @@
         _container;
         _activeDrawState = false;
         _cacheDrawPoints = [];
+        _cacheStartTime;
+        _isDrawedBeforeEnd = false;
         _activeMoveState = false;
         _operatingMaskMoveDx = 0;
         _operatingMaskMoveDy = 0;
@@ -9791,36 +8995,41 @@
             this._activeMoveState && this._moving(e);
         };
         _onBrushEnd = (e) => {
-            if (this._outOfInteractiveRange(e)) {
-                return;
+            const { removeOnClick } = this.attribute;
+            if (this._activeDrawState && !this._isDrawedBeforeEnd && removeOnClick) {
+                this._container.incrementalClearChild();
+                this._updateDragMaskCallback &&
+                    this._updateDragMaskCallback({
+                        operateType: exports.IOperateType.brushClear,
+                        operateMask: this._operatingMask,
+                        operatedMaskAABBBounds: this._brushMaskAABBBoundsDict
+                    });
+            }
+            else {
+                this._updateDragMaskCallback &&
+                    this._updateDragMaskCallback({
+                        operateType: this._activeDrawState ? exports.IOperateType.drawEnd : exports.IOperateType.moveEnd,
+                        operateMask: this._operatingMask,
+                        operatedMaskAABBBounds: this._brushMaskAABBBoundsDict
+                    });
             }
-            this._updateDragMaskCallback &&
-                this._updateDragMaskCallback({
-                    operateType: this._activeDrawState ? 'brushEnd' : 'brushMaskUp',
-                    operateMask: this._operatingMask,
-                    operatedMaskAABBBounds: this._brushMaskAABBBoundsDict
-                });
             this._activeDrawState = false;
             this._activeMoveState = false;
+            this._isDrawedBeforeEnd = false;
             this._operatingMask.setAttribute('pickable', false);
         };
         _initDraw(e) {
-            const { brushMode, removeOnClick } = this.attribute;
+            const { brushMode } = this.attribute;
             const pos = this.eventPosToStagePos(e);
             this._cacheDrawPoints = [pos];
-            if (!this._operatingMask) {
-                this._addBrushMask();
-            }
-            if (brushMode === 'single' && removeOnClick) {
+            this._isDrawedBeforeEnd = false;
+            if (brushMode === 'single') {
                 this._container.incrementalClearChild();
-                this._addBrushMask();
-            }
-            else if (brushMode === 'multiple') {
-                this._addBrushMask();
             }
+            this._addBrushMask();
             this._updateDragMaskCallback &&
                 this._updateDragMaskCallback({
-                    operateType: 'brushStart',
+                    operateType: exports.IOperateType.drawStart,
                     operateMask: this._operatingMask,
                     operatedMaskAABBBounds: this._brushMaskAABBBoundsDict
                 });
@@ -9841,13 +9050,14 @@
             this._operatingMask.setAttribute('pickable', true);
             this._updateDragMaskCallback &&
                 this._updateDragMaskCallback({
-                    operateType: 'brushMaskDown',
+                    operateType: exports.IOperateType.moveStart,
                     operateMask: this._operatingMask,
                     operatedMaskAABBBounds: this._brushMaskAABBBoundsDict
                 });
         }
         _drawing(e) {
             const pos = this.eventPosToStagePos(e);
+            this._isDrawedBeforeEnd = true;
             if (this._cacheDrawPoints.length > 0) {
                 const lastPos = this._cacheDrawPoints[this._cacheDrawPoints.length - 1];
                 if (pos.x === lastPos?.x && pos.y === lastPos?.y) {
@@ -9860,7 +9070,7 @@
             this._brushMaskAABBBoundsDict[this._operatingMask.name] = this._operatingMask.AABBBounds;
             this._updateDragMaskCallback &&
                 this._updateDragMaskCallback({
-                    operateType: 'brushing',
+                    operateType: exports.IOperateType.drawing,
                     operateMask: this._operatingMask,
                     operatedMaskAABBBounds: this._brushMaskAABBBoundsDict
                 });
@@ -9884,7 +9094,7 @@
             this._brushMaskAABBBoundsDict[this._operatingMask.name] = this._operatingMask.AABBBounds;
             this._updateDragMaskCallback &&
                 this._updateDragMaskCallback({
-                    operateType: 'brushMaskMove',
+                    operateType: exports.IOperateType.moving,
                     operateMask: this._operatingMask,
                     operatedMaskAABBBounds: this._brushMaskAABBBoundsDict
                 });
@@ -10411,11 +9621,9 @@
         }
     }
 
-    const version = "0.13.9-alpha.5";
+    const version = "0.13.9-alpha.6";
 
     exports.AbstractComponent = AbstractComponent;
-    exports.ArcInfo = ArcInfo;
-    exports.ArcLabel = ArcLabel;
     exports.BasePlayer = BasePlayer;
     exports.Brush = Brush;
     exports.CircleAxis = CircleAxis;