vislite 0.7.0 → 0.7.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (90) hide show
  1. package/CHANGELOG +11 -1
  2. package/README.md +135 -135
  3. package/lib/Buffer/index.umd.js +2 -2
  4. package/lib/Buffer/index.umd.min.js +2 -2
  5. package/lib/Canvas/index.umd.js +19 -13
  6. package/lib/Canvas/index.umd.min.js +3 -3
  7. package/lib/Cardinal/index.umd.js +2 -2
  8. package/lib/Cardinal/index.umd.min.js +2 -2
  9. package/lib/Eoap/index.umd.js +2 -2
  10. package/lib/Eoap/index.umd.min.js +2 -2
  11. package/lib/Geometry/index.umd.js +2 -2
  12. package/lib/Geometry/index.umd.min.js +2 -2
  13. package/lib/Hermite/index.umd.js +2 -2
  14. package/lib/Hermite/index.umd.min.js +2 -2
  15. package/lib/Matrix4/index.umd.js +2 -2
  16. package/lib/Matrix4/index.umd.min.js +2 -2
  17. package/lib/Mercator/index.umd.js +2 -2
  18. package/lib/Mercator/index.umd.min.js +2 -2
  19. package/lib/OralCanvas/index.es.js +11 -7
  20. package/lib/OralCanvas/index.es.min.js +3 -3
  21. package/lib/OralWebGL/index.es.js +2 -3
  22. package/lib/OralWebGL/index.es.min.js +3 -3
  23. package/lib/SVG/index.umd.js +2 -2
  24. package/lib/SVG/index.umd.min.js +2 -2
  25. package/lib/Shader/index.umd.js +2 -3
  26. package/lib/Shader/index.umd.min.js +3 -3
  27. package/lib/Texture/index.umd.js +2 -2
  28. package/lib/Texture/index.umd.min.js +2 -2
  29. package/lib/TreeLayout/index.umd.js +2 -2
  30. package/lib/TreeLayout/index.umd.min.js +2 -2
  31. package/lib/WebGL/index.umd.js +2 -3
  32. package/lib/WebGL/index.umd.min.js +3 -3
  33. package/lib/animation/index.umd.js +2 -2
  34. package/lib/animation/index.umd.min.js +2 -2
  35. package/lib/formatColor/index.umd.js +2 -2
  36. package/lib/formatColor/index.umd.min.js +2 -2
  37. package/lib/getLoopColors/index.umd.js +2 -2
  38. package/lib/getLoopColors/index.umd.min.js +2 -2
  39. package/lib/getWebGLContext/index.umd.js +2 -2
  40. package/lib/getWebGLContext/index.umd.min.js +2 -2
  41. package/lib/index.umd.js +19 -14
  42. package/lib/index.umd.min.js +3 -3
  43. package/lib/move/index.umd.js +2 -2
  44. package/lib/move/index.umd.min.js +2 -2
  45. package/lib/resizeObserver/index.umd.js +2 -2
  46. package/lib/resizeObserver/index.umd.min.js +2 -2
  47. package/lib/rotate/index.umd.js +2 -2
  48. package/lib/rotate/index.umd.min.js +2 -2
  49. package/lib/ruler/index.umd.js +2 -2
  50. package/lib/ruler/index.umd.min.js +2 -2
  51. package/lib/scale/index.umd.js +2 -2
  52. package/lib/scale/index.umd.min.js +2 -2
  53. package/lib/throttle/index.umd.js +2 -2
  54. package/lib/throttle/index.umd.min.js +2 -2
  55. package/lib/viewHandler/index.umd.js +2 -2
  56. package/lib/viewHandler/index.umd.min.js +2 -2
  57. package/package.json +1 -1
  58. package/src/Canvas.ts +8 -6
  59. package/src/Geometry.ts +0 -1
  60. package/src/Matrix4/rotate.ts +15 -15
  61. package/src/Matrix4/transform.ts +64 -64
  62. package/src/WebGL.ts +66 -66
  63. package/src/common/assemble.ts +22 -22
  64. package/src/common/canvas/index.ts +10 -4
  65. package/src/common/canvas/painter.ts +1 -1
  66. package/src/common/geometry/prism-vertical.ts +40 -40
  67. package/src/common/geometry/tool/rotateLine.ts +35 -35
  68. package/src/common/setStyle.ts +5 -5
  69. package/src/common/svg/config.ts +190 -190
  70. package/src/common/svg/index.ts +356 -356
  71. package/src/common/svg/tool.ts +44 -44
  72. package/src/common/tree/toInnerTree.ts +59 -59
  73. package/src/common/tree/toPlainTree.ts +132 -132
  74. package/src/common/webgl/buffer.ts +79 -79
  75. package/src/common/webgl/doDraw.ts +108 -108
  76. package/src/common/webgl/getWebGLContext.ts +28 -28
  77. package/src/common/webgl/index.ts +226 -226
  78. package/src/common/webgl/shader.ts +1 -1
  79. package/src/common/webgl/texture.ts +97 -97
  80. package/src/layout/TreeLayout.ts +188 -188
  81. package/src/resizeObserver.ts +37 -37
  82. package/src/ruler.ts +209 -209
  83. package/src/viewHandler.ts +160 -160
  84. package/types/Canvas.d.ts +308 -308
  85. package/types/Geometry.d.ts +65 -65
  86. package/types/Object3D.d.ts +114 -114
  87. package/types/SVGConfig.d.ts +79 -79
  88. package/types/Shader.d.ts +23 -21
  89. package/types/TreeConfig.d.ts +36 -36
  90. package/uni-app/ui-canvas.vue +53 -9
