vislite 1.6.0-alpha.0 → 1.6.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 (65) hide show
  1. package/CHANGELOG +5 -1
  2. package/README.md +284 -284
  3. package/lib/BarLayout/index.es.js +4 -2
  4. package/lib/BarLayout/index.es.min.js +2 -2
  5. package/lib/Buffer/index.es.js +1 -1
  6. package/lib/Buffer/index.es.min.js +1 -1
  7. package/lib/Canvas/index.es.js +5 -3
  8. package/lib/Canvas/index.es.min.js +2 -2
  9. package/lib/Cardinal/index.es.js +1 -1
  10. package/lib/Cardinal/index.es.min.js +1 -1
  11. package/lib/Eoap/index.es.js +1 -1
  12. package/lib/Eoap/index.es.min.js +1 -1
  13. package/lib/Hermite/index.es.js +1 -1
  14. package/lib/Hermite/index.es.min.js +1 -1
  15. package/lib/MapCoordinate/index.es.js +1 -1
  16. package/lib/MapCoordinate/index.es.min.js +1 -1
  17. package/lib/Matrix4/index.es.js +1 -1
  18. package/lib/Matrix4/index.es.min.js +1 -1
  19. package/lib/Mercator/index.es.js +1 -1
  20. package/lib/Mercator/index.es.min.js +1 -1
  21. package/lib/PieLayout/index.es.js +3 -2
  22. package/lib/PieLayout/index.es.min.js +1 -1
  23. package/lib/RawCanvas/index.es.js +1 -1
  24. package/lib/RawCanvas/index.es.min.js +1 -1
  25. package/lib/SVG/index.es.js +1 -1
  26. package/lib/SVG/index.es.min.js +1 -1
  27. package/lib/Shader/index.es.js +1 -1
  28. package/lib/Shader/index.es.min.js +1 -1
  29. package/lib/Texture/index.es.js +1 -1
  30. package/lib/Texture/index.es.min.js +1 -1
  31. package/lib/TreeLayout/index.es.js +2 -1
  32. package/lib/TreeLayout/index.es.min.js +3 -3
  33. package/lib/animation/index.es.js +1 -1
  34. package/lib/animation/index.es.min.js +1 -1
  35. package/lib/assemble/index.es.js +1 -1
  36. package/lib/assemble/index.es.min.js +1 -1
  37. package/lib/getLoopColors/index.es.js +1 -1
  38. package/lib/getLoopColors/index.es.min.js +1 -1
  39. package/lib/getWebGLContext/index.es.js +1 -1
  40. package/lib/getWebGLContext/index.es.min.js +1 -1
  41. package/lib/index.umd.js +11 -5
  42. package/lib/index.umd.min.js +2 -2
  43. package/lib/initOption/index.es.js +1 -1
  44. package/lib/initOption/index.es.min.js +1 -1
  45. package/lib/mergeOption/index.es.js +1 -1
  46. package/lib/mergeOption/index.es.min.js +1 -1
  47. package/lib/move/index.es.js +1 -1
  48. package/lib/move/index.es.min.js +1 -1
  49. package/lib/rotate/index.es.js +1 -1
  50. package/lib/rotate/index.es.min.js +1 -1
  51. package/lib/ruler/index.es.js +1 -1
  52. package/lib/ruler/index.es.min.js +1 -1
  53. package/lib/scale/index.es.js +1 -1
  54. package/lib/scale/index.es.min.js +1 -1
  55. package/lib/throttle/index.es.js +1 -1
  56. package/lib/throttle/index.es.min.js +1 -1
  57. package/package.json +1 -1
  58. package/src/Canvas.ts +89 -89
  59. package/src/SVG.ts +55 -55
  60. package/src/common/tree/toPlainTree.ts +135 -135
  61. package/src/common/webgl/texture.ts +98 -98
  62. package/src/layout/BarLayout.ts +249 -248
  63. package/src/layout/PieLayout.ts +144 -141
  64. package/src/layout/TreeLayout.ts +200 -197
  65. package/types/Canvas.d.ts +3 -1
