@visactor/vrender-components 0.14.3-alpha.0 → 0.14.3

package/dist/index.js

@@ -1680,6 +1680,7 @@
             }
         }
         layout(data = []) {
+            var _a;
             const { textStyle = {}, position, offset } = this.attribute;
             const labels = [];
             const textBoundsArray = [];
@@ -1706,13 +1707,10 @@
                     const textData = data[i];
                     const basedArc = arcs.find(arc => arc.labelText === textData.text);
                     const labelAttribute = {
-                        visible: basedArc.labelVisible,
                         x: basedArc.labelPosition.x,
                         y: basedArc.labelPosition.y,
-                        angle: basedArc.angle,
-                        points: (basedArc === null || basedArc === void 0 ? void 0 : basedArc.pointA) && (basedArc === null || basedArc === void 0 ? void 0 : basedArc.pointB) && (basedArc === null || basedArc === void 0 ? void 0 : basedArc.pointC)
-                            ? [basedArc.pointA, basedArc.pointB, basedArc.pointC]
-                            : undefined
+                        angle: (_a = this.attribute.angle) !== null && _a !== void 0 ? _a : basedArc.angle,
+                        labelLinePath: basedArc.labelLinePath
                     };
                     labels[i].setAttributes(labelAttribute);
                 }
@@ -1848,12 +1846,12 @@
             const texts = [];
             labels.forEach((text, index) => {
                 var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
-                const labelLine = ((_a = text.attribute) === null || _a === void 0 ? void 0 : _a.points)
-                    ? vrender.createLine({
+                const labelLine = ((_a = text.attribute) === null || _a === void 0 ? void 0 : _a.labelLinePath)
+                    ? vrender.createPath({
                         visible: (_c = (_b = text.attribute) === null || _b === void 0 ? void 0 : _b.visible) !== null && _c !== void 0 ? _c : true,
                         stroke: (_f = (_e = (_d = text.attribute) === null || _d === void 0 ? void 0 : _d.line) === null || _e === void 0 ? void 0 : _e.stroke) !== null && _f !== void 0 ? _f : (_g = text.attribute) === null || _g === void 0 ? void 0 : _g.fill,
                         lineWidth: 1,
-                        points: (_h = text.attribute) === null || _h === void 0 ? void 0 : _h.points
+                        path: (_h = text.attribute) === null || _h === void 0 ? void 0 : _h.labelLinePath
                     })
                     : undefined;
                 const relatedGraphic = this._idToGraphic.get(text.attribute.id);
@@ -1894,9 +1892,9 @@
                         const prevText = prevLabel.text;
                         prevText.animate().to(text.attribute, duration, easing);
                         if (prevLabel.labelLine) {
-                            prevLabel.labelLine.animate().to(vutils.merge({}, prevLabel.labelLine.attribute, {
-                                points: (_j = text.attribute) === null || _j === void 0 ? void 0 : _j.points
-                            }), duration, easing);
+                            prevLabel.labelLine
+                                .animate()
+                                .to(vutils.merge({}, prevLabel.labelLine.attribute, { path: (_j = text.attribute) === null || _j === void 0 ? void 0 : _j.labelLinePath }), duration, easing);
                         }
                         if (animationConfig.increaseEffect !== false &&
                             prevText.attribute.text !== text.attribute.text &&
@@ -1909,7 +1907,7 @@
                     else {
                         prevLabel.text.setAttributes(text.attribute);
                         if (prevLabel === null || prevLabel === void 0 ? void 0 : prevLabel.labelLine) {
-                            prevLabel.labelLine.setAttributes({ points: (_k = text.attribute) === null || _k === void 0 ? void 0 : _k.points });
+                            prevLabel.labelLine.setAttributes({ path: (_k = text.attribute) === null || _k === void 0 ? void 0 : _k.labelLinePath });
                         }
                     }
                 }
@@ -2437,7 +2435,6 @@
             const labelConfig = attribute;
             const spaceWidth = labelConfig.spaceWidth;
             arcs.forEach((arc) => {
-                var _a, _b;
                 const { labelSize, radian } = arc;
                 const innerRadius = this.computeRadius(innerRadiusRatio, attribute.width, attribute.height, 1);
                 const outerRadius = this.computeRadius(outerRadiusRatio, attribute.width, attribute.height, 1);
@@ -2470,7 +2467,7 @@
                 if (!vutils.isGreater(labelWidth, 0)) {
                     arc.labelVisible = false;
                 }
-                arc.angle = (_b = (_a = attribute === null || attribute === void 0 ? void 0 : attribute.textStyle) === null || _a === void 0 ? void 0 : _a.angle) !== null && _b !== void 0 ? _b : arc.middleAngle;
+                arc.angle = arc.middleAngle;
             });
             return arcs;
         }
@@ -2528,13 +2525,16 @@
             }
             const width = center.x * 2;
             arcs.forEach(arc => {
-                var _a, _b;
                 if (arc.labelVisible &&
                     (vutils.isLess(arc.pointB.x, line2MinLength + spaceWidth) ||
                         vutils.isGreater(arc.pointB.x, width - line2MinLength - spaceWidth))) {
                     arc.labelVisible = false;
                 }
-                arc.angle = (_b = (_a = attribute === null || attribute === void 0 ? void 0 : attribute.textStyle) === null || _a === void 0 ? void 0 : _a.angle) !== null && _b !== void 0 ? _b : 0;
+                arc.angle = 0;
+                arc.labelLinePath =
+                    `M${Math.round(arc.pointA.x)},${Math.round(arc.pointA.y)}` +
+                        ` L${Math.round(arc.pointB.x)},${Math.round(arc.pointB.y)}` +
+                        ` L${Math.round(arc.pointC.x)},${Math.round(arc.pointC.y)}`;
             });
             return arcs;
         }
@@ -2547,6 +2547,7 @@
             const line2MinLength = attribute.line.line2MinLength;
             const labelLayoutAlign = (_e = attribute.layout) === null || _e === void 0 ? void 0 : _e.align;
             const spaceWidth = attribute.spaceWidth;
+            this._computeAlign(arc, attribute);
             const { labelPosition, quadrant, pointB } = arc;
             if (!vutils.isValidNumber(pointB.x * pointB.y)) {
                 arc.pointC = { x: NaN, y: NaN };
@@ -5725,6 +5726,27 @@
     })(exports.IMarkPointItemPosition || (exports.IMarkPointItemPosition = {}));
 
     class Marker extends AbstractComponent {
+        _initContainer() {
+            var _a, _b, _c, _d, _e, _f, _g, _h, _j;
+            const groupClip = vrender.createGroup(Object.assign(Object.assign({}, (_a = this.attribute) === null || _a === void 0 ? void 0 : _a.clipRange), { clip: (_c = vutils.isValid((_b = this.attribute) === null || _b === void 0 ? void 0 : _b.clipRange)) !== null && _c !== void 0 ? _c : false }));
+            groupClip.name = 'marker-container';
+            const group = vrender.createGroup({
+                x: -((_f = (_e = (_d = this.attribute) === null || _d === void 0 ? void 0 : _d.clipRange) === null || _e === void 0 ? void 0 : _e.x) !== null && _f !== void 0 ? _f : 0),
+                y: -((_j = (_h = (_g = this.attribute) === null || _g === void 0 ? void 0 : _g.clipRange) === null || _h === void 0 ? void 0 : _h.y) !== null && _j !== void 0 ? _j : 0)
+            });
+            groupClip.add(group);
+            this._containerClip = groupClip;
+            this.add(groupClip);
+            this._container = group;
+        }
+        _updateContainer() {
+            var _a, _b, _c, _d, _e, _f, _g, _h, _j;
+            this._containerClip.setAttributes(Object.assign(Object.assign({}, (_a = this.attribute) === null || _a === void 0 ? void 0 : _a.clipRange), { clip: (_c = vutils.isValid((_b = this.attribute) === null || _b === void 0 ? void 0 : _b.clipRange)) !== null && _c !== void 0 ? _c : false }));
+            this._container.setAttributes({
+                x: -((_f = (_e = (_d = this.attribute) === null || _d === void 0 ? void 0 : _d.clipRange) === null || _e === void 0 ? void 0 : _e.x) !== null && _f !== void 0 ? _f : 0),
+                y: -((_j = (_h = (_g = this.attribute) === null || _g === void 0 ? void 0 : _g.clipRange) === null || _h === void 0 ? void 0 : _h.y) !== null && _j !== void 0 ? _j : 0)
+            });
+        }
         render() {
             var _a, _b;
             const markerVisible = (_a = this.attribute.visible) !== null && _a !== void 0 ? _a : true;
@@ -5734,14 +5756,12 @@
                 this.setAttribute('childrenPickable', false);
             }
             if (markerVisible) {
-                if (!this._container) {
-                    const group = vrender.createGroup({});
-                    group.name = 'marker-container';
-                    this.add(group);
-                    this._container = group;
-                    this.initMarker(group);
+                if (!this._containerClip) {
+                    this._initContainer();
+                    this.initMarker(this._container);
                 }
                 else {
+                    this._updateContainer();
                     this.updateMarker();
                 }
             }
@@ -6502,6 +6522,7 @@
         LegendEvent["legendItemHover"] = "legendItemHover";
         LegendEvent["legendItemUnHover"] = "legendItemUnHover";
         LegendEvent["legendItemClick"] = "legendItemClick";
+        LegendEvent["legendItemAttributeUpdate"] = "legendItemAttributeUpdate";
     })(exports.LegendEvent || (exports.LegendEvent = {}));
     exports.LEGEND_ELEMENT_NAME = void 0;
     (function (LEGEND_ELEMENT_NAME) {
@@ -6625,12 +6646,21 @@
                 const target = e.target;
                 if ((_a = target === null || target === void 0 ? void 0 : target.name) === null || _a === void 0 ? void 0 : _a.startsWith(exports.LEGEND_ELEMENT_NAME.item)) {
                     const legendItem = target.delegate;
+                    let attributeUpdate = false;
+                    if (legendItem.hasState(exports.LegendStateValue.unSelectedHover) ||
+                        legendItem.hasState(exports.LegendStateValue.selectedHover)) {
+                        attributeUpdate = true;
+                    }
                     legendItem.removeState(exports.LegendStateValue.unSelectedHover);
                     legendItem.removeState(exports.LegendStateValue.selectedHover);
                     legendItem
                         .getChildren()[0]
                         .getChildren()
                         .forEach((child) => {
+                        if (!attributeUpdate &&
+                            (child.hasState(exports.LegendStateValue.unSelectedHover) || child.hasState(exports.LegendStateValue.selectedHover))) {
+                            attributeUpdate = true;
+                        }
                         child.removeState(exports.LegendStateValue.unSelectedHover);
                         child.removeState(exports.LegendStateValue.selectedHover);
                     });
@@ -6638,6 +6668,9 @@
                     if (focusButton) {
                         focusButton.setAttribute('visible', false);
                     }
+                    if (attributeUpdate) {
+                        this._dispatchEvent(exports.LegendEvent.legendItemAttributeUpdate, legendItem);
+                    }
                     this._dispatchEvent(exports.LegendEvent.legendItemUnHover, legendItem);
                 }
             };
@@ -7066,18 +7099,32 @@
             return true;
         }
         _setLegendItemState(legendItem, stateName, keepCurrentStates = true) {
+            let attributeUpdate = false;
+            if (!legendItem.hasState(stateName)) {
+                attributeUpdate = true;
+            }
             legendItem.addState(stateName, keepCurrentStates);
             legendItem
                 .getChildren()[0]
                 .getChildren()
-                .forEach(child => {
+                .forEach((child) => {
                 if (child.name !== exports.LEGEND_ELEMENT_NAME.focus) {
+                    if (!attributeUpdate && !child.hasState(stateName)) {
+                        attributeUpdate = true;
+                    }
                     child.addState(stateName, keepCurrentStates);
                 }
             });
+            if (attributeUpdate) {
+                this._dispatchEvent(exports.LegendEvent.legendItemAttributeUpdate, legendItem);
+            }
         }
         _removeLegendItemState(legendItem, stateNames) {
+            let attributeUpdate = false;
             stateNames.forEach(name => {
+                if (!attributeUpdate && legendItem.hasState(name)) {
+                    attributeUpdate = true;
+                }
                 legendItem.removeState(name);
             });
             legendItem
@@ -7086,10 +7133,16 @@
                 .forEach(child => {
                 if (child.name !== exports.LEGEND_ELEMENT_NAME.focus) {
                     stateNames.forEach(name => {
+                        if (!attributeUpdate && child.hasState(name)) {
+                            attributeUpdate = true;
+                        }
                         child.removeState(name);
                     });
                 }
             });
+            if (attributeUpdate) {
+                this._dispatchEvent(exports.LegendEvent.legendItemAttributeUpdate, legendItem);
+            }
         }
         _getSelectedLegends() {
             var _a;
@@ -9963,7 +10016,7 @@
     }
     Tooltip.defaultAttributes = defaultAttributes;
 
-    const version = "0.14.3-alpha.0";
+    const version = "0.14.3";
 
     exports.AbstractComponent = AbstractComponent;
     exports.ArcInfo = ArcInfo;