@@ -1,189 +1,189 @@
1
- import type TreeLayoutType from '../../types/TreeLayout'
2
- import type { TreeResultType } from '../../types/Tree'
3
- import type TreeOptionType from '../../types/TreeOption'
4
-
5
- import Tree from '../common/tree/index'
6
- import mergeOption from '../common/mergeOption'
7
- import animation from '../animation'
8
- import rotate from '../rotate'
9
-
10
- class TreeLayout extends Tree implements TreeLayoutType {
11
- readonly name: string = 'TreeLayout'
12
-
13
- private __option = {
14
- offsetX: 0,
15
- offsetY: 0,
16
- duration: 500,
17
- type: "plain",
18
- direction: "LR",
19
- x: 100,
20
- y: 100,
21
- width: 100,
22
- height: 100,
23
- radius: 100
24
- }
25
-
26
- private __rback: (tree: TreeResultType) => void
27
- private __oralTree: any
28
- private __preTree: TreeResultType | null
29
-
30
- private __noOpens = {}
31
-
32
- setOption(option: TreeOptionType) {
33
- mergeOption(option, this.__option)
34
- return this
35
- }
36
-
37
- use(initTree: any, noOpens = {}) {
38
- const tree = super.use(initTree, noOpens)
39
-
40
- // 校对偏差
41
- if (this.__option.offsetX != 0 || this.__option.offsetY != 0) {
42
- for (const key in tree.node) {
43
- if (!tree.node[key].show) {
44
-
45
- let deep = 0, pid = key
46
- do {
47
- pid = tree.node[pid].pid
48
- deep++
49
- } while (!tree.node[pid].show)
50
-
51
- tree.node[key].left += this.__option.offsetX * deep
52
- tree.node[key].top += this.__option.offsetY * deep
53
- }
54
- }
55
- }
56
-
57
- if (this.__option.type == 'rect') {
58
- if (this.__option.direction == 'LR' || this.__option.direction == "RL") {
59
-
60
- const perW = this.__option.height / tree.size
61
- const perD = this.__option.width / (tree.deep - 1)
62
-
63
- const balanceW = this.__option.y - this.__option.height * 0.5
64
- const flag = this.__option.direction == 'LR' ? 1 : -1
65
-
66
- for (const key in tree.node) {
67
- if (tree.deep == 1) {
68
- tree.node[key].left = this.__option.x + this.__option.width * 0.5 * flag
69
- tree.node[key].top = this.__option.y
70
- } else {
71
- tree.node[key].left = this.__option.x + (tree.node[key].left - 0.5) * perD * flag
72
- tree.node[key].top = tree.node[key].top * perW + balanceW
73
- }
74
- }
75
- } else if (this.__option.direction == 'TB' || this.__option.direction == "BT") {
76
-
77
- const perW = this.__option.width / tree.size
78
- const perD = this.__option.height / (tree.deep - 1)
79
-
80
- const balanceW = this.__option.x - this.__option.width * 0.5
81
- const flag = this.__option.direction == 'TB' ? 1 : -1
82
-
83
- for (const key in tree.node) {
84
- if (tree.deep == 1) {
85
- tree.node[key].left = this.__option.x
86
- tree.node[key].top = this.__option.y + this.__option.height * 0.5 * flag
87
- } else {
88
- const left = tree.node[key].left
89
-
90
- tree.node[key].left = tree.node[key].top * perW + balanceW
91
- tree.node[key].top = this.__option.y + (left - 0.5) * perD * flag
92
- }
93
- }
94
-
95
- }
96
-
97
- } else if (this.__option.type == 'circle') {
98
- const cx = this.__option.x, cy = this.__option.y
99
- const deg = Math.PI * 2 / tree.size
100
- const per = this.__option.radius / (tree.deep - 1)
101
-
102
- for (const key in tree.node) {
103
- if (tree.node[key].left == 0.5) {
104
- tree.node[key].left = cx
105
- tree.node[key].top = cy
106
- } else {
107
- const position = rotate(cx, cy, deg * tree.node[key].top, cx + (tree.node[key].left - 0.5) * per, cy)
108
-
109
- tree.node[key].left = position[0]
110
- tree.node[key].top = position[1]
111
- }
112
- }
113
- }
114
-
115
- return tree
116
- }
117
-
118
- bind(initTree: any, renderBack: (tree: TreeResultType) => void, noOpens = {}) {
119
- this.__rback = renderBack
120
- this.__oralTree = initTree
121
- this.__noOpens = noOpens
122
-
123
- this.__preTree = this.use(this.__oralTree, this.__noOpens)
124
- this.__rback(this.__preTree)
125
-
126
- return this
127
- }
128
-
129
- unbind() {
130
- this.__rback = () => null
131
- this.__oralTree = null
132
- this.__preTree = null
133
- this.__noOpens = {}
134
- return this
135
- }
136
-
137
- private doUpdate() {
138
- const newTree = this.use(this.__oralTree, this.__noOpens)
139
-
140
- const cacheTree = JSON.parse(JSON.stringify(newTree))
141
-
142
- animation((deep) => {
143
-
144
- if (this.__preTree) {
145
- for (const key in cacheTree.node) {
146
- if (newTree.node[key].show || this.__preTree.node[key].show) {
147
- cacheTree.node[key].show = true
148
-
149
- cacheTree.node[key].left = this.__preTree.node[key].left + (newTree.node[key].left - this.__preTree.node[key].left) * deep
150
- cacheTree.node[key].top = this.__preTree.node[key].top + (newTree.node[key].top - this.__preTree.node[key].top) * deep
151
- }
152
- }
153
- }
154
- this.__rback(cacheTree)
155
-
156
-
157
- }, this.__option.duration, () => {
158
- this.__preTree = newTree
159
- this.__rback(this.__preTree)
160
- })
161
- }
162
-
163
- closeNode(id: string) {
164
- if (!this.__preTree) return this
165
- this.__noOpens[id] = true
166
-
167
- this.doUpdate()
168
- return this
169
- }
170
-
171
- openNode(id: string) {
172
- if (!this.__preTree) return this
173
- this.__noOpens[id] = false
174
-
175
- this.doUpdate()
176
- return this
177
- }
178
-
179
- toggleNode(id: string) {
180
- if (!this.__preTree) return this
181
- this.__noOpens[id] = !this.__noOpens[id]
182
-
183
- this.doUpdate()
184
- return this
185
- }
186
-
187
- }
188
-
1
+ import type TreeLayoutType from '../../types/TreeLayout'
2
+ import type { TreeResultType } from '../../types/Tree'
3
+ import type TreeOptionType from '../../types/TreeOption'
4
+
5
+ import Tree from '../common/tree/index'
6
+ import mergeOption from '../common/mergeOption'
7
+ import animation from '../animation'
8
+ import rotate from '../rotate'
9
+
10
+ class TreeLayout extends Tree implements TreeLayoutType {
11
+ readonly name: string = 'TreeLayout'
12
+
13
+ private __option = {
14
+ offsetX: 0,
15
+ offsetY: 0,
16
+ duration: 500,
17
+ type: "plain",
18
+ direction: "LR",
19
+ x: 100,
20
+ y: 100,
21
+ width: 100,
22
+ height: 100,
23
+ radius: 100
24
+ }
25
+
26
+ private __rback: (tree: TreeResultType) => void
27
+ private __oralTree: any
28
+ private __preTree: TreeResultType | null
29
+
30
+ private __noOpens = {}
31
+
32
+ setOption(option: TreeOptionType) {
33
+ mergeOption(option, this.__option)
34
+ return this
35
+ }
36
+
37
+ use(initTree: any, noOpens = {}) {
38
+ const tree = super.use(initTree, noOpens)
39
+
40
+ // 校对偏差
41
+ if (this.__option.offsetX != 0 || this.__option.offsetY != 0) {
42
+ for (const key in tree.node) {
43
+ if (!tree.node[key].show) {
44
+
45
+ let deep = 0, pid = key
46
+ do {
47
+ pid = tree.node[pid].pid
48
+ deep++
49
+ } while (!tree.node[pid].show)
50
+
51
+ tree.node[key].left += this.__option.offsetX * deep
52
+ tree.node[key].top += this.__option.offsetY * deep
53
+ }
54
+ }
55
+ }
56
+
57
+ if (this.__option.type == 'rect') {
58
+ if (this.__option.direction == 'LR' || this.__option.direction == "RL") {
59
+
60
+ const perW = this.__option.height / tree.size
61
+ const perD = this.__option.width / (tree.deep - 1)
62
+
63
+ const balanceW = this.__option.y - this.__option.height * 0.5
64
+ const flag = this.__option.direction == 'LR' ? 1 : -1
65
+
66
+ for (const key in tree.node) {
67
+ if (tree.deep == 1) {
68
+ tree.node[key].left = this.__option.x + this.__option.width * 0.5 * flag
69
+ tree.node[key].top = this.__option.y
70
+ } else {
71
+ tree.node[key].left = this.__option.x + (tree.node[key].left - 0.5) * perD * flag
72
+ tree.node[key].top = tree.node[key].top * perW + balanceW
73
+ }
74
+ }
75
+ } else if (this.__option.direction == 'TB' || this.__option.direction == "BT") {
76
+
77
+ const perW = this.__option.width / tree.size
78
+ const perD = this.__option.height / (tree.deep - 1)
79
+
80
+ const balanceW = this.__option.x - this.__option.width * 0.5
81
+ const flag = this.__option.direction == 'TB' ? 1 : -1
82
+
83
+ for (const key in tree.node) {
84
+ if (tree.deep == 1) {
85
+ tree.node[key].left = this.__option.x
86
+ tree.node[key].top = this.__option.y + this.__option.height * 0.5 * flag
87
+ } else {
88
+ const left = tree.node[key].left
89
+
90
+ tree.node[key].left = tree.node[key].top * perW + balanceW
91
+ tree.node[key].top = this.__option.y + (left - 0.5) * perD * flag
92
+ }
93
+ }
94
+
95
+ }
96
+
97
+ } else if (this.__option.type == 'circle') {
98
+ const cx = this.__option.x, cy = this.__option.y
99
+ const deg = Math.PI * 2 / tree.size
100
+ const per = this.__option.radius / (tree.deep - 1)
101
+
102
+ for (const key in tree.node) {
103
+ if (tree.node[key].left == 0.5) {
104
+ tree.node[key].left = cx
105
+ tree.node[key].top = cy
106
+ } else {
107
+ const position = rotate(cx, cy, deg * tree.node[key].top, cx + (tree.node[key].left - 0.5) * per, cy)
108
+
109
+ tree.node[key].left = position[0]
110
+ tree.node[key].top = position[1]
111
+ }
112
+ }
113
+ }
114
+
115
+ return tree
116
+ }
117
+
118
+ bind(initTree: any, renderBack: (tree: TreeResultType) => void, noOpens = {}) {
119
+ this.__rback = renderBack
120
+ this.__oralTree = initTree
121
+ this.__noOpens = noOpens
122
+
123
+ this.__preTree = this.use(this.__oralTree, this.__noOpens)
124
+ this.__rback(this.__preTree)
125
+
126
+ return this
127
+ }
128
+
129
+ unbind() {
130
+ this.__rback = () => null
131
+ this.__oralTree = null
132
+ this.__preTree = null
133
+ this.__noOpens = {}
134
+ return this
135
+ }
136
+
137
+ private doUpdate() {
138
+ const newTree = this.use(this.__oralTree, this.__noOpens)
139
+
140
+ const cacheTree = JSON.parse(JSON.stringify(newTree))
141
+
142
+ animation((deep) => {
143
+
144
+ if (this.__preTree) {
145
+ for (const key in cacheTree.node) {
146
+ if (newTree.node[key].show || this.__preTree.node[key].show) {
147
+ cacheTree.node[key].show = true
148
+
149
+ cacheTree.node[key].left = this.__preTree.node[key].left + (newTree.node[key].left - this.__preTree.node[key].left) * deep
150
+ cacheTree.node[key].top = this.__preTree.node[key].top + (newTree.node[key].top - this.__preTree.node[key].top) * deep
151
+ }
152
+ }
153
+ }
154
+ this.__rback(cacheTree)
155
+
156
+
157
+ }, this.__option.duration, () => {
158
+ this.__preTree = newTree
159
+ this.__rback(this.__preTree)
160
+ })
161
+ }
162
+
163
+ closeNode(id: string) {
164
+ if (!this.__preTree) return this
165
+ this.__noOpens[id] = true
166
+
167
+ this.doUpdate()
168
+ return this
169
+ }
170
+
171
+ openNode(id: string) {
172
+ if (!this.__preTree) return this
173
+ this.__noOpens[id] = false
174
+
175
+ this.doUpdate()
176
+ return this
177
+ }
178
+
179
+ toggleNode(id: string) {
180
+ if (!this.__preTree) return this
181
+ this.__noOpens[id] = !this.__noOpens[id]
182
+
183
+ this.doUpdate()
184
+ return this
185
+ }
186
+
187
+ }
188
+
189
189
  export default TreeLayout
