@visactor/vrender-components 0.18.11-alpha.6 → 0.18.11-alpha.7
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 +9 -21
- package/cjs/axis/base.js.map +1 -1
- package/cjs/axis/circle.js +1 -1
- package/cjs/axis/circle.js.map +1 -1
- package/cjs/axis/grid/base.js +5 -1
- package/cjs/axis/grid/base.js.map +1 -1
- package/cjs/axis/index.d.ts +0 -1
- package/cjs/axis/index.js +1 -1
- package/cjs/axis/index.js.map +1 -1
- package/cjs/axis/line.js +5 -5
- package/cjs/axis/line.js.map +1 -1
- package/cjs/axis/mixin/circle.js +4 -2
- package/cjs/axis/mixin/circle.js.map +1 -1
- package/cjs/axis/overlap/auto-limit.js +13 -8
- package/cjs/axis/overlap/auto-limit.js.map +1 -1
- package/cjs/axis/util.d.ts +2 -5
- package/cjs/axis/util.js +5 -18
- package/cjs/axis/util.js.map +1 -1
- package/cjs/brush/brush.js +9 -11
- package/cjs/brush/brush.js.map +1 -1
- package/cjs/brush/type.js +1 -2
- package/cjs/checkbox/checkbox.d.ts +1 -1
- package/cjs/checkbox/checkbox.js +10 -9
- package/cjs/checkbox/checkbox.js.map +1 -1
- package/cjs/crosshair/polygon.js +2 -1
- package/cjs/index.d.ts +1 -1
- package/cjs/index.js +1 -1
- package/cjs/index.js.map +1 -1
- package/cjs/indicator/indicator.js +3 -3
- package/cjs/indicator/indicator.js.map +1 -1
- package/cjs/indicator/type.js +1 -1
- package/cjs/label/arc.d.ts +2 -2
- package/cjs/label/base.d.ts +2 -2
- package/cjs/label/base.js +1 -3
- package/cjs/label/base.js.map +1 -1
- package/cjs/label/index.js +1 -2
- package/cjs/label/type.js +2 -1
- package/cjs/label/util.js +2 -2
- package/cjs/legend/color/color.js +5 -7
- package/cjs/legend/color/color.js.map +1 -1
- package/cjs/legend/discrete/discrete.js +2 -4
- package/cjs/legend/discrete/discrete.js.map +1 -1
- package/cjs/legend/size/size.js +4 -6
- package/cjs/legend/size/size.js.map +1 -1
- package/cjs/marker/animate/animate.d.ts +13 -0
- package/cjs/marker/animate/animate.js +92 -0
- package/cjs/marker/animate/animate.js.map +1 -0
- package/cjs/marker/animate/call-in.d.ts +4 -0
- package/cjs/marker/animate/call-in.js +27 -0
- package/cjs/marker/animate/call-in.js.map +1 -0
- package/cjs/marker/animate/clip-in.d.ts +4 -0
- package/cjs/marker/animate/clip-in.js +23 -0
- package/cjs/marker/animate/clip-in.js.map +1 -0
- package/cjs/marker/animate/common.d.ts +9 -0
- package/cjs/marker/animate/common.js +48 -0
- package/cjs/marker/animate/common.js.map +1 -0
- package/cjs/marker/animate/fade-in.d.ts +7 -0
- package/cjs/marker/animate/fade-in.js +30 -0
- package/cjs/marker/animate/fade-in.js.map +1 -0
- package/cjs/marker/animate/fade-out.d.ts +7 -0
- package/cjs/marker/animate/fade-out.js +30 -0
- package/cjs/marker/animate/fade-out.js.map +1 -0
- package/cjs/marker/animate/index.js +3 -0
- package/cjs/marker/animate/index.js.map +1 -0
- package/cjs/marker/arc-area.d.ts +55 -0
- package/cjs/marker/arc-area.js +131 -0
- package/cjs/marker/arc-area.js.map +1 -0
- package/cjs/marker/arc-line.d.ts +25 -0
- package/cjs/marker/arc-line.js +106 -0
- package/cjs/marker/arc-line.js.map +1 -0
- package/cjs/marker/area.d.ts +14 -4
- package/cjs/marker/area.js +34 -21
- package/cjs/marker/area.js.map +1 -1
- package/cjs/marker/base.d.ts +21 -3
- package/cjs/marker/base.js +40 -5
- package/cjs/marker/base.js.map +1 -1
- package/cjs/marker/common-line.d.ts +22 -0
- package/cjs/marker/common-line.js +56 -0
- package/cjs/marker/common-line.js.map +1 -0
- package/cjs/marker/config.d.ts +79 -6
- package/cjs/marker/config.js +77 -37
- package/cjs/marker/config.js.map +1 -1
- package/cjs/marker/index.d.ts +2 -0
- package/cjs/marker/index.js +2 -1
- package/cjs/marker/index.js.map +1 -1
- package/cjs/marker/line.d.ts +24 -12
- package/cjs/marker/line.js +111 -45
- package/cjs/marker/line.js.map +1 -1
- package/cjs/marker/point.d.ts +8 -3
- package/cjs/marker/point.js +33 -9
- package/cjs/marker/point.js.map +1 -1
- package/cjs/marker/register.d.ts +2 -0
- package/cjs/marker/register.js +11 -2
- package/cjs/marker/register.js.map +1 -1
- package/cjs/marker/type.d.ts +102 -12
- package/cjs/marker/type.js +8 -2
- package/cjs/marker/type.js.map +1 -1
- package/cjs/pager/pager.js +2 -2
- package/cjs/pager/pager.js.map +1 -1
- package/cjs/player/base-player.d.ts +0 -2
- package/cjs/player/base-player.js +6 -11
- package/cjs/player/base-player.js.map +1 -1
- package/cjs/player/continuous-player.d.ts +1 -1
- package/cjs/player/continuous-player.js +4 -6
- package/cjs/player/continuous-player.js.map +1 -1
- package/cjs/player/controller/controller.js +4 -4
- package/cjs/player/controller/controller.js.map +1 -1
- package/cjs/player/discrete-player.d.ts +1 -1
- package/cjs/player/discrete-player.js +4 -6
- package/cjs/player/discrete-player.js.map +1 -1
- package/cjs/segment/arc-segment.d.ts +13 -0
- package/cjs/segment/arc-segment.js +51 -0
- package/cjs/segment/arc-segment.js.map +1 -0
- package/cjs/segment/index.d.ts +1 -0
- package/cjs/segment/index.js +2 -1
- package/cjs/segment/index.js.map +1 -1
- package/cjs/segment/register.d.ts +2 -1
- package/cjs/segment/register.js +8 -3
- package/cjs/segment/register.js.map +1 -1
- package/cjs/segment/segment.d.ts +9 -7
- package/cjs/segment/segment.js +12 -8
- package/cjs/segment/segment.js.map +1 -1
- package/cjs/segment/type.d.ts +24 -4
- package/cjs/segment/type.js.map +1 -1
- package/cjs/slider/slider.d.ts +0 -2
- package/cjs/slider/slider.js +38 -53
- package/cjs/slider/slider.js.map +1 -1
- package/cjs/slider/type.d.ts +0 -1
- package/cjs/slider/type.js.map +1 -1
- package/cjs/tag/tag.d.ts +5 -0
- package/cjs/tag/tag.js +14 -5
- package/cjs/tag/tag.js.map +1 -1
- package/cjs/util/interaction.d.ts +4 -0
- package/cjs/util/interaction.js +37 -0
- package/cjs/util/interaction.js.map +1 -0
- package/cjs/util/text.d.ts +1 -1
- package/cjs/util/text.js +7 -6
- package/cjs/util/text.js.map +1 -1
- package/es/axis/base.js +13 -23
- package/es/axis/base.js.map +1 -1
- package/es/axis/circle.js +2 -2
- package/es/axis/circle.js.map +1 -1
- package/es/axis/grid/base.js +6 -2
- package/es/axis/grid/base.js.map +1 -1
- package/es/axis/index.d.ts +0 -1
- package/es/axis/index.js +0 -2
- package/es/axis/index.js.map +1 -1
- package/es/axis/line.js +5 -5
- package/es/axis/line.js.map +1 -1
- package/es/axis/mixin/circle.js +3 -2
- package/es/axis/mixin/circle.js.map +1 -1
- package/es/axis/overlap/auto-limit.js +13 -9
- package/es/axis/overlap/auto-limit.js.map +1 -1
- package/es/axis/util.d.ts +2 -5
- package/es/axis/util.js +1 -15
- package/es/axis/util.js.map +1 -1
- package/es/brush/brush.js +9 -11
- package/es/brush/brush.js.map +1 -1
- package/es/brush/type.js +1 -2
- package/es/checkbox/checkbox.d.ts +1 -1
- package/es/checkbox/checkbox.js +10 -9
- package/es/checkbox/checkbox.js.map +1 -1
- package/es/crosshair/polygon.js +2 -1
- package/es/index.d.ts +1 -1
- package/es/index.js +1 -1
- package/es/index.js.map +1 -1
- package/es/indicator/indicator.js +3 -3
- package/es/indicator/indicator.js.map +1 -1
- package/es/indicator/type.js +1 -1
- package/es/label/arc.d.ts +2 -2
- package/es/label/base.d.ts +2 -2
- package/es/label/base.js +1 -3
- package/es/label/base.js.map +1 -1
- package/es/label/index.js +1 -2
- package/es/label/type.js +2 -1
- package/es/label/util.js +1 -1
- package/es/legend/color/color.js +5 -7
- package/es/legend/color/color.js.map +1 -1
- package/es/legend/discrete/discrete.js +2 -4
- package/es/legend/discrete/discrete.js.map +1 -1
- package/es/legend/size/size.js +4 -6
- package/es/legend/size/size.js.map +1 -1
- package/es/marker/animate/animate.d.ts +13 -0
- package/es/marker/animate/animate.js +92 -0
- package/es/marker/animate/animate.js.map +1 -0
- package/es/marker/animate/call-in.d.ts +4 -0
- package/es/marker/animate/call-in.js +17 -0
- package/es/marker/animate/call-in.js.map +1 -0
- package/es/marker/animate/clip-in.d.ts +4 -0
- package/es/marker/animate/clip-in.js +15 -0
- package/es/marker/animate/clip-in.js.map +1 -0
- package/es/marker/animate/common.d.ts +9 -0
- package/es/marker/animate/common.js +39 -0
- package/es/marker/animate/common.js.map +1 -0
- package/es/marker/animate/fade-in.d.ts +7 -0
- package/es/marker/animate/fade-in.js +20 -0
- package/es/marker/animate/fade-in.js.map +1 -0
- package/es/marker/animate/fade-out.d.ts +7 -0
- package/es/marker/animate/fade-out.js +20 -0
- package/es/marker/animate/fade-out.js.map +1 -0
- package/es/marker/animate/index.js +3 -0
- package/es/marker/animate/index.js.map +1 -0
- package/es/marker/arc-area.d.ts +55 -0
- package/es/marker/arc-area.js +143 -0
- package/es/marker/arc-area.js.map +1 -0
- package/es/marker/arc-line.d.ts +25 -0
- package/es/marker/arc-line.js +114 -0
- package/es/marker/arc-line.js.map +1 -0
- package/es/marker/area.d.ts +14 -4
- package/es/marker/area.js +36 -19
- package/es/marker/area.js.map +1 -1
- package/es/marker/base.d.ts +21 -3
- package/es/marker/base.js +43 -4
- package/es/marker/base.js.map +1 -1
- package/es/marker/common-line.d.ts +22 -0
- package/es/marker/common-line.js +58 -0
- package/es/marker/common-line.js.map +1 -0
- package/es/marker/config.d.ts +79 -6
- package/es/marker/config.js +79 -37
- package/es/marker/config.js.map +1 -1
- package/es/marker/index.d.ts +2 -0
- package/es/marker/index.js +4 -0
- package/es/marker/index.js.map +1 -1
- package/es/marker/line.d.ts +24 -12
- package/es/marker/line.js +116 -48
- package/es/marker/line.js.map +1 -1
- package/es/marker/point.d.ts +8 -3
- package/es/marker/point.js +34 -6
- package/es/marker/point.js.map +1 -1
- package/es/marker/register.d.ts +2 -0
- package/es/marker/register.js +10 -2
- package/es/marker/register.js.map +1 -1
- package/es/marker/type.d.ts +102 -12
- package/es/marker/type.js +9 -0
- package/es/marker/type.js.map +1 -1
- package/es/pager/pager.js +2 -2
- package/es/pager/pager.js.map +1 -1
- package/es/player/base-player.d.ts +0 -2
- package/es/player/base-player.js +6 -11
- package/es/player/base-player.js.map +1 -1
- package/es/player/continuous-player.d.ts +1 -1
- package/es/player/continuous-player.js +4 -6
- package/es/player/continuous-player.js.map +1 -1
- package/es/player/controller/controller.js +5 -5
- package/es/player/controller/controller.js.map +1 -1
- package/es/player/discrete-player.d.ts +1 -1
- package/es/player/discrete-player.js +4 -6
- package/es/player/discrete-player.js.map +1 -1
- package/es/segment/arc-segment.d.ts +13 -0
- package/es/segment/arc-segment.js +49 -0
- package/es/segment/arc-segment.js.map +1 -0
- package/es/segment/index.d.ts +1 -0
- package/es/segment/index.js +2 -0
- package/es/segment/index.js.map +1 -1
- package/es/segment/register.d.ts +2 -1
- package/es/segment/register.js +6 -2
- package/es/segment/register.js.map +1 -1
- package/es/segment/segment.d.ts +9 -7
- package/es/segment/segment.js +11 -8
- package/es/segment/segment.js.map +1 -1
- package/es/segment/type.d.ts +24 -4
- package/es/segment/type.js.map +1 -1
- package/es/slider/slider.d.ts +0 -2
- package/es/slider/slider.js +36 -50
- package/es/slider/slider.js.map +1 -1
- package/es/slider/type.d.ts +0 -1
- package/es/slider/type.js.map +1 -1
- package/es/tag/tag.d.ts +5 -0
- package/es/tag/tag.js +14 -5
- package/es/tag/tag.js.map +1 -1
- package/es/util/interaction.d.ts +4 -0
- package/es/util/interaction.js +30 -0
- package/es/util/interaction.js.map +1 -0
- package/es/util/text.d.ts +1 -1
- package/es/util/text.js +7 -6
- package/es/util/text.js.map +1 -1
- package/package.json +3 -3
- package/cjs/marker/util.js +0 -3
- package/cjs/marker/util.js.map +0 -1
- package/es/marker/util.js +0 -3
- package/es/marker/util.js.map +0 -1
- /package/cjs/marker/{util.d.ts → animate/index.d.ts} +0 -0
- /package/es/marker/{util.d.ts → animate/index.d.ts} +0 -0
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
import { isEmpty, merge } from "@visactor/vutils";
|
|
2
|
+
|
|
3
|
+
import { graphicCreator } from "@visactor/vrender-core";
|
|
4
|
+
|
|
5
|
+
import { loadArcSegmentComponent } from "./register";
|
|
6
|
+
|
|
7
|
+
import { Segment } from "./segment";
|
|
8
|
+
|
|
9
|
+
loadArcSegmentComponent();
|
|
10
|
+
|
|
11
|
+
export class ArcSegment extends Segment {
|
|
12
|
+
constructor(attributes, options) {
|
|
13
|
+
super((null == options ? void 0 : options.skipDefault) ? attributes : merge({}, Segment.defaultAttributes, attributes)),
|
|
14
|
+
this.name = "arc-segment";
|
|
15
|
+
}
|
|
16
|
+
getMainSegmentPoints() {
|
|
17
|
+
return this._mainSegmentPoints;
|
|
18
|
+
}
|
|
19
|
+
_computeRotate(angle) {
|
|
20
|
+
return angle + Math.PI;
|
|
21
|
+
}
|
|
22
|
+
render() {
|
|
23
|
+
this.removeAllChild(!0), this._reset();
|
|
24
|
+
const {startSymbol: startSymbol, endSymbol: endSymbol, lineStyle: lineStyle, state: state, visible: visible = !0, radius: radius, startAngle: startAngle, endAngle: endAngle, center: center} = this.attribute;
|
|
25
|
+
if (!visible) return;
|
|
26
|
+
this._startAngle = startAngle, this._endAngle = endAngle;
|
|
27
|
+
const startPoint = {
|
|
28
|
+
x: center.x + radius * Math.cos(this._startAngle),
|
|
29
|
+
y: center.y + radius * Math.sin(this._startAngle)
|
|
30
|
+
}, endPoint = {
|
|
31
|
+
x: center.x + radius * Math.cos(this._endAngle),
|
|
32
|
+
y: center.y + radius * Math.sin(this._endAngle)
|
|
33
|
+
};
|
|
34
|
+
this._mainSegmentPoints = [ startPoint, endPoint ];
|
|
35
|
+
const startSymbolShape = this._renderSymbol(startSymbol, this._mainSegmentPoints, "start"), endSymbolShape = this._renderSymbol(endSymbol, this._mainSegmentPoints, "end");
|
|
36
|
+
this.startSymbol = startSymbolShape, this.endSymbol = endSymbolShape;
|
|
37
|
+
const line = graphicCreator.arc(Object.assign({
|
|
38
|
+
x: center.x,
|
|
39
|
+
y: center.y,
|
|
40
|
+
startAngle: startAngle,
|
|
41
|
+
endAngle: endAngle,
|
|
42
|
+
innerRadius: radius,
|
|
43
|
+
outerRadius: radius
|
|
44
|
+
}, lineStyle));
|
|
45
|
+
line.name = `${this.name}-line`, line.id = this._getNodeId("arc"), isEmpty(null == state ? void 0 : state.line) || (line.states = [].concat(state.line)[0]),
|
|
46
|
+
this.add(line), this.line = line;
|
|
47
|
+
}
|
|
48
|
+
}
|
|
49
|
+
//# sourceMappingURL=arc-segment.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/segment/arc-segment.ts"],"names":[],"mappings":"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","file":"arc-segment.js","sourcesContent":["/**\n * @description 标签组件\n */\nimport { isEmpty, merge } from '@visactor/vutils';\nimport type { IArc } from '@visactor/vrender-core';\n// eslint-disable-next-line no-duplicate-imports\nimport { graphicCreator } from '@visactor/vrender-core';\nimport type { ArcSegmentAttributes, SymbolAttributes } from './type';\nimport type { Point } from '../core/type';\nimport type { ComponentOptions } from '../interface';\nimport { loadArcSegmentComponent } from './register';\nimport { Segment } from './segment';\n\nloadArcSegmentComponent();\nexport class ArcSegment extends Segment {\n name = 'arc-segment';\n line?: IArc;\n\n constructor(attributes: ArcSegmentAttributes, options?: ComponentOptions) {\n super(options?.skipDefault ? attributes : merge({}, Segment.defaultAttributes, attributes));\n }\n\n getMainSegmentPoints() {\n return this._mainSegmentPoints;\n }\n\n protected _computeRotate(angle: number) {\n return angle + Math.PI;\n }\n\n protected render() {\n this.removeAllChild(true);\n this._reset();\n const {\n // points,\n startSymbol,\n endSymbol,\n lineStyle,\n state,\n visible = true,\n radius,\n startAngle,\n endAngle,\n center\n } = this.attribute as ArcSegmentAttributes;\n\n if (!visible) {\n return;\n }\n\n this._startAngle = startAngle;\n this._endAngle = endAngle;\n\n // 绘制start和end symbol\n const startPoint: Point = {\n x: center.x + radius * Math.cos(this._startAngle),\n y: center.y + radius * Math.sin(this._startAngle)\n };\n const endPoint: Point = {\n x: center.x + radius * Math.cos(this._endAngle),\n y: center.y + radius * Math.sin(this._endAngle)\n };\n this._mainSegmentPoints = [startPoint, endPoint];\n\n const startSymbolShape = this._renderSymbol(startSymbol as SymbolAttributes, this._mainSegmentPoints, 'start');\n const endSymbolShape = this._renderSymbol(endSymbol as SymbolAttributes, this._mainSegmentPoints, 'end');\n\n this.startSymbol = startSymbolShape;\n this.endSymbol = endSymbolShape;\n\n const line = graphicCreator.arc({\n x: center.x,\n y: center.y,\n startAngle,\n endAngle,\n innerRadius: radius,\n outerRadius: radius,\n ...lineStyle\n });\n\n line.name = `${this.name}-line`;\n line.id = this._getNodeId('arc');\n if (!isEmpty(state?.line)) {\n line.states = [].concat(state.line)[0];\n }\n this.add(line);\n this.line = line;\n }\n}\n"]}
|
package/es/segment/index.d.ts
CHANGED
package/es/segment/index.js
CHANGED
package/es/segment/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/segment/index.ts"],"names":[],"mappings":"AAGA,cAAc,WAAW,CAAC;AAC1B,cAAc,QAAQ,CAAC","file":"index.js","sourcesContent":["/**\n * @description 线,两端可带箭头等 symbol\n */\nexport * from './segment';\nexport * from './type';\n"]}
|
|
1
|
+
{"version":3,"sources":["../src/segment/index.ts"],"names":[],"mappings":"AAGA,cAAc,WAAW,CAAC;AAC1B,cAAc,eAAe,CAAC;AAC9B,cAAc,QAAQ,CAAC","file":"index.js","sourcesContent":["/**\n * @description 线,两端可带箭头等 symbol\n */\nexport * from './segment';\nexport * from './arc-segment';\nexport * from './type';\n"]}
|
package/es/segment/register.d.ts
CHANGED
|
@@ -1 +1,2 @@
|
|
|
1
|
-
export declare function loadSegmentComponent(): void;
|
|
1
|
+
export declare function loadSegmentComponent(enableAnimation?: boolean): void;
|
|
2
|
+
export declare function loadArcSegmentComponent(enableAnimation?: boolean): void;
|
package/es/segment/register.js
CHANGED
|
@@ -1,6 +1,10 @@
|
|
|
1
|
-
import { registerGroup, registerLine, registerPolygon, registerSymbol } from "@visactor/vrender-kits";
|
|
1
|
+
import { registerGroup, registerLine, registerPolygon, registerSymbol, registerArc } from "@visactor/vrender-kits";
|
|
2
2
|
|
|
3
|
-
export function loadSegmentComponent() {
|
|
3
|
+
export function loadSegmentComponent(enableAnimation = !1) {
|
|
4
4
|
registerGroup(), registerLine(), registerPolygon(), registerSymbol();
|
|
5
5
|
}
|
|
6
|
+
|
|
7
|
+
export function loadArcSegmentComponent(enableAnimation = !1) {
|
|
8
|
+
registerGroup(), registerLine(), registerArc(), registerSymbol();
|
|
9
|
+
}
|
|
6
10
|
//# sourceMappingURL=register.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/segment/register.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,YAAY,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;
|
|
1
|
+
{"version":3,"sources":["../src/segment/register.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,YAAY,EAAE,eAAe,EAAE,cAAc,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAC;AAEnH,MAAM,UAAU,oBAAoB,CAAC,kBAA2B,KAAK;IACnE,aAAa,EAAE,CAAC;IAChB,YAAY,EAAE,CAAC;IACf,eAAe,EAAE,CAAC;IAClB,cAAc,EAAE,CAAC;AACnB,CAAC;AAED,MAAM,UAAU,uBAAuB,CAAC,kBAA2B,KAAK;IACtE,aAAa,EAAE,CAAC;IAChB,YAAY,EAAE,CAAC;IACf,WAAW,EAAE,CAAC;IACd,cAAc,EAAE,CAAC;AACnB,CAAC","file":"register.js","sourcesContent":["import { registerGroup, registerLine, registerPolygon, registerSymbol, registerArc } from '@visactor/vrender-kits';\n\nexport function loadSegmentComponent(enableAnimation: boolean = false) {\n registerGroup();\n registerLine();\n registerPolygon();\n registerSymbol();\n}\n\nexport function loadArcSegmentComponent(enableAnimation: boolean = false) {\n registerGroup();\n registerLine();\n registerArc();\n registerSymbol();\n}\n"]}
|
package/es/segment/segment.d.ts
CHANGED
|
@@ -1,24 +1,26 @@
|
|
|
1
|
-
import type { ISymbol } from '@visactor/vrender-core';
|
|
1
|
+
import type { ILine, ISymbol } from '@visactor/vrender-core';
|
|
2
2
|
import { AbstractComponent } from '../core/base';
|
|
3
|
-
import type { SegmentAttributes } from './type';
|
|
3
|
+
import type { SegmentAttributes, SymbolAttributes } from './type';
|
|
4
4
|
import type { Point } from '../core/type';
|
|
5
5
|
import type { ComponentOptions } from '../interface';
|
|
6
6
|
export declare class Segment extends AbstractComponent<Required<SegmentAttributes>> {
|
|
7
7
|
name: string;
|
|
8
8
|
startSymbol?: ISymbol;
|
|
9
9
|
endSymbol?: ISymbol;
|
|
10
|
-
|
|
10
|
+
lines?: ILine[];
|
|
11
|
+
protected _startAngle: number;
|
|
11
12
|
getStartAngle(): number;
|
|
12
|
-
|
|
13
|
+
protected _endAngle: number;
|
|
13
14
|
getEndAngle(): number;
|
|
14
|
-
|
|
15
|
+
protected _mainSegmentPoints: Point[];
|
|
15
16
|
getMainSegmentPoints(): Point[];
|
|
16
17
|
static defaultAttributes: Partial<SegmentAttributes>;
|
|
17
18
|
constructor(attributes: SegmentAttributes, options?: ComponentOptions);
|
|
18
19
|
protected render(): void;
|
|
19
|
-
|
|
20
|
+
protected _computeRotate(angle: number): number;
|
|
21
|
+
protected _renderSymbol(attribute: SymbolAttributes, points: Point[], dim: string): ISymbol | undefined;
|
|
20
22
|
private _getMainSegmentPoints;
|
|
21
23
|
private _clipPoints;
|
|
22
24
|
private _computeLineAngle;
|
|
23
|
-
|
|
25
|
+
protected _reset(): void;
|
|
24
26
|
}
|
package/es/segment/segment.js
CHANGED
|
@@ -20,14 +20,14 @@ export class Segment extends AbstractComponent {
|
|
|
20
20
|
}
|
|
21
21
|
constructor(attributes, options) {
|
|
22
22
|
super((null == options ? void 0 : options.skipDefault) ? attributes : merge({}, Segment.defaultAttributes, attributes)),
|
|
23
|
-
this.name = "segment";
|
|
23
|
+
this.name = "segment", this.lines = [];
|
|
24
24
|
}
|
|
25
25
|
render() {
|
|
26
26
|
this.removeAllChild(!0), this._reset();
|
|
27
27
|
const {startSymbol: startSymbol, endSymbol: endSymbol, lineStyle: lineStyle, state: state, visible: visible = !0, multiSegment: multiSegment, mainSegmentIndex: mainSegmentIndex} = this.attribute;
|
|
28
28
|
if (!visible) return;
|
|
29
29
|
this._computeLineAngle();
|
|
30
|
-
const startSymbolShape = this._renderSymbol(startSymbol, "start"), endSymbolShape = this._renderSymbol(endSymbol, "end");
|
|
30
|
+
const points = this._getMainSegmentPoints(), startSymbolShape = this._renderSymbol(startSymbol, points, "start"), endSymbolShape = this._renderSymbol(endSymbol, points, "end");
|
|
31
31
|
if (this.startSymbol = startSymbolShape, this.endSymbol = endSymbolShape, multiSegment) {
|
|
32
32
|
const points = [ ...this.attribute.points ];
|
|
33
33
|
if (isValidNumber(mainSegmentIndex)) points[mainSegmentIndex] = this._clipPoints(points[mainSegmentIndex]); else {
|
|
@@ -42,7 +42,7 @@ export class Segment extends AbstractComponent {
|
|
|
42
42
|
fill: !1
|
|
43
43
|
}));
|
|
44
44
|
line.name = `${this.name}-line`, line.id = this._getNodeId("line" + index), isEmpty(null == state ? void 0 : state.line) || (line.states = isArray(state.line) ? null !== (_b = state.line[index]) && void 0 !== _b ? _b : state.line[state.line.length - 1] : state.line),
|
|
45
|
-
this.add(line);
|
|
45
|
+
this.add(line), this.lines.push(line);
|
|
46
46
|
}));
|
|
47
47
|
} else {
|
|
48
48
|
let lineCreator = graphicCreator.line;
|
|
@@ -54,11 +54,13 @@ export class Segment extends AbstractComponent {
|
|
|
54
54
|
closePath: !1
|
|
55
55
|
}));
|
|
56
56
|
line.name = `${this.name}-line`, line.id = this._getNodeId("line"), isEmpty(null == state ? void 0 : state.line) || (line.states = [].concat(state.line)[0]),
|
|
57
|
-
this.add(line);
|
|
57
|
+
this.add(line), this.lines.push(line);
|
|
58
58
|
}
|
|
59
59
|
}
|
|
60
|
-
|
|
61
|
-
|
|
60
|
+
_computeRotate(angle) {
|
|
61
|
+
return angle + Math.PI / 2;
|
|
62
|
+
}
|
|
63
|
+
_renderSymbol(attribute, points, dim) {
|
|
62
64
|
if (!points.length) return;
|
|
63
65
|
const {autoRotate: autoRotate = !0} = attribute;
|
|
64
66
|
let symbol;
|
|
@@ -68,16 +70,17 @@ export class Segment extends AbstractComponent {
|
|
|
68
70
|
"start" === dim ? (position = {
|
|
69
71
|
x: start.x + (isValidNumber(startAngle) ? refX * Math.cos(startAngle) + refY * Math.cos(startAngle - Math.PI / 2) : 0),
|
|
70
72
|
y: start.y + (isValidNumber(startAngle) ? refX * Math.sin(startAngle) + refY * Math.sin(startAngle - Math.PI / 2) : 0)
|
|
71
|
-
}, rotate = startAngle
|
|
73
|
+
}, rotate = this._computeRotate(startAngle)) : (position = {
|
|
72
74
|
x: end.x + (isValidNumber(endAngle) ? refX * Math.cos(endAngle) + refY * Math.cos(endAngle - Math.PI / 2) : 0),
|
|
73
75
|
y: end.y + (isValidNumber(endAngle) ? refX * Math.sin(endAngle) + refY * Math.sin(endAngle - Math.PI / 2) : 0)
|
|
74
|
-
}, rotate = endAngle
|
|
76
|
+
}, rotate = this._computeRotate(endAngle)), symbol = graphicCreator.symbol(Object.assign(Object.assign(Object.assign({}, position), {
|
|
75
77
|
symbolType: symbolType,
|
|
76
78
|
size: size,
|
|
77
79
|
angle: autoRotate ? rotate + refAngle : 0,
|
|
78
80
|
strokeBoundsBuffer: 0
|
|
79
81
|
}), style)), symbol.name = `${this.name}-${dim}-symbol`, symbol.id = this._getNodeId(`${dim}-symbol`),
|
|
80
82
|
isEmpty(null == state ? void 0 : state.symbol) || (symbol.states = state.symbol),
|
|
83
|
+
"start" === dim ? isEmpty(null == state ? void 0 : state.startSymbol) || (symbol.states = state.startSymbol) : isEmpty(null == state ? void 0 : state.endSymbol) || (symbol.states = state.endSymbol),
|
|
81
84
|
this.add(symbol);
|
|
82
85
|
}
|
|
83
86
|
return symbol;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/segment/segment.ts"],"names":[],"mappings":"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","file":"segment.js","sourcesContent":["/**\n * @description 标签组件\n */\nimport { array, flattenArray, isArray, isEmpty, isValidNumber, merge } from '@visactor/vutils';\nimport type { ISymbol } from '@visactor/vrender-core';\nimport { graphicCreator } from '@visactor/vrender-core';\nimport { AbstractComponent } from '../core/base';\nimport type { ILineGraphicWithCornerRadius, SegmentAttributes, SymbolAttributes } from './type';\nimport type { Point } from '../core/type';\nimport type { ComponentOptions } from '../interface';\nimport { loadSegmentComponent } from './register';\n\nloadSegmentComponent();\nexport class Segment extends AbstractComponent<Required<SegmentAttributes>> {\n name = 'segment';\n\n startSymbol?: ISymbol;\n endSymbol?: ISymbol;\n\n private _startAngle!: number;\n /**\n * 外部获取segment起点正方向\n */\n getStartAngle() {\n return this._startAngle;\n }\n\n private _endAngle!: number;\n /**\n * 外部获取segment终点正方向\n */\n getEndAngle() {\n return this._endAngle;\n }\n\n private _mainSegmentPoints: Point[]; // 组成主线段的点\n getMainSegmentPoints() {\n return this._mainSegmentPoints;\n }\n\n static defaultAttributes: Partial<SegmentAttributes> = {\n visible: true,\n lineStyle: {\n lineWidth: 1,\n stroke: '#000'\n },\n startSymbol: {\n visible: false,\n autoRotate: true,\n symbolType: 'triangle',\n size: 12,\n refX: 0,\n refY: 0,\n refAngle: 0,\n style: {\n fill: '#000',\n zIndex: 1 // 默认 symbol 绘制在 line 上面\n }\n },\n endSymbol: {\n visible: false,\n autoRotate: true,\n symbolType: 'triangle',\n size: 12,\n refX: 0,\n refY: 0,\n refAngle: 0,\n style: {\n fill: '#000',\n zIndex: 1 // 默认 symbol 绘制在 line 上面\n }\n }\n };\n\n constructor(attributes: SegmentAttributes, options?: ComponentOptions) {\n super(options?.skipDefault ? attributes : merge({}, Segment.defaultAttributes, attributes));\n }\n\n protected render() {\n this.removeAllChild(true);\n this._reset();\n const {\n // points,\n startSymbol,\n endSymbol,\n lineStyle,\n state,\n visible = true,\n multiSegment,\n mainSegmentIndex\n } = this.attribute as SegmentAttributes;\n\n if (!visible) {\n return;\n }\n\n // 计算线的起点和终点角度\n // 计算角度的原因:\n // 1. segment symbol的自动旋转提供参数\n // 2. 使用segment时,需要根据line的角度对附加元素进行自动旋转(比如:markLine的标签, markPoint的装饰线)\n this._computeLineAngle();\n\n // 绘制start和end symbol\n const startSymbolShape = this._renderSymbol(startSymbol as SymbolAttributes, 'start');\n const endSymbolShape = this._renderSymbol(endSymbol as SymbolAttributes, 'end');\n\n this.startSymbol = startSymbolShape;\n this.endSymbol = endSymbolShape;\n\n if (multiSegment) {\n const points = [...this.attribute.points];\n if (isValidNumber(mainSegmentIndex)) {\n points[mainSegmentIndex] = this._clipPoints(points[mainSegmentIndex] as Point[]);\n } else {\n const clipPoints = this._clipPoints(flattenArray(points) as Point[]);\n points[0][0] = clipPoints[0];\n (points[points.length - 1] as Point[])[(points[points.length - 1] as Point[]).length - 1] =\n clipPoints[clipPoints.length - 1];\n }\n points.forEach((point: Point[], index) => {\n const line = graphicCreator.line({\n points: point,\n ...(isArray(lineStyle) ? lineStyle[index] ?? lineStyle[lineStyle.length - 1] : lineStyle),\n fill: false\n });\n\n line.name = `${this.name}-line`;\n line.id = this._getNodeId('line' + index);\n if (!isEmpty(state?.line)) {\n line.states = isArray(state.line) ? state.line[index] ?? state.line[state.line.length - 1] : state.line;\n }\n this.add(line);\n });\n } else {\n // 如果配置了cornerRadius, 则绘制polygon, 否则绘制line\n let lineCreator = graphicCreator.line;\n if ((array(lineStyle)[0] as ILineGraphicWithCornerRadius).cornerRadius) {\n lineCreator = graphicCreator.polygon;\n }\n const line = lineCreator({\n points: this._clipPoints(this.attribute.points as Point[]),\n ...array(lineStyle)[0],\n fill: false,\n closePath: false\n });\n\n line.name = `${this.name}-line`;\n line.id = this._getNodeId('line');\n if (!isEmpty(state?.line)) {\n line.states = [].concat(state.line)[0];\n }\n this.add(line);\n }\n }\n\n private _renderSymbol(attribute: SymbolAttributes, dim: string): ISymbol | undefined {\n const points = this._getMainSegmentPoints();\n if (!points.length) {\n return;\n }\n\n const { autoRotate = true } = attribute;\n let symbol;\n if (attribute && attribute.visible) {\n const startAngle = this._startAngle;\n const endAngle = this._endAngle;\n const { state } = this.attribute as SegmentAttributes;\n const start = points[0];\n const end = points[points.length - 1];\n const { refX = 0, refY = 0, refAngle = 0, style, symbolType, size = 12 } = attribute;\n let position;\n let rotate;\n if (dim === 'start') {\n position = {\n x:\n start.x +\n (isValidNumber(startAngle) ? refX * Math.cos(startAngle) + refY * Math.cos(startAngle - Math.PI / 2) : 0),\n y:\n start.y +\n (isValidNumber(startAngle) ? refX * Math.sin(startAngle) + refY * Math.sin(startAngle - Math.PI / 2) : 0)\n };\n rotate = startAngle + Math.PI / 2; // @chensiji - 加Math.PI / 2是因为:默认symbol的包围盒垂直于line,所以在做自动旋转时需要在line正方向基础上做90度偏移\n } else {\n position = {\n x:\n end.x + (isValidNumber(endAngle) ? refX * Math.cos(endAngle) + refY * Math.cos(endAngle - Math.PI / 2) : 0),\n y: end.y + (isValidNumber(endAngle) ? refX * Math.sin(endAngle) + refY * Math.sin(endAngle - Math.PI / 2) : 0)\n };\n rotate = endAngle + Math.PI / 2;\n }\n\n symbol = graphicCreator.symbol({\n ...position,\n symbolType: symbolType as string,\n size,\n angle: autoRotate ? rotate + refAngle : 0,\n strokeBoundsBuffer: 0,\n ...style\n });\n symbol.name = `${this.name}-${dim}-symbol`;\n symbol.id = this._getNodeId(`${dim}-symbol`);\n\n if (!isEmpty(state?.symbol)) {\n symbol.states = state.symbol;\n }\n\n this.add(symbol);\n }\n return symbol;\n }\n\n private _getMainSegmentPoints(): Point[] {\n if (this._mainSegmentPoints) {\n return this._mainSegmentPoints;\n }\n const { points: originPoints, multiSegment, mainSegmentIndex } = this.attribute as SegmentAttributes;\n\n let points: Point[];\n // 需要做下约束判断\n if (multiSegment) {\n if (isValidNumber(mainSegmentIndex)) {\n points = originPoints[mainSegmentIndex] as Point[];\n } else {\n points = flattenArray(originPoints);\n }\n } else {\n points = originPoints as Point[];\n }\n this._mainSegmentPoints = points;\n\n return points;\n }\n\n private _clipPoints(points: Point[]) {\n const { startSymbol = {} as SegmentAttributes['startSymbol'], endSymbol = {} as SegmentAttributes['endSymbol'] } =\n this.attribute as SegmentAttributes;\n // 通过改变line起点和终点的方式达到symbol在fill为false的情况下,也可以遮盖line的效果\n let pointsAfterClip = points;\n if (startSymbol.visible) {\n const startSize = startSymbol.clip ? startSymbol.size || 10 : 0;\n const pointsStart = {\n x: points[0].x - (startSize / 2) * (Math.cos(this._startAngle) || 0),\n y: points[0].y - (startSize / 2) * (Math.sin(this._startAngle) || 0)\n };\n pointsAfterClip = [pointsStart, ...pointsAfterClip.slice(1)];\n }\n if (endSymbol.visible) {\n const endSize = endSymbol.clip ? endSymbol.size || 10 : 0;\n const pointsEnd = {\n x: points[points.length - 1].x - (endSize / 2) * (Math.cos(this._endAngle) || 0),\n y: points[points.length - 1].y - (endSize / 2) * (Math.sin(this._endAngle) || 0)\n };\n pointsAfterClip = [...pointsAfterClip.slice(0, pointsAfterClip.length - 1), pointsEnd];\n }\n\n return pointsAfterClip;\n }\n\n private _computeLineAngle() {\n const points = this._getMainSegmentPoints();\n if (points.length <= 1) {\n return;\n }\n const start = points[0];\n const startInside = points[1];\n const endInside = points[points.length - 2];\n const end = points[points.length - 1];\n const startVector = [start.x - startInside.x, start.y - startInside.y]; // 起点正方向向量\n const startAngle = Math.atan2(startVector[1], startVector[0]); // 起点正方向角度\n const endVector = [end.x - endInside.x, end.y - endInside.y]; // 终点正方向向量\n const endAngle = Math.atan2(endVector[1], endVector[0]); // 终点正方向角度\n\n this._startAngle = startAngle;\n this._endAngle = endAngle;\n }\n\n private _reset() {\n this.startSymbol = null;\n this.endSymbol = null;\n this._startAngle = null;\n this._endAngle = null;\n this._mainSegmentPoints = null;\n }\n}\n"]}
|
|
1
|
+
{"version":3,"sources":["../src/segment/segment.ts"],"names":[],"mappings":"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","file":"segment.js","sourcesContent":["/**\n * @description 标签组件\n */\nimport { array, flattenArray, isArray, isEmpty, isValidNumber, merge } from '@visactor/vutils';\nimport type { ILine, ISymbol } from '@visactor/vrender-core';\n// eslint-disable-next-line no-duplicate-imports\nimport { graphicCreator } from '@visactor/vrender-core';\nimport { AbstractComponent } from '../core/base';\nimport type { ILineGraphicWithCornerRadius, SegmentAttributes, SymbolAttributes } from './type';\nimport type { Point } from '../core/type';\nimport type { ComponentOptions } from '../interface';\nimport { loadSegmentComponent } from './register';\n\nloadSegmentComponent();\nexport class Segment extends AbstractComponent<Required<SegmentAttributes>> {\n name = 'segment';\n\n startSymbol?: ISymbol;\n endSymbol?: ISymbol;\n lines?: ILine[] = [];\n // animate?: (startSymbol, endSymbol, lines) => void;\n\n protected _startAngle!: number;\n /**\n * 外部获取segment起点正方向\n */\n getStartAngle() {\n return this._startAngle;\n }\n\n protected _endAngle!: number;\n /**\n * 外部获取segment终点正方向\n */\n getEndAngle() {\n return this._endAngle;\n }\n\n protected _mainSegmentPoints: Point[]; // 组成主线段的点\n getMainSegmentPoints() {\n return this._mainSegmentPoints;\n }\n\n static defaultAttributes: Partial<SegmentAttributes> = {\n visible: true,\n lineStyle: {\n lineWidth: 1,\n stroke: '#000'\n },\n startSymbol: {\n visible: false,\n autoRotate: true,\n symbolType: 'triangle',\n size: 12,\n refX: 0,\n refY: 0,\n refAngle: 0,\n style: {\n fill: '#000',\n zIndex: 1 // 默认 symbol 绘制在 line 上面\n }\n },\n endSymbol: {\n visible: false,\n autoRotate: true,\n symbolType: 'triangle',\n size: 12,\n refX: 0,\n refY: 0,\n refAngle: 0,\n style: {\n fill: '#000',\n zIndex: 1 // 默认 symbol 绘制在 line 上面\n }\n }\n };\n\n constructor(attributes: SegmentAttributes, options?: ComponentOptions) {\n super(options?.skipDefault ? attributes : merge({}, Segment.defaultAttributes, attributes));\n }\n\n protected render() {\n this.removeAllChild(true);\n this._reset();\n const {\n // points,\n startSymbol,\n endSymbol,\n lineStyle,\n state,\n visible = true,\n multiSegment,\n mainSegmentIndex\n } = this.attribute as SegmentAttributes;\n\n if (!visible) {\n return;\n }\n\n // 计算线的起点和终点角度\n // 计算角度的原因:\n // 1. segment symbol的自动旋转提供参数\n // 2. 使用segment时,需要根据line的角度对附加元素进行自动旋转(比如:markLine的标签, markPoint的装饰线)\n this._computeLineAngle();\n\n // 绘制start和end symbol\n const points = this._getMainSegmentPoints();\n const startSymbolShape = this._renderSymbol(startSymbol as SymbolAttributes, points, 'start');\n const endSymbolShape = this._renderSymbol(endSymbol as SymbolAttributes, points, 'end');\n\n this.startSymbol = startSymbolShape;\n this.endSymbol = endSymbolShape;\n\n if (multiSegment) {\n const points = [...this.attribute.points];\n if (isValidNumber(mainSegmentIndex)) {\n points[mainSegmentIndex] = this._clipPoints(points[mainSegmentIndex] as Point[]);\n } else {\n const clipPoints = this._clipPoints(flattenArray(points) as Point[]);\n points[0][0] = clipPoints[0];\n (points[points.length - 1] as Point[])[(points[points.length - 1] as Point[]).length - 1] =\n clipPoints[clipPoints.length - 1];\n }\n points.forEach((point: Point[], index) => {\n const line = graphicCreator.line({\n points: point,\n ...(isArray(lineStyle) ? lineStyle[index] ?? lineStyle[lineStyle.length - 1] : lineStyle),\n fill: false\n });\n\n line.name = `${this.name}-line`;\n line.id = this._getNodeId('line' + index);\n if (!isEmpty(state?.line)) {\n line.states = isArray(state.line) ? state.line[index] ?? state.line[state.line.length - 1] : state.line;\n }\n this.add(line);\n this.lines.push(line);\n });\n } else {\n // 如果配置了cornerRadius, 则绘制polygon, 否则绘制line\n let lineCreator = graphicCreator.line;\n if ((array(lineStyle)[0] as ILineGraphicWithCornerRadius).cornerRadius) {\n lineCreator = graphicCreator.polygon;\n }\n const line = lineCreator({\n points: this._clipPoints(this.attribute.points as Point[]),\n ...array(lineStyle)[0],\n fill: false,\n closePath: false\n });\n\n line.name = `${this.name}-line`;\n line.id = this._getNodeId('line');\n if (!isEmpty(state?.line)) {\n line.states = [].concat(state.line)[0];\n }\n this.add(line);\n this.lines.push(line);\n }\n\n // if(Segment.animate) {\n // console.log('animate', this.animate)\n // Segment.animate(this.startSymbol, this.endSymbol, this.lines)\n // }\n }\n\n protected _computeRotate(angle: number) {\n return angle + Math.PI / 2;\n }\n\n protected _renderSymbol(attribute: SymbolAttributes, points: Point[], dim: string): ISymbol | undefined {\n if (!points.length) {\n return;\n }\n const { autoRotate = true } = attribute;\n let symbol;\n if (attribute && attribute.visible) {\n const startAngle = this._startAngle;\n const endAngle = this._endAngle;\n const { state } = this.attribute as SegmentAttributes;\n const start = points[0];\n const end = points[points.length - 1];\n const { refX = 0, refY = 0, refAngle = 0, style, symbolType, size = 12 } = attribute;\n let position;\n let rotate;\n if (dim === 'start') {\n position = {\n x:\n start.x +\n (isValidNumber(startAngle) ? refX * Math.cos(startAngle) + refY * Math.cos(startAngle - Math.PI / 2) : 0),\n y:\n start.y +\n (isValidNumber(startAngle) ? refX * Math.sin(startAngle) + refY * Math.sin(startAngle - Math.PI / 2) : 0)\n };\n rotate = this._computeRotate(startAngle); // @chensiji - 加Math.PI / 2是因为:默认symbol的包围盒垂直于line,所以在做自动旋转时需要在line正方向基础上做90度偏移\n } else {\n position = {\n x:\n end.x + (isValidNumber(endAngle) ? refX * Math.cos(endAngle) + refY * Math.cos(endAngle - Math.PI / 2) : 0),\n y: end.y + (isValidNumber(endAngle) ? refX * Math.sin(endAngle) + refY * Math.sin(endAngle - Math.PI / 2) : 0)\n };\n rotate = this._computeRotate(endAngle);\n }\n\n symbol = graphicCreator.symbol({\n ...position,\n symbolType: symbolType as string,\n size,\n angle: autoRotate ? rotate + refAngle : 0,\n strokeBoundsBuffer: 0,\n ...style\n });\n symbol.name = `${this.name}-${dim}-symbol`;\n symbol.id = this._getNodeId(`${dim}-symbol`);\n\n // 兼容旧逻辑, state.symbol同时应用到startSymbol和endSymbol\n if (!isEmpty(state?.symbol)) {\n symbol.states = state.symbol;\n }\n\n // 新逻辑, state.startSymbol和state.endSymbol做不同匹配\n if (dim === 'start') {\n if (!isEmpty(state?.startSymbol)) {\n symbol.states = state.startSymbol;\n }\n } else {\n if (!isEmpty(state?.endSymbol)) {\n symbol.states = state.endSymbol;\n }\n }\n\n this.add(symbol);\n }\n return symbol;\n }\n\n private _getMainSegmentPoints(): Point[] {\n if (this._mainSegmentPoints) {\n return this._mainSegmentPoints;\n }\n const { points: originPoints, multiSegment, mainSegmentIndex } = this.attribute as SegmentAttributes;\n\n let points: Point[];\n // 需要做下约束判断\n if (multiSegment) {\n if (isValidNumber(mainSegmentIndex)) {\n points = originPoints[mainSegmentIndex] as Point[];\n } else {\n points = flattenArray(originPoints);\n }\n } else {\n points = originPoints as Point[];\n }\n this._mainSegmentPoints = points;\n\n return points;\n }\n\n private _clipPoints(points: Point[]) {\n const { startSymbol = {} as SegmentAttributes['startSymbol'], endSymbol = {} as SegmentAttributes['endSymbol'] } =\n this.attribute as SegmentAttributes;\n // 通过改变line起点和终点的方式达到symbol在fill为false的情况下,也可以遮盖line的效果\n let pointsAfterClip = points;\n if (startSymbol.visible) {\n const startSize = startSymbol.clip ? startSymbol.size || 10 : 0;\n const pointsStart = {\n x: points[0].x - (startSize / 2) * (Math.cos(this._startAngle) || 0),\n y: points[0].y - (startSize / 2) * (Math.sin(this._startAngle) || 0)\n };\n pointsAfterClip = [pointsStart, ...pointsAfterClip.slice(1)];\n }\n if (endSymbol.visible) {\n const endSize = endSymbol.clip ? endSymbol.size || 10 : 0;\n const pointsEnd = {\n x: points[points.length - 1].x - (endSize / 2) * (Math.cos(this._endAngle) || 0),\n y: points[points.length - 1].y - (endSize / 2) * (Math.sin(this._endAngle) || 0)\n };\n pointsAfterClip = [...pointsAfterClip.slice(0, pointsAfterClip.length - 1), pointsEnd];\n }\n\n return pointsAfterClip;\n }\n\n private _computeLineAngle() {\n const points = this._getMainSegmentPoints();\n if (points.length <= 1) {\n return;\n }\n const start = points[0];\n const startInside = points[1];\n const endInside = points[points.length - 2];\n const end = points[points.length - 1];\n const startVector = [start.x - startInside.x, start.y - startInside.y]; // 起点正方向向量\n const startAngle = Math.atan2(startVector[1], startVector[0]); // 起点正方向角度\n const endVector = [end.x - endInside.x, end.y - endInside.y]; // 终点正方向向量\n const endAngle = Math.atan2(endVector[1], endVector[0]); // 终点正方向角度\n\n this._startAngle = startAngle;\n this._endAngle = endAngle;\n }\n\n protected _reset() {\n this.startSymbol = null;\n this.endSymbol = null;\n this._startAngle = null;\n this._endAngle = null;\n this._mainSegmentPoints = null;\n }\n}\n"]}
|
package/es/segment/type.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type { IGraphicAttribute, IGroupGraphicAttribute, ILineGraphicAttribute, ISymbolGraphicAttribute, SymbolType } from '@visactor/vrender-core';
|
|
1
|
+
import type { IArcGraphicAttribute, IGraphicAttribute, IGroupGraphicAttribute, ILineGraphicAttribute, ISymbolGraphicAttribute, SymbolType } from '@visactor/vrender-core';
|
|
2
2
|
import type { Point, State } from '../core/type';
|
|
3
3
|
export type SymbolAttributes = {
|
|
4
4
|
visible: boolean;
|
|
@@ -11,17 +11,37 @@ export type SymbolAttributes = {
|
|
|
11
11
|
clip?: boolean;
|
|
12
12
|
style?: Partial<IGraphicAttribute>;
|
|
13
13
|
};
|
|
14
|
-
export interface
|
|
14
|
+
export interface CommonSegmentAttributes extends IGroupGraphicAttribute {
|
|
15
15
|
visible?: boolean;
|
|
16
|
+
startSymbol?: SymbolAttributes;
|
|
17
|
+
endSymbol?: SymbolAttributes;
|
|
18
|
+
}
|
|
19
|
+
export interface SegmentAttributes extends CommonSegmentAttributes {
|
|
16
20
|
multiSegment?: boolean;
|
|
17
21
|
mainSegmentIndex?: number;
|
|
18
22
|
points: Point[] | Point[][];
|
|
19
|
-
startSymbol?: SymbolAttributes;
|
|
20
|
-
endSymbol?: SymbolAttributes;
|
|
21
23
|
lineStyle?: ILineGraphicWithCornerRadius | Partial<ILineGraphicAttribute>[];
|
|
22
24
|
state?: {
|
|
23
25
|
line?: State<ILineGraphicWithCornerRadius | Partial<ILineGraphicAttribute>[]>;
|
|
24
26
|
symbol?: State<Partial<ISymbolGraphicAttribute>>;
|
|
27
|
+
startSymbol?: State<Partial<ISymbolGraphicAttribute>>;
|
|
28
|
+
endSymbol?: State<Partial<ISymbolGraphicAttribute>>;
|
|
29
|
+
};
|
|
30
|
+
}
|
|
31
|
+
export interface ArcSegmentAttributes extends CommonSegmentAttributes {
|
|
32
|
+
center: {
|
|
33
|
+
x: number;
|
|
34
|
+
y: number;
|
|
35
|
+
};
|
|
36
|
+
radius: number;
|
|
37
|
+
startAngle: number;
|
|
38
|
+
endAngle: number;
|
|
39
|
+
lineStyle?: IArcGraphicAttribute;
|
|
40
|
+
state?: {
|
|
41
|
+
line?: State<IArcGraphicAttribute>;
|
|
42
|
+
symbol?: State<Partial<ISymbolGraphicAttribute>>;
|
|
43
|
+
startSymbol?: State<Partial<ISymbolGraphicAttribute>>;
|
|
44
|
+
endSymbol?: State<Partial<ISymbolGraphicAttribute>>;
|
|
25
45
|
};
|
|
26
46
|
}
|
|
27
47
|
export interface ILineGraphicWithCornerRadius extends Partial<ILineGraphicAttribute> {
|
package/es/segment/type.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/segment/type.ts"],"names":[],"mappings":"","file":"type.js","sourcesContent":["import type {\n IGraphicAttribute,\n IGroupGraphicAttribute,\n ILineGraphicAttribute,\n ISymbolGraphicAttribute,\n SymbolType\n} from '@visactor/vrender-core';\nimport type { Point, State } from '../core/type';\n\nexport type SymbolAttributes = {\n /** 是否展示 symbol */\n visible: boolean;\n /**\n * symbol 形状,默认为带左右方向的箭头\n */\n symbolType?: SymbolType;\n /**\n * symbol 大小\n */\n size?: number;\n /**\n * 自动旋转,沿着线的方向,默认 true\n */\n autoRotate?: boolean;\n /**\n * symbol 相对line平行方向上的偏移\n */\n refX?: number;\n /**\n * symbol 相对line正交方向上的偏移\n */\n refY?: number;\n /**\n * symbol 相对默认角度的偏移\n * @description (@chensiji: 默认角度为笛卡尔坐标系y正方向,即默认symbol包围盒的角度为笛卡尔坐标系y正方向, 做自动旋转时, 会在此基础上,将包围盒转换到line平行方向上。)\n */\n refAngle?: number;\n /**\n * symbol 是否clip line,即当symbol fill为false时,line在symbol内部的部分是否展示\n * @defalut false\n */\n clip?: boolean;\n /**\n * symbol 样式配置\n */\n style?: Partial<IGraphicAttribute>;\n};\n\nexport interface
|
|
1
|
+
{"version":3,"sources":["../src/segment/type.ts"],"names":[],"mappings":"","file":"type.js","sourcesContent":["import type {\n IArcGraphicAttribute,\n IGraphicAttribute,\n IGroupGraphicAttribute,\n ILineGraphicAttribute,\n ISymbolGraphicAttribute,\n SymbolType\n} from '@visactor/vrender-core';\nimport type { Point, State } from '../core/type';\n\nexport type SymbolAttributes = {\n /** 是否展示 symbol */\n visible: boolean;\n /**\n * symbol 形状,默认为带左右方向的箭头\n */\n symbolType?: SymbolType;\n /**\n * symbol 大小\n */\n size?: number;\n /**\n * 自动旋转,沿着线的方向,默认 true\n */\n autoRotate?: boolean;\n /**\n * symbol 相对line平行方向上的偏移\n */\n refX?: number;\n /**\n * symbol 相对line正交方向上的偏移\n */\n refY?: number;\n /**\n * symbol 相对默认角度的偏移\n * @description (@chensiji: 默认角度为笛卡尔坐标系y正方向,即默认symbol包围盒的角度为笛卡尔坐标系y正方向, 做自动旋转时, 会在此基础上,将包围盒转换到line平行方向上。)\n */\n refAngle?: number;\n /**\n * symbol 是否clip line,即当symbol fill为false时,line在symbol内部的部分是否展示\n * @defalut false\n */\n clip?: boolean;\n /**\n * symbol 样式配置\n */\n style?: Partial<IGraphicAttribute>;\n};\n\nexport interface CommonSegmentAttributes extends IGroupGraphicAttribute {\n /**\n * 可见性\n * @default true\n */\n visible?: boolean;\n /** 轴线起始点 symbol 配置 */\n startSymbol?: SymbolAttributes;\n /** 轴线末端 symbol 配置 */\n endSymbol?: SymbolAttributes;\n}\nexport interface SegmentAttributes extends CommonSegmentAttributes {\n /**\n * 是否对 points 进行多段处理,默认为 false,即直接将所有的点连接成线。\n * 如果需要进行多段处理,需要将 points 属性配置为 Point[][] 类型\n * @default false\n */\n multiSegment?: boolean;\n /**\n * 在 `multiSegment` 属性开启的前提下,用于声明那一段线段用来作为主线段,如果不声明,默认全段为主线段\n */\n mainSegmentIndex?: number;\n points: Point[] | Point[][];\n /**\n * 线样式配置\n */\n lineStyle?: ILineGraphicWithCornerRadius | Partial<ILineGraphicAttribute>[];\n /**\n * 图元状态\n */\n state?: {\n line?: State<ILineGraphicWithCornerRadius | Partial<ILineGraphicAttribute>[]>;\n symbol?: State<Partial<ISymbolGraphicAttribute>>;\n startSymbol?: State<Partial<ISymbolGraphicAttribute>>;\n endSymbol?: State<Partial<ISymbolGraphicAttribute>>;\n };\n}\n\nexport interface ArcSegmentAttributes extends CommonSegmentAttributes {\n /**\n * 弧线中心位置\n */\n center: {\n x: number;\n y: number;\n };\n /**\n * 弧线半径\n */\n radius: number;\n /**\n * 弧线起始角度(弧度)\n */\n startAngle: number;\n /**\n * 弧线终点角度(弧度)\n */\n endAngle: number;\n /**\n * 线样式配置\n */\n lineStyle?: IArcGraphicAttribute;\n /**\n * 图元状态\n */\n state?: {\n line?: State<IArcGraphicAttribute>;\n symbol?: State<Partial<ISymbolGraphicAttribute>>;\n startSymbol?: State<Partial<ISymbolGraphicAttribute>>;\n endSymbol?: State<Partial<ISymbolGraphicAttribute>>;\n };\n}\n\nexport interface ILineGraphicWithCornerRadius extends Partial<ILineGraphicAttribute> {\n /**\n * 折现拐角处的圆角配置\n */\n cornerRadius?: number;\n}\n"]}
|
package/es/slider/slider.d.ts
CHANGED
|
@@ -92,8 +92,6 @@ export declare class Slider extends AbstractComponent<Required<SliderAttributes>
|
|
|
92
92
|
get endHandler(): ISymbol;
|
|
93
93
|
get tooltipShape(): ISymbol;
|
|
94
94
|
constructor(attributes: SliderAttributes, options?: ComponentOptions);
|
|
95
|
-
protected calculatePosByValue(value: number, pos?: 'start' | 'end'): number;
|
|
96
|
-
protected calculateValueByPos(pos: number): number;
|
|
97
95
|
setValue(value: number | number[]): void;
|
|
98
96
|
render(): void;
|
|
99
97
|
protected _renderRail(container: IGroup): import("@visactor/vrender-core").IRect;
|
package/es/slider/slider.js
CHANGED
|
@@ -44,8 +44,8 @@ export class Slider extends AbstractComponent {
|
|
|
44
44
|
}, this._onTooltipUpdate(e), this._dispatchTooltipEvent("sliderTooltipShow"));
|
|
45
45
|
}, this._onTooltipUpdate = e => {
|
|
46
46
|
if (this._isChanging || !this._tooltipState || !this._tooltipState.isActive) return;
|
|
47
|
-
const
|
|
48
|
-
pos !== this._tooltipState.pos && (this._tooltipState.pos = pos, this._tooltipState.value =
|
|
47
|
+
const {min: min, max: max} = this.attribute, pos = clamp(this._isHorizontal ? (e.viewX - this._rail.globalAABBBounds.x1) / this._rail.globalAABBBounds.width() : (e.viewY - this._rail.globalAABBBounds.y1) / this._rail.globalAABBBounds.height(), 0, 1);
|
|
48
|
+
pos !== this._tooltipState.pos && (this._tooltipState.pos = pos, this._tooltipState.value = min + (max - min) * pos,
|
|
49
49
|
this._updateTooltip(), this._dispatchTooltipEvent("sliderTooltipUpdate"));
|
|
50
50
|
}, this._onTooltipHide = () => {
|
|
51
51
|
const {tooltip: tooltip} = this.attribute;
|
|
@@ -69,7 +69,7 @@ export class Slider extends AbstractComponent {
|
|
|
69
69
|
railLen = railWidth) : (currentPos = e.clientY, delta = currentPos - this._prePos,
|
|
70
70
|
originPos = null === (_a = this._currentHandler) || void 0 === _a ? void 0 : _a.attribute.y,
|
|
71
71
|
railLen = railHeight);
|
|
72
|
-
const newPos = clamp(originPos + delta, 0, railLen), currentValue =
|
|
72
|
+
const newPos = clamp(originPos + delta, 0, railLen), currentValue = newPos / railLen * (max - min) + min;
|
|
73
73
|
"text" === this._currentHandler.type ? this._updateHandlerText(this._currentHandler, newPos, currentValue) : this._updateHandler(this._currentHandler, newPos, currentValue),
|
|
74
74
|
this._updateTrack(), this._prePos = currentPos, this._dispatchChangeEvent();
|
|
75
75
|
}, this._onHandlerPointerUp = e => {
|
|
@@ -87,7 +87,7 @@ export class Slider extends AbstractComponent {
|
|
|
87
87
|
}), this.stage.addEventListener("pointerup", this._onTrackPointerUp), this.stage.addEventListener("pointerupoutside", this._onTrackPointerUp));
|
|
88
88
|
}, this._onTrackPointerMove = e => {
|
|
89
89
|
e.stopPropagation(), this._isChanging = !0;
|
|
90
|
-
const {railWidth: railWidth, railHeight: railHeight, min: min, max: max
|
|
90
|
+
const {railWidth: railWidth, railHeight: railHeight, min: min, max: max} = this.attribute;
|
|
91
91
|
if (max === min) return;
|
|
92
92
|
const {startHandler: startHandler, endHandler: endHandler} = this._getHandlers();
|
|
93
93
|
let currentPos, trackLen, railLen;
|
|
@@ -96,11 +96,11 @@ export class Slider extends AbstractComponent {
|
|
|
96
96
|
railLen = railHeight);
|
|
97
97
|
const delta = currentPos - this._prePos;
|
|
98
98
|
if (startHandler) {
|
|
99
|
-
const originPos = this._isHorizontal ? startHandler.attribute.x : startHandler.attribute.y, newPos =
|
|
99
|
+
const originPos = this._isHorizontal ? startHandler.attribute.x : startHandler.attribute.y, newPos = clamp(originPos + delta, 0, railLen - trackLen), currentValue = newPos / railLen * (max - min) + min;
|
|
100
100
|
this._updateHandler(startHandler, newPos, currentValue);
|
|
101
101
|
}
|
|
102
102
|
if (endHandler) {
|
|
103
|
-
const originPos = this._isHorizontal ? endHandler.attribute.x : endHandler.attribute.y, newPos =
|
|
103
|
+
const originPos = this._isHorizontal ? endHandler.attribute.x : endHandler.attribute.y, newPos = clamp(originPos + delta, trackLen, railLen), currentValue = newPos / railLen * (max - min) + min, startHandlerAttribute = null == startHandler ? void 0 : startHandler.attribute;
|
|
104
104
|
this._updateHandler(endHandler, newPos, currentValue), this._track.setAttributes(this._isHorizontal ? {
|
|
105
105
|
x: Math.min(startHandlerAttribute.x, endHandler.attribute.x),
|
|
106
106
|
width: Math.abs(startHandlerAttribute.x - endHandler.attribute.x)
|
|
@@ -126,7 +126,7 @@ export class Slider extends AbstractComponent {
|
|
|
126
126
|
endHandlerPos = null == endHandler ? void 0 : endHandler.attribute.x, railLen = railWidth) : (currentPos = e.viewY - this._rail.globalAABBBounds.y1,
|
|
127
127
|
startHandlerPos = null == startHandler ? void 0 : startHandler.attribute.y, endHandlerPos = null == endHandler ? void 0 : endHandler.attribute.y,
|
|
128
128
|
railLen = railHeight);
|
|
129
|
-
const currentValue =
|
|
129
|
+
const currentValue = currentPos / railLen * (max - min) + min;
|
|
130
130
|
if (isValid(endHandlerPos)) {
|
|
131
131
|
const updateHandler = Math.abs(currentPos - startHandlerPos) > Math.abs(currentPos - endHandlerPos) ? endHandler : startHandler;
|
|
132
132
|
this._updateHandler(updateHandler, currentPos, currentValue);
|
|
@@ -134,22 +134,14 @@ export class Slider extends AbstractComponent {
|
|
|
134
134
|
this._updateTrack(), this._dispatchChangeEvent();
|
|
135
135
|
};
|
|
136
136
|
}
|
|
137
|
-
calculatePosByValue(value, pos) {
|
|
138
|
-
const {layout: layout, railWidth: railWidth, railHeight: railHeight, min: min, max: max, inverse: inverse} = this.attribute;
|
|
139
|
-
let ratio = 0;
|
|
140
|
-
ratio = min === max ? "start" === pos ? 0 : "end" === pos ? 1 : 0 : (value - min) / (max - min);
|
|
141
|
-
return (inverse ? 1 - ratio : ratio) * ("vertical" === layout ? railHeight : railWidth);
|
|
142
|
-
}
|
|
143
|
-
calculateValueByPos(pos) {
|
|
144
|
-
const {layout: layout, railWidth: railWidth, railHeight: railHeight, min: min, max: max, inverse: inverse} = this.attribute, railLen = "vertical" === layout ? railHeight : railWidth;
|
|
145
|
-
return min + (max - min) * (inverse ? 1 - pos / railLen : pos / railLen);
|
|
146
|
-
}
|
|
147
137
|
setValue(value) {
|
|
148
|
-
const {min: min, max: max} = this.attribute;
|
|
138
|
+
const {layout: layout, railWidth: railWidth, railHeight: railHeight, min: min, max: max} = this.attribute;
|
|
149
139
|
if (max === min) return;
|
|
150
|
-
const [startValue, endValue] = array(value), {startHandler: startHandler, endHandler: endHandler} = this._getHandlers();
|
|
151
|
-
startHandler && this._updateHandler(startHandler,
|
|
152
|
-
|
|
140
|
+
const [startValue, endValue] = array(value), {startHandler: startHandler, endHandler: endHandler} = this._getHandlers(), railLen = "vertical" === layout ? railHeight : railWidth, startPos = (startValue - min) / (max - min) * railLen;
|
|
141
|
+
if (startHandler && this._updateHandler(startHandler, startPos, startValue), endHandler) {
|
|
142
|
+
const endPos = (endValue - min) / (max - min) * railLen;
|
|
143
|
+
this._updateHandler(endHandler, endPos, endValue);
|
|
144
|
+
}
|
|
153
145
|
this._updateTrack();
|
|
154
146
|
}
|
|
155
147
|
render() {
|
|
@@ -225,29 +217,29 @@ export class Slider extends AbstractComponent {
|
|
|
225
217
|
const {range: range, min: min, max: max, handlerSize: handlerSize = 14, handlerStyle: handlerStyle, handlerText: handlerText, railHeight: railHeight, railWidth: railWidth, slidable: slidable} = this.attribute;
|
|
226
218
|
let {value: value} = this.attribute;
|
|
227
219
|
isNil(value) && (value = [ min, max ]);
|
|
228
|
-
const handlerTextVisible = handlerText && handlerText.visible, isHorizontal = this._isHorizontal, [startValue, endValue] = convertValueToRange(value),
|
|
229
|
-
x: isHorizontal ?
|
|
230
|
-
y: isHorizontal ? railHeight / 2 :
|
|
220
|
+
const handlerTextVisible = handlerText && handlerText.visible, isHorizontal = this._isHorizontal, railLen = isHorizontal ? railWidth : railHeight, [startValue, endValue] = convertValueToRange(value), handlerStart = max === min ? range ? 0 : railLen : (startValue - min) / (max - min) * railLen, startHandler = this._renderHandler(Object.assign({
|
|
221
|
+
x: isHorizontal ? handlerStart : railWidth / 2,
|
|
222
|
+
y: isHorizontal ? railHeight / 2 : handlerStart,
|
|
231
223
|
size: handlerSize,
|
|
232
224
|
strokeBoundsBuffer: 0,
|
|
233
225
|
cursor: !1 === slidable ? "default" : getDefaultCursor(isHorizontal)
|
|
234
226
|
}, handlerStyle));
|
|
235
227
|
if (startHandler.name = SLIDER_ELEMENT_NAME.startHandler, this._startHandler = startHandler,
|
|
236
|
-
container.add(startHandler), this._currentValue.startPos =
|
|
228
|
+
container.add(startHandler), this._currentValue.startPos = handlerStart, handlerTextVisible) {
|
|
237
229
|
const startHandlerText = this._renderHandlerText(startValue, range ? "start" : "end");
|
|
238
230
|
startHandlerText.name = SLIDER_ELEMENT_NAME.startHandlerText, container.add(startHandlerText),
|
|
239
231
|
this._startHandlerText = startHandlerText;
|
|
240
232
|
}
|
|
241
233
|
if (range) {
|
|
242
|
-
const
|
|
243
|
-
x: isHorizontal ?
|
|
244
|
-
y: isHorizontal ? railHeight / 2 :
|
|
234
|
+
const handlerEnd = max === min ? railLen : (endValue - min) / (max - min) * railLen, endHandler = this._renderHandler(Object.assign({
|
|
235
|
+
x: isHorizontal ? handlerEnd : railWidth / 2,
|
|
236
|
+
y: isHorizontal ? railHeight / 2 : handlerEnd,
|
|
245
237
|
size: handlerSize,
|
|
246
238
|
strokeBoundsBuffer: 0,
|
|
247
239
|
cursor: !1 === slidable ? "default" : getDefaultCursor(isHorizontal)
|
|
248
240
|
}, handlerStyle));
|
|
249
241
|
if (endHandler.name = SLIDER_ELEMENT_NAME.endHandler, this._endHandler = endHandler,
|
|
250
|
-
container.add(endHandler), this._currentValue.endPos =
|
|
242
|
+
container.add(endHandler), this._currentValue.endPos = handlerEnd, handlerTextVisible) {
|
|
251
243
|
const endHandlerText = this._renderHandlerText(endValue, "end");
|
|
252
244
|
endHandlerText.name = SLIDER_ELEMENT_NAME.endHandlerText, container.add(endHandlerText),
|
|
253
245
|
this._endHandlerText = endHandlerText;
|
|
@@ -261,7 +253,7 @@ export class Slider extends AbstractComponent {
|
|
|
261
253
|
const clampValue = clampRange(value, min, max);
|
|
262
254
|
startValue = clampValue[0], endValue = clampValue[1];
|
|
263
255
|
} else startValue = min, endValue = clamp(value, min, max);
|
|
264
|
-
const isHorizontal = this._isHorizontal;
|
|
256
|
+
const isHorizontal = this._isHorizontal, railLen = isHorizontal ? railWidth : railHeight;
|
|
265
257
|
range || (startValue = min);
|
|
266
258
|
const trackContainer = graphicCreator.group({
|
|
267
259
|
x: 0,
|
|
@@ -276,11 +268,11 @@ export class Slider extends AbstractComponent {
|
|
|
276
268
|
const draggableTrack = isObject(range) && !0 === range.draggableTrack;
|
|
277
269
|
let cursor;
|
|
278
270
|
cursor = !1 === slidable ? "default" : !1 === range || !1 === draggableTrack ? "pointer" : getDefaultCursor(isHorizontal);
|
|
279
|
-
const
|
|
280
|
-
x: isHorizontal ?
|
|
281
|
-
y: isHorizontal ? 0 :
|
|
282
|
-
width: isHorizontal ?
|
|
283
|
-
height: isHorizontal ? railHeight :
|
|
271
|
+
const trackWidth = max === min ? railLen : (endValue - startValue) / (max - min) * railLen, startPos = max === min ? 0 : (startValue - min) / (max - min) * railLen, track = graphicCreator.rect(Object.assign({
|
|
272
|
+
x: isHorizontal ? startPos : 0,
|
|
273
|
+
y: isHorizontal ? 0 : startPos,
|
|
274
|
+
width: isHorizontal ? trackWidth : railWidth,
|
|
275
|
+
height: isHorizontal ? railHeight : trackWidth,
|
|
284
276
|
cursor: cursor
|
|
285
277
|
}, trackStyle));
|
|
286
278
|
track.name = SLIDER_ELEMENT_NAME.track, this._track = track, trackContainer.add(track),
|
|
@@ -291,17 +283,17 @@ export class Slider extends AbstractComponent {
|
|
|
291
283
|
}
|
|
292
284
|
_renderHandlerText(value, position) {
|
|
293
285
|
var _a, _b, _c;
|
|
294
|
-
const {align: align, handlerSize: handlerSize = 14, handlerText: handlerText = {}, railHeight: railHeight, railWidth: railWidth, slidable: slidable} = this.attribute, isHorizontal = this._isHorizontal,
|
|
286
|
+
const {align: align, min: min, max: max, handlerSize: handlerSize = 14, handlerText: handlerText = {}, railHeight: railHeight, railWidth: railWidth, slidable: slidable} = this.attribute, isHorizontal = this._isHorizontal, railLen = isHorizontal ? railWidth : railHeight, handlerStart = max === min ? "start" === position ? 0 : railLen : (value - min) / (max - min) * railLen, textSpace = null !== (_a = handlerText.space) && void 0 !== _a ? _a : 4, textStyle = {
|
|
295
287
|
text: handlerText.formatter ? handlerText.formatter(value) : value.toFixed(null !== (_b = handlerText.precision) && void 0 !== _b ? _b : 0),
|
|
296
288
|
lineHeight: null === (_c = handlerText.style) || void 0 === _c ? void 0 : _c.lineHeight,
|
|
297
289
|
cursor: !1 === slidable ? "default" : getDefaultCursor(isHorizontal)
|
|
298
290
|
};
|
|
299
291
|
isHorizontal ? "top" === align ? (textStyle.textBaseline = "bottom", textStyle.textAlign = "center",
|
|
300
|
-
textStyle.x =
|
|
301
|
-
textStyle.textAlign = "center", textStyle.x =
|
|
292
|
+
textStyle.x = handlerStart, textStyle.y = (railHeight - handlerSize) / 2 - textSpace) : (textStyle.textBaseline = "top",
|
|
293
|
+
textStyle.textAlign = "center", textStyle.x = handlerStart, textStyle.y = (railHeight + handlerSize) / 2 + textSpace) : "left" === align ? (textStyle.textBaseline = "middle",
|
|
302
294
|
textStyle.textAlign = "end", textStyle.x = (railWidth - handlerSize) / 2 - textSpace,
|
|
303
|
-
textStyle.y =
|
|
304
|
-
textStyle.x = (railWidth + handlerSize) / 2 + textSpace, textStyle.y =
|
|
295
|
+
textStyle.y = handlerStart) : (textStyle.textBaseline = "middle", textStyle.textAlign = "start",
|
|
296
|
+
textStyle.x = (railWidth + handlerSize) / 2 + textSpace, textStyle.y = handlerStart);
|
|
305
297
|
return graphicCreator.text(Object.assign(Object.assign({}, textStyle), handlerText.style));
|
|
306
298
|
}
|
|
307
299
|
_renderTooltip() {
|
|
@@ -337,7 +329,7 @@ export class Slider extends AbstractComponent {
|
|
|
337
329
|
_updateTooltip() {
|
|
338
330
|
var _a, _b;
|
|
339
331
|
if (!this._tooltipShape && !this._tooltipText || !this._tooltipState) return;
|
|
340
|
-
const
|
|
332
|
+
const coord = this._isHorizontal ? this._tooltipState.pos * this.attribute.railWidth : this._tooltipState.pos * this.attribute.railHeight, coordKey = this._isHorizontal ? "x" : "y";
|
|
341
333
|
this._tooltipShape && this._tooltipShape.setAttributes({
|
|
342
334
|
visible: !0,
|
|
343
335
|
[coordKey]: coord
|
|
@@ -367,7 +359,7 @@ export class Slider extends AbstractComponent {
|
|
|
367
359
|
this._mainContainer.addEventListener("pointermove", this._onTooltipUpdate), this._mainContainer.addEventListener("pointerleave", this._onTooltipHide));
|
|
368
360
|
}
|
|
369
361
|
_updateTrack() {
|
|
370
|
-
const
|
|
362
|
+
const startHandler = this._startHandler, endHandler = this._endHandler;
|
|
371
363
|
if (this._isHorizontal) {
|
|
372
364
|
const startHandlerPos = null == startHandler ? void 0 : startHandler.attribute.x;
|
|
373
365
|
if (endHandler) {
|
|
@@ -376,10 +368,7 @@ export class Slider extends AbstractComponent {
|
|
|
376
368
|
x: Math.min(startHandlerPos, endHandlerPos),
|
|
377
369
|
width: Math.abs(startHandlerPos - endHandlerPos)
|
|
378
370
|
});
|
|
379
|
-
} else
|
|
380
|
-
x: startHandlerPos,
|
|
381
|
-
width: railWidth - startHandlerPos
|
|
382
|
-
}) : this._track.setAttributes({
|
|
371
|
+
} else this._track.setAttributes({
|
|
383
372
|
width: startHandlerPos
|
|
384
373
|
});
|
|
385
374
|
} else {
|
|
@@ -390,10 +379,7 @@ export class Slider extends AbstractComponent {
|
|
|
390
379
|
y: Math.min(startHandlerPos, endHandlerPos),
|
|
391
380
|
height: Math.abs(startHandlerPos - endHandlerPos)
|
|
392
381
|
});
|
|
393
|
-
} else
|
|
394
|
-
y: startHandlerPos,
|
|
395
|
-
height: railHeight - startHandlerPos
|
|
396
|
-
}) : this._track.setAttributes({
|
|
382
|
+
} else this._track.setAttributes({
|
|
397
383
|
height: startHandlerPos
|
|
398
384
|
});
|
|
399
385
|
}
|