@@ -1,142 +1,145 @@
1
- import type PieLayoutType from '../../types/PieLayout'
2
- import type { PieResultType } from '../../types/Pie'
3
- import type PieOptionType from '../../types/PieOption'
4
- import type { default as PieConfigType, nameType, valueType } from '../../types/PieConfig'
5
-
6
- import { initOption } from '../common/option'
7
- import rotate from '../rotate'
8
- import { animation } from "oipage/web/animation/index"
9
-
10
- class PieLayout implements PieLayoutType {
11
- readonly name: string = 'PieLayout'
12
-
13
- private __config: PieConfigType
14
-
15
- constructor(config: PieConfigType = {}) {
16
- this.__config = initOption(config, {
17
- name: (pieData: any, initPie: Array<any>) => pieData.name,
18
- value: (pieData: any, initPie: Array<any>) => pieData.value
19
- })
20
- }
21
-
22
- private __option = {
23
- cx: 200,
24
- cy: 200,
25
- radius: [50, 100],
26
- duration: 200,
27
- }
28
-
29
- setOption(option: PieOptionType) {
30
- initOption(option, this.__option)
31
- return this
32
- }
33
-
34
- private __rback: (pie: PieResultType) => void
35
- private __oralPie: any
36
- private __prePie: PieResultType | null
37
-
38
- private __hoverIndex = -1 // 表示当前悬浮的序号
39
-
40
- use(initPie: Array<any>, hoverIndex: number = -1) {
41
- let pie: PieResultType = {
42
- count: initPie.length,
43
- cx: this.__option.cx,
44
- cy: this.__option.cy,
45
- radius: this.__option.radius,
46
- hoverIndex,
47
- node: []
48
- }
49
-
50
- let totalValue = 0, names = [], values = []
51
- for (let i = 0; i < initPie.length; i++) {
52
- names[i] = (this.__config.name as nameType)(initPie[i], initPie)
53
- values[i] = (this.__config.value as valueType)(initPie[i], initPie)
54
-
55
- totalValue += values[i]
56
- }
57
-
58
- let beginDeg = Math.PI * -0.5, currenDeg
59
- for (let i = 0; i < initPie.length; i++) {
60
- currenDeg = values[i] / totalValue * Math.PI * 2
61
- let radius = [this.__option.radius[0], this.__option.radius[1] * (1 + (hoverIndex === i ? 0.05 : 0))]
62
-
63
- let pdeg = beginDeg + currenDeg * 0.5, pradius = Math.max(this.__option.radius[0], this.__option.radius[1])
64
- let p0 = rotate(pie.cx, pie.cy, pdeg, pie.cx + pradius, pie.cy)
65
- let p1 = rotate(pie.cx, pie.cy, pdeg, pie.cx + pradius + 15, pie.cy)
66
-
67
- let pflag = p0[0] > pie.cx ? 1 : -1
68
- let p2 = [p1[0] + pflag * 20, p1[1]]
69
- let p3 = [p1[0] + pflag * 25, p1[1]]
70
-
71
- pie.node[i] = {
72
- value: values[i],
73
- name: names[i],
74
- beginDeg,
75
- deg: currenDeg,
76
- isHover: hoverIndex === i,
77
- radius,
78
- label: {
79
- line: [p0, p1, p2],
80
- position: p3,
81
- align: pflag === -1 ? "right" : "left"
82
- }
83
- }
84
-
85
- beginDeg += currenDeg
86
- }
87
-
88
- return pie
89
- }
90
-
91
- bind(initPie: Array<any>, renderBack: (pie: PieResultType) => void) {
92
- this.__rback = renderBack
93
- this.__oralPie = initPie
94
-
95
- this.__prePie = this.use(this.__oralPie, this.__hoverIndex)
96
- this.__rback(this.__prePie)
97
-
98
- return this
99
- }
100
-
101
- unbind() {
102
- this.__rback = () => null
103
- this.__oralPie = null
104
- this.__prePie = null
105
- this.__hoverIndex = -1
106
- return this
107
- }
108
-
109
- setHover(index: number) {
110
- if (!this.__prePie || this.__hoverIndex === index) return this
111
-
112
- this.__hoverIndex = index
113
-
114
- this.doUpdate()
115
- return this
116
- }
117
-
118
- doUpdate() {
119
- const newPie = this.use(this.__oralPie, this.__hoverIndex)
120
-
121
- const cachePie = JSON.parse(JSON.stringify(newPie))
122
-
123
- animation((deep) => {
124
-
125
- if (this.__prePie) {
126
- for (let i = 0; i < cachePie.count; i++) {
127
- cachePie.node[i].radius[1] = this.__prePie.node[i].radius[1] + (newPie.node[i].radius[1] - this.__prePie.node[i].radius[1]) * deep
128
- }
129
- }
130
-
131
- this.__rback(cachePie)
132
-
133
- }, this.__option.duration, () => {
134
- this.__prePie = newPie
135
- this.__rback(this.__prePie)
136
- })
137
-
138
- return this
139
- }
140
- }
141
-
1
+ import type PieLayoutType from '../../types/PieLayout'
2
+ import type { PieResultType } from '../../types/Pie'
3
+ import type PieOptionType from '../../types/PieOption'
4
+ import type { default as PieConfigType, nameType, valueType } from '../../types/PieConfig'
5
+
6
+ import { initOption } from '../common/option'
7
+ import rotate from '../rotate'
8
+ import { animation } from "oipage/web/animation/index"
9
+
10
+ class PieLayout implements PieLayoutType {
11
+ readonly name: string = 'PieLayout'
12
+
13
+ private __config: PieConfigType
14
+
15
+ constructor(config: PieConfigType = {}) {
16
+ this.__config = initOption(config, {
17
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
18
+ name: (pieData: any, initPie: Array<any>) => pieData.name,
19
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
20
+ value: (pieData: any, initPie: Array<any>) => pieData.value
21
+ })
22
+ }
23
+
24
+ private __option = {
25
+ cx: 200,
26
+ cy: 200,
27
+ radius: [50, 100],
28
+ duration: 200,
29
+ }
30
+
31
+ setOption(option: PieOptionType) {
32
+ initOption(option, this.__option)
33
+ return this
34
+ }
35
+
36
+ private __rback: (pie: PieResultType) => void
37
+ private __oralPie: any
38
+ private __prePie: PieResultType | null
39
+
40
+ private __hoverIndex = -1 // 表示当前悬浮的序号
41
+
42
+ use(initPie: Array<any>, hoverIndex: number = -1) {
43
+ const pie: PieResultType = {
44
+ count: initPie.length,
45
+ cx: this.__option.cx,
46
+ cy: this.__option.cy,
47
+ radius: this.__option.radius,
48
+ hoverIndex,
49
+ node: []
50
+ }
51
+
52
+ let totalValue = 0
53
+ const names = [], values = []
54
+ for (let i = 0; i < initPie.length; i++) {
55
+ names[i] = (this.__config.name as nameType)(initPie[i], initPie)
56
+ values[i] = (this.__config.value as valueType)(initPie[i], initPie)
57
+
58
+ totalValue += values[i]
59
+ }
60
+
61
+ let beginDeg = Math.PI * -0.5, currenDeg
62
+ for (let i = 0; i < initPie.length; i++) {
63
+ currenDeg = values[i] / totalValue * Math.PI * 2
64
+ const radius = [this.__option.radius[0], this.__option.radius[1] * (1 + (hoverIndex === i ? 0.05 : 0))]
65
+
66
+ const pdeg = beginDeg + currenDeg * 0.5, pradius = Math.max(this.__option.radius[0], this.__option.radius[1])
67
+ const p0 = rotate(pie.cx, pie.cy, pdeg, pie.cx + pradius, pie.cy)
68
+ const p1 = rotate(pie.cx, pie.cy, pdeg, pie.cx + pradius + 15, pie.cy)
69
+
70
+ const pflag = p0[0] > pie.cx ? 1 : -1
71
+ const p2 = [p1[0] + pflag * 20, p1[1]]
72
+ const p3 = [p1[0] + pflag * 25, p1[1]]
73
+
74
+ pie.node[i] = {
75
+ value: values[i],
76
+ name: names[i],
77
+ beginDeg,
78
+ deg: currenDeg,
79
+ isHover: hoverIndex === i,
80
+ radius,
81
+ label: {
82
+ line: [p0, p1, p2],
83
+ position: p3,
84
+ align: pflag === -1 ? "right" : "left"
85
+ }
86
+ }
87
+
88
+ beginDeg += currenDeg
89
+ }
90
+
91
+ return pie
92
+ }
93
+
94
+ bind(initPie: Array<any>, renderBack: (pie: PieResultType) => void) {
95
+ this.__rback = renderBack
96
+ this.__oralPie = initPie
97
+
98
+ this.__prePie = this.use(this.__oralPie, this.__hoverIndex)
99
+ this.__rback(this.__prePie)
100
+
101
+ return this
102
+ }
103
+
104
+ unbind() {
105
+ this.__rback = () => null
106
+ this.__oralPie = null
107
+ this.__prePie = null
108
+ this.__hoverIndex = -1
109
+ return this
110
+ }
111
+
112
+ setHover(index: number) {
113
+ if (!this.__prePie || this.__hoverIndex === index) return this
114
+
115
+ this.__hoverIndex = index
116
+
117
+ this.doUpdate()
118
+ return this
119
+ }
120
+
121
+ doUpdate() {
122
+ const newPie = this.use(this.__oralPie, this.__hoverIndex)
123
+
124
+ const cachePie = JSON.parse(JSON.stringify(newPie))
125
+
126
+ animation((deep) => {
127
+
128
+ if (this.__prePie) {
129
+ for (let i = 0; i < cachePie.count; i++) {
130
+ cachePie.node[i].radius[1] = this.__prePie.node[i].radius[1] + (newPie.node[i].radius[1] - this.__prePie.node[i].radius[1]) * deep
131
+ }
132
+ }
133
+
134
+ this.__rback(cachePie)
135
+
136
+ }, this.__option.duration, () => {
137
+ this.__prePie = newPie
138
+ this.__rback(this.__prePie)
139
+ })
140
+
141
+ return this
142
+ }
143
+ }
144
+
142
145
  export default PieLayout