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

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.
Files changed (48) hide show
  1. package/cjs/brush/brush.js +1 -2
  2. package/cjs/brush/type.js +2 -1
  3. package/cjs/index.d.ts +1 -2
  4. package/cjs/index.js +4 -5
  5. package/cjs/index.js.map +1 -1
  6. package/cjs/label/arc.js +9 -2
  7. package/cjs/label/arc.js.map +1 -1
  8. package/cjs/label/base.js +5 -0
  9. package/cjs/label/base.js.map +1 -1
  10. package/cjs/label/type.d.ts +4 -2
  11. package/cjs/label/type.js.map +1 -1
  12. package/dist/index.es.js +16 -216
  13. package/es/brush/brush.js +1 -2
  14. package/es/brush/type.js +2 -1
  15. package/es/index.d.ts +1 -2
  16. package/es/index.js +1 -3
  17. package/es/index.js.map +1 -1
  18. package/es/label/arc.js +10 -3
  19. package/es/label/arc.js.map +1 -1
  20. package/es/label/base.js +6 -1
  21. package/es/label/base.js.map +1 -1
  22. package/es/label/type.d.ts +4 -2
  23. package/es/label/type.js.map +1 -1
  24. package/package.json +3 -3
  25. package/cjs/timeline/index.d.ts +0 -2
  26. package/cjs/timeline/index.js +0 -21
  27. package/cjs/timeline/index.js.map +0 -1
  28. package/cjs/timeline/register.d.ts +0 -1
  29. package/cjs/timeline/register.js +0 -15
  30. package/cjs/timeline/register.js.map +0 -1
  31. package/cjs/timeline/timeline.d.ts +0 -30
  32. package/cjs/timeline/timeline.js +0 -178
  33. package/cjs/timeline/timeline.js.map +0 -1
  34. package/cjs/timeline/type.d.ts +0 -18
  35. package/cjs/timeline/type.js +0 -6
  36. package/cjs/timeline/type.js.map +0 -1
  37. package/es/timeline/index.d.ts +0 -2
  38. package/es/timeline/index.js +0 -4
  39. package/es/timeline/index.js.map +0 -1
  40. package/es/timeline/register.d.ts +0 -1
  41. package/es/timeline/register.js +0 -6
  42. package/es/timeline/register.js.map +0 -1
  43. package/es/timeline/timeline.d.ts +0 -30
  44. package/es/timeline/timeline.js +0 -175
  45. package/es/timeline/timeline.js.map +0 -1
  46. package/es/timeline/type.d.ts +0 -18
  47. package/es/timeline/type.js +0 -2
  48. package/es/timeline/type.js.map +0 -1