@@ -1,38 +1,38 @@
1
- let observer: ResizeObserver
2
-
3
- const attrValueToCallback = {}
4
- let uniqueid = 0
5
-
6
- export default function (el: HTMLElement | null, callback: Function) {
7
-
8
- try {
9
-
10
- if (!observer) {
11
- observer = new ResizeObserver(entries => {
12
- for (const entry of entries) {
13
- attrValueToCallback[(entry.target as any)._resize_observer_]()
14
- }
15
- })
16
- }
17
-
18
- uniqueid++
19
-
20
- (el as any)._resize_observer_ = uniqueid
21
- attrValueToCallback[uniqueid] = callback
22
-
23
- observer.observe(el as HTMLElement)
24
-
25
- return function () {
26
- if (observer) {
27
- observer.unobserve(el as HTMLElement)
28
- delete attrValueToCallback[(el as any)._resize_observer_]
29
- }
30
- }
31
-
32
- } catch (e) {
33
- callback()
34
-
35
- // 如果浏览器不支持此接口
36
- console.error('ResizeObserver undefined!')
37
- }
1
+ let observer: ResizeObserver
2
+
3
+ const attrValueToCallback = {}
4
+ let uniqueid = 0
5
+
6
+ export default function (el: HTMLElement | null, callback: Function) {
7
+
8
+ try {
9
+
10
+ if (!observer) {
11
+ observer = new ResizeObserver(entries => {
12
+ for (const entry of entries) {
13
+ attrValueToCallback[(entry.target as any)._resize_observer_]()
14
+ }
15
+ })
16
+ }
17
+
18
+ uniqueid++
19
+
20
+ (el as any)._resize_observer_ = uniqueid
21
+ attrValueToCallback[uniqueid] = callback
22
+
23
+ observer.observe(el as HTMLElement)
24
+
25
+ return function () {
26
+ if (observer) {
27
+ observer.unobserve(el as HTMLElement)
28
+ delete attrValueToCallback[(el as any)._resize_observer_]
29
+ }
30
+ }
31
+
32
+ } catch (e) {
33
+ callback()
34
+
35
+ // 如果浏览器不支持此接口
36
+ console.error('ResizeObserver undefined!')
37
+ }
38
38
  }