@visactor/vrender-components 0.18.0-alpha.0 → 0.18.0-alpha.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/cjs/axis/base.js +24 -24
- package/cjs/axis/base.js.map +1 -1
- package/cjs/axis/grid/base.js +1 -1
- package/cjs/axis/grid/base.js.map +1 -1
- package/cjs/axis/line.js +59 -52
- package/cjs/axis/line.js.map +1 -1
- package/cjs/axis/overlap/auto-hide.d.ts +1 -0
- package/cjs/axis/overlap/auto-hide.js +10 -2
- package/cjs/axis/overlap/auto-hide.js.map +1 -1
- package/cjs/axis/overlap/auto-limit.d.ts +1 -0
- package/cjs/axis/overlap/auto-limit.js +5 -3
- package/cjs/axis/overlap/auto-limit.js.map +1 -1
- package/cjs/axis/type.d.ts +1 -0
- package/cjs/axis/type.js.map +1 -1
- package/cjs/brush/brush.js +4 -4
- package/cjs/brush/brush.js.map +1 -1
- package/cjs/checkbox/checkbox.js +2 -1
- package/cjs/checkbox/checkbox.js.map +1 -1
- package/cjs/core/type.d.ts +10 -8
- package/cjs/core/type.js.map +1 -1
- package/cjs/data-zoom/data-zoom.d.ts +5 -1
- package/cjs/data-zoom/data-zoom.js +136 -78
- package/cjs/data-zoom/data-zoom.js.map +1 -1
- package/cjs/index.d.ts +2 -1
- package/cjs/index.js +3 -2
- package/cjs/index.js.map +1 -1
- package/cjs/indicator/indicator.d.ts +3 -1
- package/cjs/indicator/indicator.js +60 -46
- package/cjs/indicator/indicator.js.map +1 -1
- package/cjs/indicator/type.d.ts +1 -0
- package/cjs/indicator/type.js.map +1 -1
- package/cjs/label/arc.d.ts +2 -2
- package/cjs/label/arc.js +38 -35
- package/cjs/label/arc.js.map +1 -1
- package/cjs/label/base.d.ts +6 -8
- package/cjs/label/base.js +92 -65
- package/cjs/label/base.js.map +1 -1
- package/cjs/label/line.js +3 -4
- package/cjs/label/line.js.map +1 -1
- package/cjs/label/type.d.ts +15 -8
- package/cjs/label/type.js.map +1 -1
- package/cjs/label/util.d.ts +4 -0
- package/cjs/label/util.js +24 -3
- package/cjs/label/util.js.map +1 -1
- package/cjs/legend/base.js +1 -1
- package/cjs/legend/base.js.map +1 -1
- package/cjs/legend/discrete/discrete.d.ts +1 -14
- package/cjs/legend/discrete/discrete.js +39 -60
- package/cjs/legend/discrete/discrete.js.map +1 -1
- package/cjs/legend/discrete/type.d.ts +0 -1
- package/cjs/legend/discrete/type.js.map +1 -1
- package/cjs/legend/type.d.ts +2 -2
- package/cjs/legend/type.js.map +1 -1
- package/cjs/marker/area.js +5 -1
- package/cjs/marker/area.js.map +1 -1
- package/cjs/marker/base.d.ts +1 -0
- package/cjs/marker/base.js +6 -3
- package/cjs/marker/base.js.map +1 -1
- package/cjs/marker/line.js +7 -1
- package/cjs/marker/line.js.map +1 -1
- package/cjs/marker/point.d.ts +1 -0
- package/cjs/marker/point.js +24 -11
- package/cjs/marker/point.js.map +1 -1
- package/cjs/marker/type.d.ts +1 -0
- package/cjs/marker/type.js.map +1 -1
- package/cjs/pager/pager.d.ts +0 -2
- package/cjs/pager/pager.js +8 -16
- package/cjs/pager/pager.js.map +1 -1
- package/cjs/pager/type.d.ts +0 -1
- package/cjs/pager/type.js.map +1 -1
- package/cjs/scrollbar/scrollbar.js +9 -3
- package/cjs/scrollbar/scrollbar.js.map +1 -1
- package/cjs/segment/segment.js +1 -1
- package/cjs/segment/segment.js.map +1 -1
- package/cjs/slider/slider.js +1 -1
- package/cjs/slider/slider.js.map +1 -1
- package/cjs/tag/tag.js +28 -42
- package/cjs/tag/tag.js.map +1 -1
- package/cjs/title/title.js +2 -2
- package/cjs/title/title.js.map +1 -1
- package/cjs/tooltip/tooltip.js +1 -1
- package/cjs/tooltip/tooltip.js.map +1 -1
- package/cjs/util/limit-shape.d.ts +4 -0
- package/cjs/util/limit-shape.js +13 -4
- package/cjs/util/limit-shape.js.map +1 -1
- package/cjs/util/text.d.ts +5 -2
- package/cjs/util/text.js +19 -6
- package/cjs/util/text.js.map +1 -1
- package/es/axis/base.js +22 -26
- package/es/axis/base.js.map +1 -1
- package/es/axis/grid/base.js +1 -1
- package/es/axis/grid/base.js.map +1 -1
- package/es/axis/line.js +59 -50
- package/es/axis/line.js.map +1 -1
- package/es/axis/overlap/auto-hide.d.ts +1 -0
- package/es/axis/overlap/auto-hide.js +10 -2
- package/es/axis/overlap/auto-hide.js.map +1 -1
- package/es/axis/overlap/auto-limit.d.ts +1 -0
- package/es/axis/overlap/auto-limit.js +5 -3
- package/es/axis/overlap/auto-limit.js.map +1 -1
- package/es/axis/type.d.ts +1 -0
- package/es/axis/type.js.map +1 -1
- package/es/brush/brush.js +4 -4
- package/es/brush/brush.js.map +1 -1
- package/es/checkbox/checkbox.js +2 -1
- package/es/checkbox/checkbox.js.map +1 -1
- package/es/core/type.d.ts +10 -8
- package/es/core/type.js.map +1 -1
- package/es/data-zoom/data-zoom.d.ts +5 -1
- package/es/data-zoom/data-zoom.js +135 -74
- package/es/data-zoom/data-zoom.js.map +1 -1
- package/es/index.d.ts +2 -1
- package/es/index.js +3 -1
- package/es/index.js.map +1 -1
- package/es/indicator/indicator.d.ts +3 -1
- package/es/indicator/indicator.js +57 -47
- package/es/indicator/indicator.js.map +1 -1
- package/es/indicator/type.d.ts +1 -0
- package/es/indicator/type.js.map +1 -1
- package/es/label/arc.d.ts +2 -2
- package/es/label/arc.js +38 -35
- package/es/label/arc.js.map +1 -1
- package/es/label/base.d.ts +6 -8
- package/es/label/base.js +92 -65
- package/es/label/base.js.map +1 -1
- package/es/label/line.js +3 -4
- package/es/label/line.js.map +1 -1
- package/es/label/type.d.ts +15 -8
- package/es/label/type.js.map +1 -1
- package/es/label/util.d.ts +4 -0
- package/es/label/util.js +22 -2
- package/es/label/util.js.map +1 -1
- package/es/legend/base.js +1 -1
- package/es/legend/base.js.map +1 -1
- package/es/legend/discrete/discrete.d.ts +1 -14
- package/es/legend/discrete/discrete.js +40 -58
- package/es/legend/discrete/discrete.js.map +1 -1
- package/es/legend/discrete/type.d.ts +0 -1
- package/es/legend/discrete/type.js.map +1 -1
- package/es/legend/type.d.ts +2 -2
- package/es/legend/type.js.map +1 -1
- package/es/marker/area.js +6 -2
- package/es/marker/area.js.map +1 -1
- package/es/marker/base.d.ts +1 -0
- package/es/marker/base.js +6 -3
- package/es/marker/base.js.map +1 -1
- package/es/marker/line.js +8 -2
- package/es/marker/line.js.map +1 -1
- package/es/marker/point.d.ts +1 -0
- package/es/marker/point.js +25 -11
- package/es/marker/point.js.map +1 -1
- package/es/marker/type.d.ts +1 -0
- package/es/marker/type.js.map +1 -1
- package/es/pager/pager.d.ts +0 -2
- package/es/pager/pager.js +8 -17
- package/es/pager/pager.js.map +1 -1
- package/es/pager/type.d.ts +0 -1
- package/es/pager/type.js.map +1 -1
- package/es/scrollbar/scrollbar.js +9 -3
- package/es/scrollbar/scrollbar.js.map +1 -1
- package/es/segment/segment.js +1 -1
- package/es/segment/segment.js.map +1 -1
- package/es/slider/slider.js +1 -1
- package/es/slider/slider.js.map +1 -1
- package/es/tag/tag.js +29 -45
- package/es/tag/tag.js.map +1 -1
- package/es/title/title.js +3 -3
- package/es/title/title.js.map +1 -1
- package/es/tooltip/tooltip.js +1 -1
- package/es/tooltip/tooltip.js.map +1 -1
- package/es/util/limit-shape.d.ts +4 -0
- package/es/util/limit-shape.js +11 -3
- package/es/util/limit-shape.js.map +1 -1
- package/es/util/text.d.ts +5 -2
- package/es/util/text.js +17 -5
- package/es/util/text.js.map +1 -1
- package/package.json +5 -5
- package/dist/index.js +0 -29932
- package/dist/index.min.js +0 -1
package/cjs/label/base.d.ts
CHANGED
|
@@ -4,7 +4,7 @@ import { AbstractComponent } from '../core/base';
|
|
|
4
4
|
import type { PointLocationCfg } from '../core/type';
|
|
5
5
|
import type { Bitmap } from './overlap';
|
|
6
6
|
import { bitmapTool } from './overlap';
|
|
7
|
-
import type { BaseLabelAttrs, ILabelAnimation, LabelItem, ILabelEnterAnimation, ILabelExitAnimation, ILabelUpdateAnimation } from './type';
|
|
7
|
+
import type { BaseLabelAttrs, ILabelAnimation, LabelItem, ILabelEnterAnimation, ILabelExitAnimation, ILabelUpdateAnimation, LabelContent } from './type';
|
|
8
8
|
import type { ComponentOptions } from '../interface';
|
|
9
9
|
export declare class LabelBase<T extends BaseLabelAttrs> extends AbstractComponent<T> {
|
|
10
10
|
name: string;
|
|
@@ -20,10 +20,7 @@ export declare class LabelBase<T extends BaseLabelAttrs> extends AbstractCompone
|
|
|
20
20
|
setBitmap(bitmap: Bitmap): void;
|
|
21
21
|
protected _bmpTool?: ReturnType<typeof bitmapTool>;
|
|
22
22
|
setBitmapTool(bmpTool: ReturnType<typeof bitmapTool>): void;
|
|
23
|
-
protected _graphicToText: Map<IGraphic,
|
|
24
|
-
text: IText | IRichText;
|
|
25
|
-
labelLine?: ILine;
|
|
26
|
-
}>;
|
|
23
|
+
protected _graphicToText: Map<IGraphic, LabelContent>;
|
|
27
24
|
protected _idToGraphic: Map<string, IGraphic>;
|
|
28
25
|
protected _idToPoint: Map<string, IPointLike>;
|
|
29
26
|
onAfterLabelOverlap?: (bitmap: Bitmap) => void;
|
|
@@ -35,18 +32,19 @@ export declare class LabelBase<T extends BaseLabelAttrs> extends AbstractCompone
|
|
|
35
32
|
x: number;
|
|
36
33
|
y: number;
|
|
37
34
|
} | undefined;
|
|
38
|
-
protected
|
|
35
|
+
protected _createLabelLine(text: IText | IRichText, baseMark?: IGraphic): ILine | undefined;
|
|
39
36
|
protected render(): void;
|
|
40
37
|
private _bindEvent;
|
|
41
38
|
private _setStatesOfText;
|
|
42
|
-
|
|
39
|
+
protected _setStatesOfLabelLine(target: IGraphic): void;
|
|
43
40
|
private _onHover;
|
|
44
41
|
private _onUnHover;
|
|
45
42
|
private _onClick;
|
|
46
43
|
protected _createLabelText(attributes: LabelItem): IRichText | IText;
|
|
47
44
|
private _prepare;
|
|
48
45
|
protected getRelatedGraphic(item: LabelItem): IGraphic<Partial<import("@visactor/vrender-core").IGraphicAttribute>>;
|
|
49
|
-
protected
|
|
46
|
+
protected _initText(data?: LabelItem[]): (IText | IRichText)[];
|
|
47
|
+
protected _layout(texts: (IText | IRichText)[]): (IText | IRichText)[];
|
|
50
48
|
protected _overlapping(labels: (IText | IRichText)[]): (IRichText | IText)[];
|
|
51
49
|
protected getBaseMarkGroup(): IGroup;
|
|
52
50
|
protected getGraphicBounds(graphic?: IGraphic, point?: Partial<PointLocationCfg>, position?: string): IBoundsLike;
|
package/cjs/label/base.js
CHANGED
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: !0
|
|
5
5
|
}), exports.LabelBase = void 0;
|
|
6
6
|
|
|
7
|
-
const vrender_core_1 = require("@visactor/vrender-core"), vutils_1 = require("@visactor/vutils"), base_1 = require("../core/base"), label_smartInvert_1 = require("../util/label-smartInvert"), util_1 = require("../util"), constant_1 = require("../constant"), overlap_1 = require("./overlap"), animate_1 = require("./animate/animate"), util_2 = require("./util"),
|
|
7
|
+
const vrender_core_1 = require("@visactor/vrender-core"), vutils_1 = require("@visactor/vutils"), base_1 = require("../core/base"), label_smartInvert_1 = require("../util/label-smartInvert"), util_1 = require("../util"), constant_1 = require("../constant"), overlap_1 = require("./overlap"), animate_1 = require("./animate/animate"), util_2 = require("./util"), register_1 = require("./register");
|
|
8
8
|
|
|
9
9
|
(0, register_1.loadLabelComponent)();
|
|
10
10
|
|
|
@@ -40,9 +40,9 @@ class LabelBase extends base_1.AbstractComponent {
|
|
|
40
40
|
node === target || (0, vutils_1.isEmpty)(node.states) || node.addState(constant_1.StateValue.selectedReverse, !0);
|
|
41
41
|
})), this._lastSelect = target);
|
|
42
42
|
}, this._handleRelatedGraphicSetState = e => {
|
|
43
|
-
var _a, _b, _c;
|
|
44
|
-
if ((null === (_a = e.detail) || void 0 === _a ? void 0 : _a.type) === vrender_core_1.AttributeUpdateType.STATE) {
|
|
45
|
-
const currentStates = null !== (
|
|
43
|
+
var _a, _b, _c, _d, _e;
|
|
44
|
+
if ((null === (_a = e.detail) || void 0 === _a ? void 0 : _a.type) === vrender_core_1.AttributeUpdateType.STATE || (null === (_b = e.detail) || void 0 === _b ? void 0 : _b.type) === vrender_core_1.AttributeUpdateType.ANIMATE_UPDATE && (null === (_c = e.detail.animationState) || void 0 === _c ? void 0 : _c.isFirstFrameOfStep)) {
|
|
45
|
+
const currentStates = null !== (_e = null === (_d = e.target) || void 0 === _d ? void 0 : _d.currentStates) && void 0 !== _e ? _e : [];
|
|
46
46
|
(this._isCollectionBase ? [ ...this._graphicToText.values() ] : [ this._graphicToText.get(e.target) ]).forEach((label => {
|
|
47
47
|
label && (label.text && label.text.useStates(currentStates), label.labelLine && label.labelLine.useStates(currentStates));
|
|
48
48
|
}));
|
|
@@ -50,14 +50,25 @@ class LabelBase extends base_1.AbstractComponent {
|
|
|
50
50
|
};
|
|
51
51
|
}
|
|
52
52
|
labeling(textBounds, graphicBounds, position, offset) {}
|
|
53
|
-
|
|
53
|
+
_createLabelLine(text, baseMark) {
|
|
54
|
+
const points = (0, util_2.connectLineBetweenBounds)(text.AABBBounds, null == baseMark ? void 0 : baseMark.AABBBounds);
|
|
55
|
+
if (points) {
|
|
56
|
+
const line = vrender_core_1.graphicCreator.line({
|
|
57
|
+
points: points
|
|
58
|
+
});
|
|
59
|
+
return baseMark && baseMark.attribute.fill && line.setAttribute("stroke", baseMark.attribute.fill),
|
|
60
|
+
this.attribute.line && !(0, vutils_1.isEmpty)(this.attribute.line.style) && line.setAttributes(this.attribute.line.style),
|
|
61
|
+
this._setStatesOfLabelLine(line), line;
|
|
62
|
+
}
|
|
63
|
+
}
|
|
54
64
|
render() {
|
|
55
65
|
if (this._prepare(), (0, vutils_1.isNil)(this._idToGraphic) || this._isCollectionBase && (0,
|
|
56
66
|
vutils_1.isNil)(this._idToPoint)) return;
|
|
57
67
|
const {overlap: overlap, smartInvert: smartInvert, dataFilter: dataFilter, customLayoutFunc: customLayoutFunc, customOverlapFunc: customOverlapFunc} = this.attribute;
|
|
58
|
-
let
|
|
59
|
-
(0, vutils_1.isFunction)(dataFilter) && (data = dataFilter(data))
|
|
60
|
-
|
|
68
|
+
let data = this.attribute.data;
|
|
69
|
+
(0, vutils_1.isFunction)(dataFilter) && (data = dataFilter(data));
|
|
70
|
+
let labels = this._initText(data);
|
|
71
|
+
labels = (0, vutils_1.isFunction)(customLayoutFunc) ? customLayoutFunc(data, labels, this.getRelatedGraphic.bind(this), this._isCollectionBase ? d => this._idToPoint.get(d.id) : null) : this._layout(labels),
|
|
61
72
|
(0, vutils_1.isFunction)(customOverlapFunc) ? labels = customOverlapFunc(labels, this.getRelatedGraphic.bind(this), this._isCollectionBase ? d => this._idToPoint.get(d.id) : null) : !1 !== overlap && (labels = this._overlapping(labels)),
|
|
62
73
|
labels && labels.length && labels.forEach((label => {
|
|
63
74
|
this._bindEvent(label), this._setStatesOfText(label);
|
|
@@ -81,19 +92,8 @@ class LabelBase extends base_1.AbstractComponent {
|
|
|
81
92
|
state && !(0, vutils_1.isEmpty)(state) && (target.states = state);
|
|
82
93
|
}
|
|
83
94
|
_createLabelText(attributes) {
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
attributes.textConfig = attributes.text, attributes.width = null !== (_a = attributes.width) && void 0 !== _a ? _a : 0,
|
|
87
|
-
attributes.height = null !== (_b = attributes.height) && void 0 !== _b ? _b : 0;
|
|
88
|
-
return vrender_core_1.graphicCreator.richtext(attributes);
|
|
89
|
-
}
|
|
90
|
-
if ("html" === attributes.textType) {
|
|
91
|
-
attributes.textConfig = [], attributes.html = Object.assign(Object.assign({
|
|
92
|
-
dom: attributes.text
|
|
93
|
-
}, constant_2.DEFAULT_HTML_TEXT_SPEC), attributes);
|
|
94
|
-
return vrender_core_1.graphicCreator.richtext(attributes);
|
|
95
|
-
}
|
|
96
|
-
return vrender_core_1.graphicCreator.text(attributes);
|
|
95
|
+
return (0, util_1.isRichText)(attributes, "textType") ? vrender_core_1.graphicCreator.richtext((0,
|
|
96
|
+
util_1.richTextAttributeTransform)(attributes)) : vrender_core_1.graphicCreator.text(attributes);
|
|
97
97
|
}
|
|
98
98
|
_prepare() {
|
|
99
99
|
var _a, _b, _c, _d, _e;
|
|
@@ -112,7 +112,7 @@ class LabelBase extends base_1.AbstractComponent {
|
|
|
112
112
|
let cur = 0;
|
|
113
113
|
for (let i = 0; i < currentBaseMarks.length; i++) {
|
|
114
114
|
const baseMark = currentBaseMarks[i], points = (0, util_2.getPointsOfLineArea)(baseMark);
|
|
115
|
-
if (
|
|
115
|
+
if (points && points.length) for (let j = 0; j < points.length; j++) {
|
|
116
116
|
const textData = data[cur];
|
|
117
117
|
textData && points[j] && ((0, vutils_1.isValid)(textData.id) || (textData.id = `vrender-component-${this.name}-${cur}`),
|
|
118
118
|
this._idToPoint.set(textData.id, points[j]), this._idToGraphic.set(textData.id, baseMark)),
|
|
@@ -124,36 +124,54 @@ class LabelBase extends base_1.AbstractComponent {
|
|
|
124
124
|
textData && baseMark && ((0, vutils_1.isValid)(textData.id) || (textData.id = `vrender-component-${this.name}-${i}`),
|
|
125
125
|
this._idToGraphic.set(textData.id, baseMark));
|
|
126
126
|
}
|
|
127
|
-
!1 !== this.attribute.animation
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
127
|
+
if (!1 !== this.attribute.animation) {
|
|
128
|
+
const animation = (0, vutils_1.isObject)(this.attribute.animation) ? this.attribute.animation : {};
|
|
129
|
+
this._animationConfig = {
|
|
130
|
+
enter: (0, vutils_1.merge)({}, animate_1.DefaultLabelAnimation, animation, null !== (_c = this.attribute.animationEnter) && void 0 !== _c ? _c : {}),
|
|
131
|
+
exit: (0, vutils_1.merge)({}, animate_1.DefaultLabelAnimation, animation, null !== (_d = this.attribute.animationExit) && void 0 !== _d ? _d : {}),
|
|
132
|
+
update: (0, vutils_1.isArray)(this.attribute.animationUpdate) ? this.attribute.animationUpdate : (0,
|
|
133
|
+
vutils_1.merge)({}, animate_1.DefaultLabelAnimation, animation, null !== (_e = this.attribute.animationUpdate) && void 0 !== _e ? _e : {})
|
|
134
|
+
};
|
|
135
|
+
}
|
|
133
136
|
}
|
|
134
137
|
}
|
|
135
138
|
getRelatedGraphic(item) {
|
|
136
139
|
return this._idToGraphic.get(item.id);
|
|
137
140
|
}
|
|
138
|
-
|
|
139
|
-
const {textStyle: textStyle = {}
|
|
141
|
+
_initText(data = []) {
|
|
142
|
+
const {textStyle: textStyle = {}} = this.attribute, labels = [];
|
|
140
143
|
for (let i = 0; i < data.length; i++) {
|
|
141
|
-
const textData = data[i], baseMark = this.getRelatedGraphic(textData)
|
|
144
|
+
const textData = data[i], baseMark = this.getRelatedGraphic(textData);
|
|
145
|
+
if (!baseMark) continue;
|
|
146
|
+
const labelAttribute = Object.assign(Object.assign({
|
|
142
147
|
fill: this._isCollectionBase ? (0, vutils_1.isArray)(baseMark.attribute.stroke) ? baseMark.attribute.stroke.find((entry => !!entry && !0 !== entry)) : baseMark.attribute.stroke : baseMark.attribute.fill
|
|
143
|
-
}, textStyle), textData), text = this._createLabelText(labelAttribute)
|
|
144
|
-
|
|
148
|
+
}, textStyle), textData), text = this._createLabelText(labelAttribute);
|
|
149
|
+
labels.push(text);
|
|
150
|
+
}
|
|
151
|
+
return labels;
|
|
152
|
+
}
|
|
153
|
+
_layout(texts) {
|
|
154
|
+
const {position: position, offset: offset} = this.attribute;
|
|
155
|
+
for (let i = 0; i < texts.length; i++) {
|
|
156
|
+
const text = texts[i];
|
|
157
|
+
if (!text) return;
|
|
158
|
+
const textData = text.attribute, baseMark = this.getRelatedGraphic(textData);
|
|
159
|
+
if (!baseMark) continue;
|
|
160
|
+
text.attachedThemeGraphic = this;
|
|
161
|
+
const textBounds = this.getGraphicBounds(text);
|
|
162
|
+
text.attachedThemeGraphic = null;
|
|
163
|
+
const actualPosition = (0, vutils_1.isFunction)(position) ? position(textData) : position, graphicBounds = this._isCollectionBase ? this.getGraphicBounds(null, this._idToPoint.get(textData.id), actualPosition) : this.getGraphicBounds(baseMark, {
|
|
145
164
|
x: textData.x,
|
|
146
165
|
y: textData.y
|
|
147
166
|
}, actualPosition), textLocation = this.labeling(textBounds, graphicBounds, actualPosition, offset);
|
|
148
|
-
textLocation && (
|
|
149
|
-
text.setAttributes(textLocation)), labels.push(text);
|
|
167
|
+
textLocation && text.setAttributes(textLocation);
|
|
150
168
|
}
|
|
151
|
-
return
|
|
169
|
+
return texts;
|
|
152
170
|
}
|
|
153
171
|
_overlapping(labels) {
|
|
154
172
|
var _a, _b, _c, _d;
|
|
155
173
|
if (0 === labels.length) return [];
|
|
156
|
-
const option = this.attribute.overlap, result = [], baseMarkGroup = this.getBaseMarkGroup(), size = null !== (_a = option.size) && void 0 !== _a ? _a : {
|
|
174
|
+
const option = (0, vutils_1.isObject)(this.attribute.overlap) ? this.attribute.overlap : {}, result = [], baseMarkGroup = this.getBaseMarkGroup(), size = null !== (_a = option.size) && void 0 !== _a ? _a : {
|
|
157
175
|
width: null !== (_b = null == baseMarkGroup ? void 0 : baseMarkGroup.AABBBounds.width()) && void 0 !== _b ? _b : 0,
|
|
158
176
|
height: null !== (_c = null == baseMarkGroup ? void 0 : baseMarkGroup.AABBBounds.height()) && void 0 !== _c ? _c : 0
|
|
159
177
|
};
|
|
@@ -181,7 +199,7 @@ class LabelBase extends base_1.AbstractComponent {
|
|
|
181
199
|
bitmap.setRange((0, overlap_1.boundToRange)(bmpTool, text.AABBBounds, !0)), result.push(text);
|
|
182
200
|
continue;
|
|
183
201
|
}
|
|
184
|
-
if (checkBounds &&
|
|
202
|
+
if (checkBounds && baseMark && baseMark.AABBBounds && this._canPlaceInside(text.AABBBounds, baseMark.AABBBounds)) {
|
|
185
203
|
bitmap.setRange((0, overlap_1.boundToRange)(bmpTool, text.AABBBounds, !0)), result.push(text);
|
|
186
204
|
continue;
|
|
187
205
|
}
|
|
@@ -226,22 +244,35 @@ class LabelBase extends base_1.AbstractComponent {
|
|
|
226
244
|
if (baseMarkGroupName) return this.getRootNode().find((node => node.name === baseMarkGroupName), !0);
|
|
227
245
|
}
|
|
228
246
|
getGraphicBounds(graphic, point = {}) {
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
247
|
+
if (graphic) {
|
|
248
|
+
if (!1 !== graphic.attribute.visible) return graphic.AABBBounds;
|
|
249
|
+
const {x: x, y: y} = graphic.attribute;
|
|
250
|
+
return {
|
|
251
|
+
x1: x,
|
|
252
|
+
x2: x,
|
|
253
|
+
y1: y,
|
|
254
|
+
y2: y
|
|
255
|
+
};
|
|
256
|
+
}
|
|
257
|
+
const {x: x, y: y} = point;
|
|
258
|
+
return {
|
|
259
|
+
x1: x,
|
|
260
|
+
x2: x,
|
|
261
|
+
y1: y,
|
|
262
|
+
y2: y
|
|
234
263
|
};
|
|
235
264
|
}
|
|
236
265
|
_renderLabels(labels) {
|
|
237
266
|
!1 === this._enableAnimation || !1 === this.attribute.animation ? this._renderWithOutAnimation(labels) : this._renderWithAnimation(labels);
|
|
238
267
|
}
|
|
239
268
|
_renderWithAnimation(labels) {
|
|
240
|
-
|
|
269
|
+
var _a;
|
|
270
|
+
const currentTextMap = new Map, prevTextMap = this._graphicToText || new Map, texts = [], labelLines = [], {visible: showLabelLine} = null !== (_a = this.attribute.line) && void 0 !== _a ? _a : {};
|
|
241
271
|
labels.forEach(((text, index) => {
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
if (
|
|
272
|
+
const relatedGraphic = this.getRelatedGraphic(text.attribute), textId = text.attribute.id, textKey = this._isCollectionBase ? textId : relatedGraphic, state = (null == prevTextMap ? void 0 : prevTextMap.get(textKey)) ? "update" : "enter";
|
|
273
|
+
let labelLine;
|
|
274
|
+
if (showLabelLine && (labelLine = this._createLabelLine(text, relatedGraphic)),
|
|
275
|
+
"enter" === state) {
|
|
245
276
|
if (texts.push(text), currentTextMap.set(textKey, labelLine ? {
|
|
246
277
|
text: text,
|
|
247
278
|
labelLine: labelLine
|
|
@@ -249,8 +280,8 @@ class LabelBase extends base_1.AbstractComponent {
|
|
|
249
280
|
text: text
|
|
250
281
|
}), relatedGraphic) {
|
|
251
282
|
const {from: from, to: to} = (0, animate_1.getAnimationAttributes)(text.attribute, "fadeIn");
|
|
252
|
-
this.add(text), labelLine && (
|
|
253
|
-
this.
|
|
283
|
+
this.add(text), labelLine && (labelLines.push(labelLine), this.add(labelLine)),
|
|
284
|
+
this._syncStateWithRelatedGraphic(relatedGraphic), this._animationConfig.enter.duration > 0 && relatedGraphic.once("animate-bind", (a => {
|
|
254
285
|
text.setAttributes(from), labelLine && labelLine.setAttributes(from);
|
|
255
286
|
const listener = this._afterRelatedGraphicAttributeUpdate(text, texts, labelLine, labelLines, index, relatedGraphic, to, this._animationConfig.enter);
|
|
256
287
|
relatedGraphic.on("afterAttributeUpdate", listener);
|
|
@@ -260,25 +291,23 @@ class LabelBase extends base_1.AbstractComponent {
|
|
|
260
291
|
const prevLabel = prevTextMap.get(textKey);
|
|
261
292
|
prevTextMap.delete(textKey), currentTextMap.set(textKey, prevLabel);
|
|
262
293
|
const prevText = prevLabel.text, {duration: duration, easing: easing} = this._animationConfig.update;
|
|
263
|
-
(0, animate_1.updateAnimation)(prevText, text, this._animationConfig.update), prevLabel.labelLine && prevLabel.labelLine.animate().to(
|
|
264
|
-
vutils_1.merge)({}, prevLabel.labelLine.attribute, {
|
|
265
|
-
visible: null === (_f = null !== (_d = (null === (_b = null === (_a = text.attribute) || void 0 === _a ? void 0 : _a.line) || void 0 === _b ? void 0 : _b.visible) && (null === (_c = text.attribute) || void 0 === _c ? void 0 : _c.visible)) && void 0 !== _d ? _d : null === (_e = text.attribute) || void 0 === _e ? void 0 : _e.visible) || void 0 === _f || _f,
|
|
266
|
-
points: null === (_g = text.attribute) || void 0 === _g ? void 0 : _g.points
|
|
267
|
-
}), duration, easing);
|
|
294
|
+
(0, animate_1.updateAnimation)(prevText, text, this._animationConfig.update), prevLabel.labelLine && labelLine && prevLabel.labelLine.animate().to(labelLine.attribute, duration, easing);
|
|
268
295
|
}
|
|
269
296
|
})), prevTextMap.forEach((label => {
|
|
270
297
|
var _a;
|
|
271
298
|
null === (_a = label.text) || void 0 === _a || _a.animate().to((0, animate_1.getAnimationAttributes)(label.text.attribute, "fadeOut").to, this._animationConfig.exit.duration, this._animationConfig.exit.easing).onEnd((() => {
|
|
272
|
-
this.removeChild(label.text),
|
|
299
|
+
this.removeChild(label.text), label.labelLine && this.removeChild(label.labelLine);
|
|
273
300
|
}));
|
|
274
301
|
})), this._graphicToText = currentTextMap;
|
|
275
302
|
}
|
|
276
303
|
_renderWithOutAnimation(labels) {
|
|
277
|
-
|
|
304
|
+
var _a;
|
|
305
|
+
const currentTextMap = new Map, prevTextMap = this._graphicToText || new Map, texts = [], {visible: showLabelLine} = null !== (_a = this.attribute.line) && void 0 !== _a ? _a : {};
|
|
278
306
|
labels.forEach((text => {
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
if (
|
|
307
|
+
const relatedGraphic = this.getRelatedGraphic(text.attribute), state = (null == prevTextMap ? void 0 : prevTextMap.get(relatedGraphic)) ? "update" : "enter", textKey = this._isCollectionBase ? text.attribute.id : relatedGraphic;
|
|
308
|
+
let labelLine;
|
|
309
|
+
if (showLabelLine && (labelLine = this._createLabelLine(text, relatedGraphic)),
|
|
310
|
+
"enter" === state) texts.push(text), currentTextMap.set(textKey, labelLine ? {
|
|
282
311
|
text: text,
|
|
283
312
|
labelLine: labelLine
|
|
284
313
|
} : {
|
|
@@ -286,12 +315,10 @@ class LabelBase extends base_1.AbstractComponent {
|
|
|
286
315
|
}), this.add(text), labelLine && this.add(labelLine), this._syncStateWithRelatedGraphic(relatedGraphic); else if ("update" === state) {
|
|
287
316
|
const prevLabel = prevTextMap.get(textKey);
|
|
288
317
|
prevTextMap.delete(textKey), currentTextMap.set(textKey, prevLabel), prevLabel.text.setAttributes(text.attribute),
|
|
289
|
-
|
|
290
|
-
points: null === (_a = text.attribute) || void 0 === _a ? void 0 : _a.points
|
|
291
|
-
});
|
|
318
|
+
prevLabel.labelLine && labelLine && prevLabel.labelLine.setAttributes(labelLine.attribute);
|
|
292
319
|
}
|
|
293
320
|
})), prevTextMap.forEach((label => {
|
|
294
|
-
this.removeChild(label.text),
|
|
321
|
+
this.removeChild(label.text), label.labelLine && this.removeChild(label.labelLine);
|
|
295
322
|
})), this._graphicToText = currentTextMap;
|
|
296
323
|
}
|
|
297
324
|
_syncStateWithRelatedGraphic(relatedGraphic) {
|
|
@@ -341,7 +368,7 @@ class LabelBase extends base_1.AbstractComponent {
|
|
|
341
368
|
}
|
|
342
369
|
_smartInvert(labels) {
|
|
343
370
|
var _a, _b, _c, _d, _e;
|
|
344
|
-
const option = this.attribute.smartInvert
|
|
371
|
+
const option = (0, vutils_1.isObject)(this.attribute.smartInvert) ? this.attribute.smartInvert : {}, {textType: textType, contrastRatiosThreshold: contrastRatiosThreshold, alternativeColors: alternativeColors, mode: mode} = option, fillStrategy = null !== (_a = option.fillStrategy) && void 0 !== _a ? _a : "invertBase", strokeStrategy = null !== (_b = option.strokeStrategy) && void 0 !== _b ? _b : "base", brightColor = null !== (_c = option.brightColor) && void 0 !== _c ? _c : "#ffffff", darkColor = null !== (_d = option.darkColor) && void 0 !== _d ? _d : "#000000", outsideEnable = null !== (_e = option.outsideEnable) && void 0 !== _e && _e;
|
|
345
372
|
if ("null" !== fillStrategy || "null" !== strokeStrategy) for (let i = 0; i < labels.length; i++) {
|
|
346
373
|
const label = labels[i];
|
|
347
374
|
if (!label) continue;
|
|
@@ -358,7 +385,7 @@ class LabelBase extends base_1.AbstractComponent {
|
|
|
358
385
|
stroke: stroke
|
|
359
386
|
});
|
|
360
387
|
} else {
|
|
361
|
-
if (this._canPlaceInside(label.AABBBounds,
|
|
388
|
+
if (this._canPlaceInside(label.AABBBounds, baseMark.AABBBounds)) {
|
|
362
389
|
const fill = (0, label_smartInvert_1.smartInvertStrategy)(fillStrategy, baseColor, invertColor, similarColor);
|
|
363
390
|
if (fill && label.setAttributes({
|
|
364
391
|
fill: fill
|