@@ -1,178 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: !0
5
- }), exports.Timeline = void 0;
6
-
7
- const vutils_1 = require("@visactor/vutils"), base_1 = require("../core/base"), register_1 = require("./register");
8
-
9
- (0, register_1.loadTimelineComponent)();
10
-
11
- class Timeline extends base_1.AbstractComponent {
12
- constructor(attributes, options) {
13
- super((null == options ? void 0 : options.skipDefault) ? attributes : (0, vutils_1.merge)({}, Timeline.defaultAttributes, attributes)),
14
- this.name = "timeline";
15
- }
16
- render() {
17
- const {width: width, lineStyle: lineStyle, activeLineStyle: activeLineStyle, symbolStyle: symbolStyle, activeSymbolStyle: activeSymbolStyle, labelStyle: labelStyle, activeLabelStyle: activeLabelStyle, times: times, pointLayoutMode: pointLayoutMode, labelSpace: labelSpace, clipRange: clipRange, animation: animation} = this.attribute;
18
- if (!times || !times.length) return;
19
- const symbolHeight = ((0, vutils_1.isArray)(symbolStyle.size) ? symbolStyle.size[1] : symbolStyle.size) || 0, activeSymbolHeight = ((0,
20
- vutils_1.isArray)(activeSymbolStyle.size) ? activeSymbolStyle.size[1] : activeSymbolStyle.size) || 0, lineSymbolHeight = Math.max(lineStyle.lineWidth || 0, activeLineStyle.lineWidth || 0, symbolHeight, activeSymbolHeight), lineY = lineSymbolHeight / 2, lineAttr = {
21
- y: lineY,
22
- points: [ {
23
- x: 0,
24
- y: 0
25
- }, {
26
- x: width,
27
- y: 0
28
- } ]
29
- };
30
- this._line = this.createOrUpdateChild("line-axes", Object.assign(Object.assign({}, lineStyle), lineAttr), "line"),
31
- this._activeLine = this.createOrUpdateChild("active-line-axes", Object.assign(Object.assign(Object.assign({}, activeLineStyle), lineAttr), {
32
- clipRange: clipRange
33
- }), "line");
34
- const activeWidth = width * clipRange, symbolGroup = this.createOrUpdateChild("symbol-group", {
35
- y: lineY
36
- }, "group"), symbolSpace = 1 === times.length ? width : "space-between" === pointLayoutMode ? width / (times.length - 1) : width / times.length, symbolStartX = "space-between" === pointLayoutMode ? 0 : symbolSpace / 2;
37
- this._timesPercent = times.map(((_, i) => (symbolStartX + symbolSpace * i) / width)),
38
- times.forEach(((item, i) => {
39
- const x = this._timesPercent[i] * width;
40
- symbolGroup.createOrUpdateChild(item.label, Object.assign(Object.assign({}, symbolStyle), {
41
- x: x
42
- }), "symbol");
43
- })), this._symbolGroup = symbolGroup;
44
- const labelY = lineSymbolHeight + labelSpace, labelGroup = this.createOrUpdateChild("label-group", {
45
- y: labelY
46
- }, "group");
47
- times.forEach(((item, i) => {
48
- const x = this._timesPercent[i] * width;
49
- labelGroup.createOrUpdateChild(item.label, Object.assign(Object.assign({}, labelStyle), {
50
- x: x,
51
- text: item.label
52
- }), "text");
53
- })), this._labelGroup = labelGroup;
54
- const setActive = (group, activeStyle) => {
55
- group.forEachChildren((label => {
56
- if (label.currentStates) {
57
- const currentStates = label.currentStates;
58
- label.clearStates(), label.useStates(currentStates, !1);
59
- }
60
- label.states = {
61
- active: activeStyle
62
- }, label.attribute.x <= activeWidth && label.useStates([ "active" ], animation);
63
- }));
64
- };
65
- setActive(labelGroup, activeLabelStyle), setActive(symbolGroup, activeSymbolStyle);
66
- }
67
- appearAnimate(animateConfig) {
68
- const {duration: duration = 1e3, easing: easing = "quadOut"} = animateConfig, {activeLabelStyle: activeLabelStyle, activeSymbolStyle: activeSymbolStyle} = this.attribute, percent = duration / 1e3, lineDuration = 500 * percent, activeLineDuration = 200 * percent, perSymbolDuration = 100 * percent, perSymbolNormalDuration = 90 * percent, symbolDelay = 100 * percent, symbolNormalDelay = 600 * percent;
69
- if (this._line && (this._line.setAttributes({
70
- clipRange: 0
71
- }), this._line.animate().to({
72
- clipRange: 1
73
- }, lineDuration, easing)), this._activeLine && (this._activeLine.setAttributes({
74
- opacity: 0
75
- }), this._activeLine.animate().wait(500).to({
76
- opacity: 1
77
- }, activeLineDuration, easing)), this._symbolGroup) {
78
- const size = this._symbolGroup.count - 1, delay = percent * (1 === size ? 0 : 400 / (size - 1)), delayNormal = percent * (1 === size ? 0 : 240 / (size - 1));
79
- this._symbolGroup.forEachChildren(((symbol, i) => {
80
- const originAttrs = Object.assign({}, symbol.attribute);
81
- symbol.setAttributes({
82
- opacity: 0
83
- }), symbol.animate().wait(symbolDelay + delay * i).to({
84
- opacity: 1
85
- }, perSymbolDuration, easing), symbol.animate().wait(symbolNormalDelay + delayNormal * i).to(Object.assign({
86
- scaleX: 1.8,
87
- scaleY: 1.8
88
- }, activeSymbolStyle), perSymbolNormalDuration, easing).to(Object.assign({
89
- scaleX: 1,
90
- scaleY: 1
91
- }, originAttrs), perSymbolNormalDuration, easing);
92
- }));
93
- }
94
- if (this._labelGroup) {
95
- const size = this._labelGroup.count - 1, delay = percent * (1 === size ? 0 : 400 / (size - 1)), delayNormal = percent * (1 === size ? 0 : 240 / (size - 1));
96
- this._labelGroup.forEachChildren(((label, i) => {
97
- const originAttrs = Object.assign({}, label.attribute);
98
- label.setAttributes({
99
- opacity: 0
100
- }), label.animate().wait(symbolDelay + delay * i).to({
101
- opacity: 1
102
- }, perSymbolDuration, easing), label.animate().wait(symbolNormalDelay + delayNormal * i).to(Object.assign({
103
- dy: 10
104
- }, activeLabelStyle), perSymbolNormalDuration, easing).to(Object.assign({
105
- dy: 0
106
- }, originAttrs), perSymbolNormalDuration, easing);
107
- }));
108
- }
109
- }
110
- goto(flag, animateConfig) {
111
- var _a;
112
- let {clipRange: clipRange} = this.attribute;
113
- const {animation: animation} = this.attribute;
114
- if (flag > 0) {
115
- if (clipRange >= 1) return;
116
- clipRange < 0 && (clipRange = 0);
117
- } else {
118
- if (clipRange <= 0) return;
119
- clipRange > 1 && (clipRange = 1);
120
- }
121
- clipRange !== this.attribute.clipRange && this.setAttributes({
122
- clipRange: clipRange
123
- });
124
- let i = 0;
125
- for (;i < this._timesPercent.length && !(clipRange < this._timesPercent[i]); i++) ;
126
- const nextClipRange = flag > 0 ? this._timesPercent[i] : this._timesPercent[i - 1] || 0;
127
- if (animation) {
128
- const {duration: duration = 1e3, easing: easing = "quadOut"} = animateConfig, actDuration = Math.abs(nextClipRange - clipRange) / (this._timesPercent[i] - (null !== (_a = this._timesPercent[i - 1]) && void 0 !== _a ? _a : 0)) * duration;
129
- this.animate().to({
130
- clipRange: nextClipRange
131
- }, actDuration, easing);
132
- } else this.setAttributes({
133
- clipRange: nextClipRange
134
- });
135
- }
136
- forward(animateConfig) {
137
- this.goto(1, animateConfig);
138
- }
139
- backward(animateConfig) {
140
- this.goto(-1, animateConfig);
141
- }
142
- }
143
-
144
- exports.Timeline = Timeline, Timeline.defaultAttributes = {
145
- labelSpace: 10,
146
- pointLayoutMode: "space-around",
147
- animation: !0,
148
- symbolStyle: {
149
- fill: "black",
150
- size: 12,
151
- symbolType: "circle"
152
- },
153
- activeSymbolStyle: {
154
- fill: "orange"
155
- },
156
- lineStyle: {
157
- lineDash: [ 2, 2 ],
158
- lineCap: "butt",
159
- stroke: "black",
160
- lineWidth: 2
161
- },
162
- activeLineStyle: {
163
- stroke: "orange",
164
- lineWidth: 4
165
- },
166
- labelStyle: {
167
- fontSize: 12,
168
- fill: "black",
169
- textAlign: "center",
170
- textBaseline: "top"
171
- },
172
- activeLabelStyle: {
173
- fontSize: 14,
174
- fill: "orange"
175
- },
176
- clipRange: 0
177
- };
178
- //# sourceMappingURL=timeline.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/timeline/timeline.ts"],"names":[],"mappings":"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","file":"timeline.js","sourcesContent":["import { isArray, merge } from '@visactor/vutils';\nimport { AbstractComponent } from '../core/base';\nimport { loadTimelineComponent } from './register';\nimport type { TimelineAttrs } from './type';\nimport type { ComponentOptions } from '../interface';\nimport type { IGraphicAttribute, IGroup, ILine, IText } from '@visactor/vrender-core';\nimport type { ISymbol } from '@visactor/vrender-core';\n\nloadTimelineComponent();\n\nexport class Timeline extends AbstractComponent<Required<TimelineAttrs>> {\n name = 'timeline';\n\n private _line?: ILine;\n private _activeLine?: ILine;\n private _symbolGroup?: IGroup;\n private _labelGroup?: IGroup;\n private _timesPercent?: number[];\n\n static defaultAttributes: Partial<TimelineAttrs> = {\n labelSpace: 10,\n pointLayoutMode: 'space-around',\n animation: true,\n symbolStyle: {\n fill: 'black',\n size: 12,\n symbolType: 'circle'\n },\n activeSymbolStyle: {\n fill: 'orange'\n },\n lineStyle: {\n lineDash: [2, 2],\n lineCap: 'butt',\n stroke: 'black',\n lineWidth: 2\n },\n activeLineStyle: {\n stroke: 'orange',\n lineWidth: 4\n },\n labelStyle: {\n fontSize: 12,\n fill: 'black',\n textAlign: 'center',\n textBaseline: 'top'\n },\n activeLabelStyle: {\n fontSize: 14,\n fill: 'orange'\n },\n clipRange: 0\n };\n\n constructor(attributes: TimelineAttrs, options?: ComponentOptions) {\n super(options?.skipDefault ? attributes : merge({}, Timeline.defaultAttributes, attributes));\n }\n\n protected render(): void {\n const {\n width,\n lineStyle,\n activeLineStyle,\n symbolStyle,\n activeSymbolStyle,\n labelStyle,\n activeLabelStyle,\n times,\n pointLayoutMode,\n labelSpace,\n clipRange,\n animation\n } = this.attribute;\n\n if (!(times && times.length)) {\n return;\n }\n\n // 计算线段中心的y位置,考虑线宽和symbol宽度\n const symbolHeight = (isArray(symbolStyle.size) ? symbolStyle.size[1] : symbolStyle.size) || 0;\n const activeSymbolHeight =\n (isArray(activeSymbolStyle.size) ? activeSymbolStyle.size[1] : activeSymbolStyle.size) || 0;\n const lineSymbolHeight = Math.max(\n lineStyle.lineWidth || 0,\n activeLineStyle.lineWidth || 0,\n symbolHeight,\n activeSymbolHeight\n );\n const lineY = lineSymbolHeight / 2;\n const lineAttr = {\n y: lineY,\n points: [\n { x: 0, y: 0 },\n { x: width, y: 0 }\n ]\n };\n this._line = this.createOrUpdateChild(\n 'line-axes',\n {\n ...lineStyle,\n ...lineAttr\n },\n 'line'\n ) as ILine;\n this._activeLine = this.createOrUpdateChild(\n 'active-line-axes',\n {\n ...activeLineStyle,\n ...lineAttr,\n clipRange\n },\n 'line'\n ) as ILine;\n\n const activeWidth = width * clipRange;\n\n const symbolGroup = this.createOrUpdateChild(\n 'symbol-group',\n {\n y: lineY\n },\n 'group'\n ) as IGroup;\n const symbolSpace =\n times.length === 1\n ? width\n : pointLayoutMode === 'space-between'\n ? width / (times.length - 1)\n : width / times.length;\n const symbolStartX = pointLayoutMode === 'space-between' ? 0 : symbolSpace / 2;\n this._timesPercent = times.map((_, i) => (symbolStartX + symbolSpace * i) / width);\n\n times.forEach((item, i) => {\n const x = this._timesPercent[i] * width;\n symbolGroup.createOrUpdateChild(\n item.label,\n {\n ...symbolStyle,\n x\n },\n 'symbol'\n );\n });\n this._symbolGroup = symbolGroup;\n\n const labelY = lineSymbolHeight + labelSpace;\n const labelGroup = this.createOrUpdateChild(\n 'label-group',\n {\n y: labelY\n },\n 'group'\n ) as IGroup;\n\n times.forEach((item, i) => {\n const x = this._timesPercent[i] * width;\n labelGroup.createOrUpdateChild(\n item.label,\n {\n ...labelStyle,\n x,\n text: item.label\n },\n 'text'\n );\n });\n this._labelGroup = labelGroup;\n\n const setActive = (group: IGroup, activeStyle: Partial<IGraphicAttribute>) => {\n group.forEachChildren((label: IText) => {\n if (label.currentStates) {\n const currentStates = label.currentStates;\n label.clearStates();\n label.useStates(currentStates, false);\n }\n label.states = {\n active: activeStyle\n };\n if (label.attribute.x <= activeWidth) {\n label.useStates(['active'], animation);\n }\n });\n };\n\n setActive(labelGroup, activeLabelStyle);\n setActive(symbolGroup, activeSymbolStyle);\n }\n\n appearAnimate(animateConfig: { duration?: number; easing?: string }) {\n // 基准时间,line[0, 500], point[100, 600] 100 onebyone, pointNormal[600, 1000] 90+90 onebyone, activeLine[500, 700]\n // line和activeLine的clipRange\n const { duration = 1000, easing = 'quadOut' } = animateConfig;\n const { activeLabelStyle, activeSymbolStyle } = this.attribute;\n const percent = duration / 1000;\n const lineDuration = percent * 500;\n const activeLineDuration = percent * 200;\n const perSymbolDuration = percent * 100;\n const perSymbolNormalDuration = percent * 90;\n const symbolDelay = percent * 100;\n const symbolNormalDelay = percent * 600;\n if (this._line) {\n this._line.setAttributes({ clipRange: 0 });\n this._line.animate().to({ clipRange: 1 }, lineDuration, easing as any);\n }\n if (this._activeLine) {\n this._activeLine.setAttributes({ opacity: 0 });\n this._activeLine\n .animate()\n .wait(500)\n .to({ opacity: 1 }, activeLineDuration, easing as any);\n }\n if (this._symbolGroup) {\n const size = this._symbolGroup.count - 1;\n const delay = percent * (size === 1 ? 0 : (500 - 100) / (size - 1));\n const delayNormal = percent * (size === 1 ? 0 : (400 - 160) / (size - 1));\n this._symbolGroup.forEachChildren((symbol: ISymbol, i) => {\n const originAttrs = { ...symbol.attribute };\n symbol.setAttributes({ opacity: 0 });\n symbol\n .animate()\n .wait(symbolDelay + delay * i)\n .to({ opacity: 1 }, perSymbolDuration, easing as any);\n symbol\n .animate()\n .wait(symbolNormalDelay + delayNormal * i)\n .to({ scaleX: 1.8, scaleY: 1.8, ...activeSymbolStyle }, perSymbolNormalDuration, easing as any)\n .to({ scaleX: 1, scaleY: 1, ...originAttrs }, perSymbolNormalDuration, easing as any);\n });\n }\n if (this._labelGroup) {\n const size = this._labelGroup.count - 1;\n const delay = percent * (size === 1 ? 0 : (500 - 100) / (size - 1));\n const delayNormal = percent * (size === 1 ? 0 : (400 - 160) / (size - 1));\n this._labelGroup.forEachChildren((label: IText, i) => {\n const originAttrs = { ...label.attribute };\n label.setAttributes({ opacity: 0 });\n label\n .animate()\n .wait(symbolDelay + delay * i)\n .to({ opacity: 1 }, perSymbolDuration, easing as any);\n label\n .animate()\n .wait(symbolNormalDelay + delayNormal * i)\n .to({ dy: 10, ...activeLabelStyle }, perSymbolNormalDuration, easing as any)\n .to({ dy: 0, ...originAttrs }, perSymbolNormalDuration, easing as any);\n });\n }\n }\n\n goto(flag: 1 | -1, animateConfig: { duration?: number; easing?: string }) {\n let { clipRange } = this.attribute;\n const { animation } = this.attribute;\n\n // 合法性判断\n if (flag > 0) {\n if (clipRange >= 1) {\n return;\n } else if (clipRange < 0) {\n clipRange = 0;\n }\n } else {\n if (clipRange <= 0) {\n return;\n } else if (clipRange > 1) {\n clipRange = 1;\n }\n }\n\n if (clipRange !== this.attribute.clipRange) {\n this.setAttributes({ clipRange });\n }\n\n // 判断区间\n let i = 0;\n for (; i < this._timesPercent.length; i++) {\n if (clipRange < this._timesPercent[i]) {\n break;\n }\n }\n\n const nextClipRange = flag > 0 ? this._timesPercent[i] : this._timesPercent[i - 1] || 0;\n if (animation) {\n const { duration = 1000, easing = 'quadOut' } = animateConfig;\n const actDuration =\n (Math.abs(nextClipRange - clipRange) / (this._timesPercent[i] - (this._timesPercent[i - 1] ?? 0))) * duration;\n this.animate().to({ clipRange: nextClipRange }, actDuration, easing as any);\n } else {\n this.setAttributes({ clipRange: nextClipRange });\n }\n }\n\n forward(animateConfig: { duration?: number; easing?: string }) {\n this.goto(1, animateConfig);\n }\n\n backward(animateConfig: { duration?: number; easing?: string }) {\n this.goto(-1, animateConfig);\n }\n}\n"]}
@@ -1,18 +0,0 @@
1
- import type { IGroupGraphicAttribute, ILineGraphicAttribute, ISymbolGraphicAttribute, ITextGraphicAttribute } from '@visactor/vrender-core';
2
- export interface TimelineAttrs extends IGroupGraphicAttribute {
3
- width: number;
4
- times: {
5
- label: string;
6
- desc?: string;
7
- }[];
8
- labelSpace?: number;
9
- symbolStyle?: Partial<ISymbolGraphicAttribute>;
10
- activeSymbolStyle?: Partial<ISymbolGraphicAttribute>;
11
- lineStyle?: Partial<ILineGraphicAttribute>;
12
- activeLineStyle?: Partial<ILineGraphicAttribute>;
13
- labelStyle?: Partial<ITextGraphicAttribute>;
14
- activeLabelStyle?: Partial<ITextGraphicAttribute>;
15
- pointLayoutMode?: 'space-around' | 'space-between';
16
- clipRange?: number;
17
- animation?: boolean;
18
- }
@@ -1,6 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: !0
5
- });
6
- //# sourceMappingURL=type.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/timeline/type.ts"],"names":[],"mappings":"","file":"type.js","sourcesContent":["import type {\n IGroupGraphicAttribute,\n ILineGraphicAttribute,\n ISymbolGraphicAttribute,\n ITextGraphicAttribute\n} from '@visactor/vrender-core';\nimport { ILineAttribute, ISymbolAttribute } from '@visactor/vrender-core';\n\nexport interface TimelineAttrs extends IGroupGraphicAttribute {\n width: number;\n // height?: number;\n times: { label: string; desc?: string }[];\n labelSpace?: number;\n symbolStyle?: Partial<ISymbolGraphicAttribute>;\n activeSymbolStyle?: Partial<ISymbolGraphicAttribute>;\n lineStyle?: Partial<ILineGraphicAttribute>;\n activeLineStyle?: Partial<ILineGraphicAttribute>;\n labelStyle?: Partial<ITextGraphicAttribute>;\n activeLabelStyle?: Partial<ITextGraphicAttribute>;\n pointLayoutMode?: 'space-around' | 'space-between';\n // 当前进度\n clipRange?: number;\n animation?: boolean;\n}\n"]}
@@ -1,2 +0,0 @@
1
- export * from './timeline';
2
- export * from './type';
@@ -1,4 +0,0 @@
1
- export * from "./timeline";
2
-
3
- export * from "./type";
4
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/timeline/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC;AAC3B,cAAc,QAAQ,CAAC","file":"index.js","sourcesContent":["export * from './timeline';\nexport * from './type';\n"]}
@@ -1 +0,0 @@
1
- export declare function loadTimelineComponent(): void;
@@ -1,6 +0,0 @@
1
- import { registerGroup, registerSymbol, registerLine, registerText } from "@visactor/vrender-kits";
2
-
3
- export function loadTimelineComponent() {
4
- registerGroup(), registerText(), registerSymbol(), registerLine();
5
- }
6
- //# sourceMappingURL=register.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/timeline/register.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,cAAc,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAEnG,MAAM,UAAU,qBAAqB;IACnC,aAAa,EAAE,CAAC;IAChB,YAAY,EAAE,CAAC;IACf,cAAc,EAAE,CAAC;IACjB,YAAY,EAAE,CAAC;AACjB,CAAC","file":"register.js","sourcesContent":["import { registerGroup, registerSymbol, registerLine, registerText } from '@visactor/vrender-kits';\n\nexport function loadTimelineComponent() {\n registerGroup();\n registerText();\n registerSymbol();\n registerLine();\n}\n"]}
@@ -1,30 +0,0 @@
1
- import { AbstractComponent } from '../core/base';
2
- import type { TimelineAttrs } from './type';
3
- import type { ComponentOptions } from '../interface';
4
- export declare class Timeline extends AbstractComponent<Required<TimelineAttrs>> {
5
- name: string;
6
- private _line?;
7
- private _activeLine?;
8
- private _symbolGroup?;
9
- private _labelGroup?;
10
- private _timesPercent?;
11
- static defaultAttributes: Partial<TimelineAttrs>;
12
- constructor(attributes: TimelineAttrs, options?: ComponentOptions);
13
- protected render(): void;
14
- appearAnimate(animateConfig: {
15
- duration?: number;
16
- easing?: string;
17
- }): void;
18
- goto(flag: 1 | -1, animateConfig: {
19
- duration?: number;
20
- easing?: string;
21
- }): void;
22
- forward(animateConfig: {
23
- duration?: number;
24
- easing?: string;
25
- }): void;
26
- backward(animateConfig: {
27
- duration?: number;
28
- easing?: string;
29
- }): void;
30
- }
@@ -1,175 +0,0 @@
1
- import { isArray, merge } from "@visactor/vutils";
2
-
3
- import { AbstractComponent } from "../core/base";
4
-
5
- import { loadTimelineComponent } from "./register";
6
-
7
- loadTimelineComponent();
8
-
9
- export class Timeline extends AbstractComponent {
10
- constructor(attributes, options) {
11
- super((null == options ? void 0 : options.skipDefault) ? attributes : merge({}, Timeline.defaultAttributes, attributes)),
12
- this.name = "timeline";
13
- }
14
- render() {
15
- const {width: width, lineStyle: lineStyle, activeLineStyle: activeLineStyle, symbolStyle: symbolStyle, activeSymbolStyle: activeSymbolStyle, labelStyle: labelStyle, activeLabelStyle: activeLabelStyle, times: times, pointLayoutMode: pointLayoutMode, labelSpace: labelSpace, clipRange: clipRange, animation: animation} = this.attribute;
16
- if (!times || !times.length) return;
17
- const symbolHeight = (isArray(symbolStyle.size) ? symbolStyle.size[1] : symbolStyle.size) || 0, activeSymbolHeight = (isArray(activeSymbolStyle.size) ? activeSymbolStyle.size[1] : activeSymbolStyle.size) || 0, lineSymbolHeight = Math.max(lineStyle.lineWidth || 0, activeLineStyle.lineWidth || 0, symbolHeight, activeSymbolHeight), lineY = lineSymbolHeight / 2, lineAttr = {
18
- y: lineY,
19
- points: [ {
20
- x: 0,
21
- y: 0
22
- }, {
23
- x: width,
24
- y: 0
25
- } ]
26
- };
27
- this._line = this.createOrUpdateChild("line-axes", Object.assign(Object.assign({}, lineStyle), lineAttr), "line"),
28
- this._activeLine = this.createOrUpdateChild("active-line-axes", Object.assign(Object.assign(Object.assign({}, activeLineStyle), lineAttr), {
29
- clipRange: clipRange
30
- }), "line");
31
- const activeWidth = width * clipRange, symbolGroup = this.createOrUpdateChild("symbol-group", {
32
- y: lineY
33
- }, "group"), symbolSpace = 1 === times.length ? width : "space-between" === pointLayoutMode ? width / (times.length - 1) : width / times.length, symbolStartX = "space-between" === pointLayoutMode ? 0 : symbolSpace / 2;
34
- this._timesPercent = times.map(((_, i) => (symbolStartX + symbolSpace * i) / width)),
35
- times.forEach(((item, i) => {
36
- const x = this._timesPercent[i] * width;
37
- symbolGroup.createOrUpdateChild(item.label, Object.assign(Object.assign({}, symbolStyle), {
38
- x: x
39
- }), "symbol");
40
- })), this._symbolGroup = symbolGroup;
41
- const labelY = lineSymbolHeight + labelSpace, labelGroup = this.createOrUpdateChild("label-group", {
42
- y: labelY
43
- }, "group");
44
- times.forEach(((item, i) => {
45
- const x = this._timesPercent[i] * width;
46
- labelGroup.createOrUpdateChild(item.label, Object.assign(Object.assign({}, labelStyle), {
47
- x: x,
48
- text: item.label
49
- }), "text");
50
- })), this._labelGroup = labelGroup;
51
- const setActive = (group, activeStyle) => {
52
- group.forEachChildren((label => {
53
- if (label.currentStates) {
54
- const currentStates = label.currentStates;
55
- label.clearStates(), label.useStates(currentStates, !1);
56
- }
57
- label.states = {
58
- active: activeStyle
59
- }, label.attribute.x <= activeWidth && label.useStates([ "active" ], animation);
60
- }));
61
- };
62
- setActive(labelGroup, activeLabelStyle), setActive(symbolGroup, activeSymbolStyle);
63
- }
64
- appearAnimate(animateConfig) {
65
- const {duration: duration = 1e3, easing: easing = "quadOut"} = animateConfig, {activeLabelStyle: activeLabelStyle, activeSymbolStyle: activeSymbolStyle} = this.attribute, percent = duration / 1e3, lineDuration = 500 * percent, activeLineDuration = 200 * percent, perSymbolDuration = 100 * percent, perSymbolNormalDuration = 90 * percent, symbolDelay = 100 * percent, symbolNormalDelay = 600 * percent;
66
- if (this._line && (this._line.setAttributes({
67
- clipRange: 0
68
- }), this._line.animate().to({
69
- clipRange: 1
70
- }, lineDuration, easing)), this._activeLine && (this._activeLine.setAttributes({
71
- opacity: 0
72
- }), this._activeLine.animate().wait(500).to({
73
- opacity: 1
74
- }, activeLineDuration, easing)), this._symbolGroup) {
75
- const size = this._symbolGroup.count - 1, delay = percent * (1 === size ? 0 : 400 / (size - 1)), delayNormal = percent * (1 === size ? 0 : 240 / (size - 1));
76
- this._symbolGroup.forEachChildren(((symbol, i) => {
77
- const originAttrs = Object.assign({}, symbol.attribute);
78
- symbol.setAttributes({
79
- opacity: 0
80
- }), symbol.animate().wait(symbolDelay + delay * i).to({
81
- opacity: 1
82
- }, perSymbolDuration, easing), symbol.animate().wait(symbolNormalDelay + delayNormal * i).to(Object.assign({
83
- scaleX: 1.8,
84
- scaleY: 1.8
85
- }, activeSymbolStyle), perSymbolNormalDuration, easing).to(Object.assign({
86
- scaleX: 1,
87
- scaleY: 1
88
- }, originAttrs), perSymbolNormalDuration, easing);
89
- }));
90
- }
91
- if (this._labelGroup) {
92
- const size = this._labelGroup.count - 1, delay = percent * (1 === size ? 0 : 400 / (size - 1)), delayNormal = percent * (1 === size ? 0 : 240 / (size - 1));
93
- this._labelGroup.forEachChildren(((label, i) => {
94
- const originAttrs = Object.assign({}, label.attribute);
95
- label.setAttributes({
96
- opacity: 0
97
- }), label.animate().wait(symbolDelay + delay * i).to({
98
- opacity: 1
99
- }, perSymbolDuration, easing), label.animate().wait(symbolNormalDelay + delayNormal * i).to(Object.assign({
100
- dy: 10
101
- }, activeLabelStyle), perSymbolNormalDuration, easing).to(Object.assign({
102
- dy: 0
103
- }, originAttrs), perSymbolNormalDuration, easing);
104
- }));
105
- }
106
- }
107
- goto(flag, animateConfig) {
108
- var _a;
109
- let {clipRange: clipRange} = this.attribute;
110
- const {animation: animation} = this.attribute;
111
- if (flag > 0) {
112
- if (clipRange >= 1) return;
113
- clipRange < 0 && (clipRange = 0);
114
- } else {
115
- if (clipRange <= 0) return;
116
- clipRange > 1 && (clipRange = 1);
117
- }
118
- clipRange !== this.attribute.clipRange && this.setAttributes({
119
- clipRange: clipRange
120
- });
121
- let i = 0;
122
- for (;i < this._timesPercent.length && !(clipRange < this._timesPercent[i]); i++) ;
123
- const nextClipRange = flag > 0 ? this._timesPercent[i] : this._timesPercent[i - 1] || 0;
124
- if (animation) {
125
- const {duration: duration = 1e3, easing: easing = "quadOut"} = animateConfig, actDuration = Math.abs(nextClipRange - clipRange) / (this._timesPercent[i] - (null !== (_a = this._timesPercent[i - 1]) && void 0 !== _a ? _a : 0)) * duration;
126
- this.animate().to({
127
- clipRange: nextClipRange
128
- }, actDuration, easing);
129
- } else this.setAttributes({
130
- clipRange: nextClipRange
131
- });
132
- }
133
- forward(animateConfig) {
134
- this.goto(1, animateConfig);
135
- }
136
- backward(animateConfig) {
137
- this.goto(-1, animateConfig);
138
- }
139
- }
140
-
141
- Timeline.defaultAttributes = {
142
- labelSpace: 10,
143
- pointLayoutMode: "space-around",
144
- animation: !0,
145
- symbolStyle: {
146
- fill: "black",
147
- size: 12,
148
- symbolType: "circle"
149
- },
150
- activeSymbolStyle: {
151
- fill: "orange"
152
- },
153
- lineStyle: {
154
- lineDash: [ 2, 2 ],
155
- lineCap: "butt",
156
- stroke: "black",
157
- lineWidth: 2
158
- },
159
- activeLineStyle: {
160
- stroke: "orange",
161
- lineWidth: 4
162
- },
163
- labelStyle: {
164
- fontSize: 12,
165
- fill: "black",
166
- textAlign: "center",
167
- textBaseline: "top"
168
- },
169
- activeLabelStyle: {
170
- fontSize: 14,
171
- fill: "orange"
172
- },
173
- clipRange: 0
174
- };
175
- //# sourceMappingURL=timeline.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/timeline/timeline.ts"],"names":[],"mappings":"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","file":"timeline.js","sourcesContent":["import { isArray, merge } from '@visactor/vutils';\nimport { AbstractComponent } from '../core/base';\nimport { loadTimelineComponent } from './register';\nimport type { TimelineAttrs } from './type';\nimport type { ComponentOptions } from '../interface';\nimport type { IGraphicAttribute, IGroup, ILine, IText } from '@visactor/vrender-core';\nimport type { ISymbol } from '@visactor/vrender-core';\n\nloadTimelineComponent();\n\nexport class Timeline extends AbstractComponent<Required<TimelineAttrs>> {\n name = 'timeline';\n\n private _line?: ILine;\n private _activeLine?: ILine;\n private _symbolGroup?: IGroup;\n private _labelGroup?: IGroup;\n private _timesPercent?: number[];\n\n static defaultAttributes: Partial<TimelineAttrs> = {\n labelSpace: 10,\n pointLayoutMode: 'space-around',\n animation: true,\n symbolStyle: {\n fill: 'black',\n size: 12,\n symbolType: 'circle'\n },\n activeSymbolStyle: {\n fill: 'orange'\n },\n lineStyle: {\n lineDash: [2, 2],\n lineCap: 'butt',\n stroke: 'black',\n lineWidth: 2\n },\n activeLineStyle: {\n stroke: 'orange',\n lineWidth: 4\n },\n labelStyle: {\n fontSize: 12,\n fill: 'black',\n textAlign: 'center',\n textBaseline: 'top'\n },\n activeLabelStyle: {\n fontSize: 14,\n fill: 'orange'\n },\n clipRange: 0\n };\n\n constructor(attributes: TimelineAttrs, options?: ComponentOptions) {\n super(options?.skipDefault ? attributes : merge({}, Timeline.defaultAttributes, attributes));\n }\n\n protected render(): void {\n const {\n width,\n lineStyle,\n activeLineStyle,\n symbolStyle,\n activeSymbolStyle,\n labelStyle,\n activeLabelStyle,\n times,\n pointLayoutMode,\n labelSpace,\n clipRange,\n animation\n } = this.attribute;\n\n if (!(times && times.length)) {\n return;\n }\n\n // 计算线段中心的y位置,考虑线宽和symbol宽度\n const symbolHeight = (isArray(symbolStyle.size) ? symbolStyle.size[1] : symbolStyle.size) || 0;\n const activeSymbolHeight =\n (isArray(activeSymbolStyle.size) ? activeSymbolStyle.size[1] : activeSymbolStyle.size) || 0;\n const lineSymbolHeight = Math.max(\n lineStyle.lineWidth || 0,\n activeLineStyle.lineWidth || 0,\n symbolHeight,\n activeSymbolHeight\n );\n const lineY = lineSymbolHeight / 2;\n const lineAttr = {\n y: lineY,\n points: [\n { x: 0, y: 0 },\n { x: width, y: 0 }\n ]\n };\n this._line = this.createOrUpdateChild(\n 'line-axes',\n {\n ...lineStyle,\n ...lineAttr\n },\n 'line'\n ) as ILine;\n this._activeLine = this.createOrUpdateChild(\n 'active-line-axes',\n {\n ...activeLineStyle,\n ...lineAttr,\n clipRange\n },\n 'line'\n ) as ILine;\n\n const activeWidth = width * clipRange;\n\n const symbolGroup = this.createOrUpdateChild(\n 'symbol-group',\n {\n y: lineY\n },\n 'group'\n ) as IGroup;\n const symbolSpace =\n times.length === 1\n ? width\n : pointLayoutMode === 'space-between'\n ? width / (times.length - 1)\n : width / times.length;\n const symbolStartX = pointLayoutMode === 'space-between' ? 0 : symbolSpace / 2;\n this._timesPercent = times.map((_, i) => (symbolStartX + symbolSpace * i) / width);\n\n times.forEach((item, i) => {\n const x = this._timesPercent[i] * width;\n symbolGroup.createOrUpdateChild(\n item.label,\n {\n ...symbolStyle,\n x\n },\n 'symbol'\n );\n });\n this._symbolGroup = symbolGroup;\n\n const labelY = lineSymbolHeight + labelSpace;\n const labelGroup = this.createOrUpdateChild(\n 'label-group',\n {\n y: labelY\n },\n 'group'\n ) as IGroup;\n\n times.forEach((item, i) => {\n const x = this._timesPercent[i] * width;\n labelGroup.createOrUpdateChild(\n item.label,\n {\n ...labelStyle,\n x,\n text: item.label\n },\n 'text'\n );\n });\n this._labelGroup = labelGroup;\n\n const setActive = (group: IGroup, activeStyle: Partial<IGraphicAttribute>) => {\n group.forEachChildren((label: IText) => {\n if (label.currentStates) {\n const currentStates = label.currentStates;\n label.clearStates();\n label.useStates(currentStates, false);\n }\n label.states = {\n active: activeStyle\n };\n if (label.attribute.x <= activeWidth) {\n label.useStates(['active'], animation);\n }\n });\n };\n\n setActive(labelGroup, activeLabelStyle);\n setActive(symbolGroup, activeSymbolStyle);\n }\n\n appearAnimate(animateConfig: { duration?: number; easing?: string }) {\n // 基准时间,line[0, 500], point[100, 600] 100 onebyone, pointNormal[600, 1000] 90+90 onebyone, activeLine[500, 700]\n // line和activeLine的clipRange\n const { duration = 1000, easing = 'quadOut' } = animateConfig;\n const { activeLabelStyle, activeSymbolStyle } = this.attribute;\n const percent = duration / 1000;\n const lineDuration = percent * 500;\n const activeLineDuration = percent * 200;\n const perSymbolDuration = percent * 100;\n const perSymbolNormalDuration = percent * 90;\n const symbolDelay = percent * 100;\n const symbolNormalDelay = percent * 600;\n if (this._line) {\n this._line.setAttributes({ clipRange: 0 });\n this._line.animate().to({ clipRange: 1 }, lineDuration, easing as any);\n }\n if (this._activeLine) {\n this._activeLine.setAttributes({ opacity: 0 });\n this._activeLine\n .animate()\n .wait(500)\n .to({ opacity: 1 }, activeLineDuration, easing as any);\n }\n if (this._symbolGroup) {\n const size = this._symbolGroup.count - 1;\n const delay = percent * (size === 1 ? 0 : (500 - 100) / (size - 1));\n const delayNormal = percent * (size === 1 ? 0 : (400 - 160) / (size - 1));\n this._symbolGroup.forEachChildren((symbol: ISymbol, i) => {\n const originAttrs = { ...symbol.attribute };\n symbol.setAttributes({ opacity: 0 });\n symbol\n .animate()\n .wait(symbolDelay + delay * i)\n .to({ opacity: 1 }, perSymbolDuration, easing as any);\n symbol\n .animate()\n .wait(symbolNormalDelay + delayNormal * i)\n .to({ scaleX: 1.8, scaleY: 1.8, ...activeSymbolStyle }, perSymbolNormalDuration, easing as any)\n .to({ scaleX: 1, scaleY: 1, ...originAttrs }, perSymbolNormalDuration, easing as any);\n });\n }\n if (this._labelGroup) {\n const size = this._labelGroup.count - 1;\n const delay = percent * (size === 1 ? 0 : (500 - 100) / (size - 1));\n const delayNormal = percent * (size === 1 ? 0 : (400 - 160) / (size - 1));\n this._labelGroup.forEachChildren((label: IText, i) => {\n const originAttrs = { ...label.attribute };\n label.setAttributes({ opacity: 0 });\n label\n .animate()\n .wait(symbolDelay + delay * i)\n .to({ opacity: 1 }, perSymbolDuration, easing as any);\n label\n .animate()\n .wait(symbolNormalDelay + delayNormal * i)\n .to({ dy: 10, ...activeLabelStyle }, perSymbolNormalDuration, easing as any)\n .to({ dy: 0, ...originAttrs }, perSymbolNormalDuration, easing as any);\n });\n }\n }\n\n goto(flag: 1 | -1, animateConfig: { duration?: number; easing?: string }) {\n let { clipRange } = this.attribute;\n const { animation } = this.attribute;\n\n // 合法性判断\n if (flag > 0) {\n if (clipRange >= 1) {\n return;\n } else if (clipRange < 0) {\n clipRange = 0;\n }\n } else {\n if (clipRange <= 0) {\n return;\n } else if (clipRange > 1) {\n clipRange = 1;\n }\n }\n\n if (clipRange !== this.attribute.clipRange) {\n this.setAttributes({ clipRange });\n }\n\n // 判断区间\n let i = 0;\n for (; i < this._timesPercent.length; i++) {\n if (clipRange < this._timesPercent[i]) {\n break;\n }\n }\n\n const nextClipRange = flag > 0 ? this._timesPercent[i] : this._timesPercent[i - 1] || 0;\n if (animation) {\n const { duration = 1000, easing = 'quadOut' } = animateConfig;\n const actDuration =\n (Math.abs(nextClipRange - clipRange) / (this._timesPercent[i] - (this._timesPercent[i - 1] ?? 0))) * duration;\n this.animate().to({ clipRange: nextClipRange }, actDuration, easing as any);\n } else {\n this.setAttributes({ clipRange: nextClipRange });\n }\n }\n\n forward(animateConfig: { duration?: number; easing?: string }) {\n this.goto(1, animateConfig);\n }\n\n backward(animateConfig: { duration?: number; easing?: string }) {\n this.goto(-1, animateConfig);\n }\n}\n"]}
@@ -1,18 +0,0 @@
1
- import type { IGroupGraphicAttribute, ILineGraphicAttribute, ISymbolGraphicAttribute, ITextGraphicAttribute } from '@visactor/vrender-core';
2
- export interface TimelineAttrs extends IGroupGraphicAttribute {
3
- width: number;
4
- times: {
5
- label: string;
6
- desc?: string;
7
- }[];
8
- labelSpace?: number;
9
- symbolStyle?: Partial<ISymbolGraphicAttribute>;
10
- activeSymbolStyle?: Partial<ISymbolGraphicAttribute>;
11
- lineStyle?: Partial<ILineGraphicAttribute>;
12
- activeLineStyle?: Partial<ILineGraphicAttribute>;
13
- labelStyle?: Partial<ITextGraphicAttribute>;
14
- activeLabelStyle?: Partial<ITextGraphicAttribute>;
15
- pointLayoutMode?: 'space-around' | 'space-between';
16
- clipRange?: number;
17
- animation?: boolean;
18
- }
@@ -1,2 +0,0 @@
1
- export { };
2
- //# sourceMappingURL=type.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/timeline/type.ts"],"names":[],"mappings":"","file":"type.js","sourcesContent":["import type {\n IGroupGraphicAttribute,\n ILineGraphicAttribute,\n ISymbolGraphicAttribute,\n ITextGraphicAttribute\n} from '@visactor/vrender-core';\nimport { ILineAttribute, ISymbolAttribute } from '@visactor/vrender-core';\n\nexport interface TimelineAttrs extends IGroupGraphicAttribute {\n width: number;\n // height?: number;\n times: { label: string; desc?: string }[];\n labelSpace?: number;\n symbolStyle?: Partial<ISymbolGraphicAttribute>;\n activeSymbolStyle?: Partial<ISymbolGraphicAttribute>;\n lineStyle?: Partial<ILineGraphicAttribute>;\n activeLineStyle?: Partial<ILineGraphicAttribute>;\n labelStyle?: Partial<ITextGraphicAttribute>;\n activeLabelStyle?: Partial<ITextGraphicAttribute>;\n pointLayoutMode?: 'space-around' | 'space-between';\n // 当前进度\n clipRange?: number;\n animation?: boolean;\n}\n"]}