vislite 0.4.1 → 0.5.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 (180) hide show
  1. package/.editorconfig +18 -18
  2. package/AUTHORS.txt +6 -6
  3. package/CHANGELOG +16 -0
  4. package/LICENSE +20 -20
  5. package/README.md +69 -69
  6. package/lib/Buffer/index.umd.js +3 -3
  7. package/lib/Buffer/index.umd.min.js +3 -3
  8. package/lib/Canvas/index.umd.js +3 -3
  9. package/lib/Canvas/index.umd.min.js +3 -3
  10. package/lib/Cardinal/index.umd.js +3 -3
  11. package/lib/Cardinal/index.umd.min.js +3 -3
  12. package/lib/Eoap/index.umd.js +3 -3
  13. package/lib/Eoap/index.umd.min.js +3 -3
  14. package/lib/Geometry/index.umd.js +205 -0
  15. package/lib/Geometry/index.umd.min.js +11 -0
  16. package/lib/Hermite/index.umd.js +3 -3
  17. package/lib/Hermite/index.umd.min.js +3 -3
  18. package/lib/Matrix4/index.umd.js +3 -3
  19. package/lib/Matrix4/index.umd.min.js +3 -3
  20. package/lib/Mercator/index.umd.js +5 -4
  21. package/lib/Mercator/index.umd.min.js +4 -4
  22. package/lib/OralCanvas/index.es.js +3 -3
  23. package/lib/OralCanvas/index.es.min.js +3 -3
  24. package/lib/OralWebGL/index.es.js +11 -11
  25. package/lib/OralWebGL/index.es.min.js +4 -4
  26. package/lib/SVG/index.umd.js +10 -4
  27. package/lib/SVG/index.umd.min.js +4 -4
  28. package/lib/Shader/index.umd.js +11 -11
  29. package/lib/Shader/index.umd.min.js +4 -4
  30. package/lib/Texture/index.umd.js +3 -3
  31. package/lib/Texture/index.umd.min.js +3 -3
  32. package/lib/TreeLayout/index.umd.js +8 -5
  33. package/lib/TreeLayout/index.umd.min.js +4 -4
  34. package/lib/WebGL/index.umd.js +11 -11
  35. package/lib/WebGL/index.umd.min.js +4 -4
  36. package/lib/animation/index.umd.js +3 -3
  37. package/lib/animation/index.umd.min.js +3 -3
  38. package/lib/formatColor/index.umd.js +3 -3
  39. package/lib/formatColor/index.umd.min.js +3 -3
  40. package/lib/getLoopColors/index.umd.js +3 -3
  41. package/lib/getLoopColors/index.umd.min.js +3 -3
  42. package/lib/getWebGLContext/index.umd.js +3 -3
  43. package/lib/getWebGLContext/index.umd.min.js +3 -3
  44. package/lib/index.umd.js +166 -16
  45. package/lib/index.umd.min.js +4 -4
  46. package/lib/resizeObserver/index.umd.js +3 -3
  47. package/lib/resizeObserver/index.umd.min.js +3 -3
  48. package/lib/rotate/index.umd.js +3 -3
  49. package/lib/rotate/index.umd.min.js +3 -3
  50. package/lib/ruler/index.umd.js +3 -3
  51. package/lib/ruler/index.umd.min.js +3 -3
  52. package/lib/throttle/index.umd.js +3 -3
  53. package/lib/throttle/index.umd.min.js +3 -3
  54. package/lib/viewHandler/index.umd.js +3 -3
  55. package/lib/viewHandler/index.umd.min.js +3 -3
  56. package/miniprogram/ui-canvas/index.js +107 -107
  57. package/miniprogram/ui-canvas/index.json +4 -4
  58. package/miniprogram/ui-canvas/index.wxml +4 -4
  59. package/miniprogram/ui-canvas/index.wxss +5 -5
  60. package/package/Buffer/index.ts +2 -2
  61. package/package/Canvas/index.ts +2 -2
  62. package/package/Cardinal/index.ts +2 -2
  63. package/package/Eoap/index.ts +2 -2
  64. package/package/Geometry/index.ts +3 -0
  65. package/package/Hermite/index.ts +2 -2
  66. package/package/Matrix4/index.ts +2 -2
  67. package/package/Mercator/index.ts +2 -2
  68. package/package/OralCanvas/index.ts +2 -2
  69. package/package/OralWebGL/index.ts +2 -2
  70. package/package/SVG/index.ts +2 -2
  71. package/package/Shader/index.ts +39 -39
  72. package/package/Texture/index.ts +2 -2
  73. package/package/TreeLayout/index.ts +2 -2
  74. package/package/WebGL/index.ts +2 -2
  75. package/package/animation/index.ts +2 -2
  76. package/package/formatColor/index.ts +2 -2
  77. package/package/getLoopColors/index.ts +2 -2
  78. package/package/getWebGLContext/index.ts +39 -39
  79. package/package/index.ts +6 -1
  80. package/package/resizeObserver/index.ts +2 -2
  81. package/package/rotate/index.ts +2 -2
  82. package/package/ruler/index.ts +2 -2
  83. package/package/throttle/index.ts +2 -2
  84. package/package/viewHandler/index.ts +2 -2
  85. package/package.json +3 -1
  86. package/src/Canvas.ts +67 -67
  87. package/src/Eoap.ts +1 -1
  88. package/src/Geometry.ts +83 -0
  89. package/src/Matrix4/index.ts +2 -2
  90. package/src/Matrix4/move.ts +12 -12
  91. package/src/Matrix4/rotate.ts +15 -15
  92. package/src/Matrix4/scale.ts +11 -11
  93. package/src/Matrix4/transform.ts +64 -64
  94. package/src/Mercator.ts +3 -2
  95. package/src/SVG.ts +24 -24
  96. package/src/TreeLayout/index.ts +4 -3
  97. package/src/WebGL.ts +66 -66
  98. package/src/animation.ts +98 -98
  99. package/src/common/assemble.ts +22 -22
  100. package/src/common/canvas/arc.ts +50 -50
  101. package/src/common/canvas/config.ts +158 -158
  102. package/src/common/canvas/gradient.ts +29 -29
  103. package/src/common/canvas/index.ts +168 -168
  104. package/src/common/canvas/painter.ts +426 -426
  105. package/src/common/canvas/texts.ts +18 -18
  106. package/src/common/geometry/prism-horizontal.ts +33 -0
  107. package/src/common/geometry/prism-vertical.ts +40 -0
  108. package/src/common/geometry/sphere-fragment.ts +39 -0
  109. package/src/common/geometry/tool/circle.ts +12 -0
  110. package/src/common/mergeOption.ts +6 -6
  111. package/src/common/setStyle.ts +5 -5
  112. package/src/common/svg/config.ts +174 -174
  113. package/src/common/svg/index.ts +9 -1
  114. package/src/common/svg/tool.ts +44 -44
  115. package/src/common/tree/index.ts +25 -25
  116. package/src/common/tree/toInnerTree.ts +56 -56
  117. package/src/common/tree/toPlainTree.ts +131 -131
  118. package/src/common/webgl/buffer.ts +79 -79
  119. package/src/common/webgl/doDraw.ts +108 -108
  120. package/src/common/webgl/getColorFactory.ts +26 -26
  121. package/src/common/webgl/getShader.ts +48 -48
  122. package/src/common/webgl/getTexture.ts +11 -11
  123. package/src/common/webgl/getWebGLContext.ts +27 -27
  124. package/src/common/webgl/index.ts +223 -223
  125. package/src/common/webgl/shader.ts +75 -75
  126. package/src/common/webgl/texture.ts +96 -96
  127. package/src/formatColor.ts +44 -44
  128. package/src/getLoopColors.ts +42 -42
  129. package/src/interpolation/Cardinal.ts +110 -110
  130. package/src/interpolation/Hermite.ts +65 -65
  131. package/src/resizeObserver.ts +36 -36
  132. package/src/rotate.ts +1 -1
  133. package/src/ruler.ts +188 -188
  134. package/src/shader/fsColor.c +7 -7
  135. package/src/shader/fsColors.c +7 -7
  136. package/src/shader/fsCube.c +8 -8
  137. package/src/shader/fsImage.c +8 -8
  138. package/src/shader/vsColor.c +17 -17
  139. package/src/shader/vsColors.c +13 -13
  140. package/src/shader/vsCube.c +13 -13
  141. package/src/shader/vsImage.c +13 -13
  142. package/src/throttle.ts +51 -51
  143. package/src/viewHandler.ts +158 -158
  144. package/types/Buffer.d.ts +23 -23
  145. package/types/Canvas.d.ts +300 -300
  146. package/types/CanvasConfig.d.ts +24 -0
  147. package/types/CanvasOption.d.ts +7 -7
  148. package/types/Cardinal.d.ts +13 -13
  149. package/types/Geometry.d.ts +41 -0
  150. package/types/GeometryOption.d.ts +12 -0
  151. package/types/GeometryResult.d.ts +19 -0
  152. package/types/Gradient.d.ts +14 -14
  153. package/types/Hermite.d.ts +18 -18
  154. package/types/Map.d.ts +2 -2
  155. package/types/Matrix4.d.ts +4 -4
  156. package/types/Object3D.d.ts +114 -114
  157. package/types/SVG.d.ts +18 -13
  158. package/types/SVGConfig.d.ts +76 -60
  159. package/types/Scene3D.d.ts +6 -6
  160. package/types/Shader.d.ts +21 -21
  161. package/types/Texture.d.ts +16 -16
  162. package/types/Tree.d.ts +69 -69
  163. package/types/TreeConfig.d.ts +24 -24
  164. package/types/TreeLayout.d.ts +8 -2
  165. package/types/TreeOption.d.ts +48 -48
  166. package/types/WebGL.d.ts +38 -38
  167. package/types/WebGLOption.d.ts +7 -7
  168. package/types/animation.d.ts +6 -6
  169. package/types/formatColor.d.ts +2 -2
  170. package/types/getLoopColors.d.ts +2 -2
  171. package/types/getWebGLContext.d.ts +2 -2
  172. package/types/index.d.ts +15 -1
  173. package/types/painterConfig.d.ts +2 -2
  174. package/types/resizeObserver.d.ts +2 -2
  175. package/types/rotate.d.ts +1 -1
  176. package/types/ruler.d.ts +7 -7
  177. package/types/throttle.d.ts +4 -4
  178. package/types/throttleOption.d.ts +21 -21
  179. package/types/viewHandler.d.ts +13 -13
  180. package/uni-app/ui-canvas.vue +222 -222
@@ -1,26 +1,26 @@
1
- import type TreeConfigType from '../../../types/TreeConfig'
2
- import type { TreeResultType } from '../../../types/Tree'
3
-
4
- import toPlainTree from './toPlainTree'
5
- import mergeOption from '../mergeOption'
6
-
7
- class Tree {
8
- readonly name: string = 'Tree'
9
-
10
- private __config: TreeConfigType
11
-
12
- constructor(config: TreeConfigType = {}) {
13
- this.__config = mergeOption(config, {
14
- root: (initTree: any) => initTree,
15
- children: (parentTree: any) => parentTree.children,
16
- id: (treedata: any) => treedata.name
17
- })
18
- }
19
-
20
- use(initTree: any, noOpens = {}): TreeResultType {
21
- return toPlainTree(initTree, this.__config, noOpens)
22
- }
23
-
24
- }
25
-
1
+ import type TreeConfigType from '../../../types/TreeConfig'
2
+ import type { TreeResultType } from '../../../types/Tree'
3
+
4
+ import toPlainTree from './toPlainTree'
5
+ import mergeOption from '../mergeOption'
6
+
7
+ class Tree {
8
+ readonly name: string = 'Tree'
9
+
10
+ private __config: TreeConfigType
11
+
12
+ constructor(config: TreeConfigType = {}) {
13
+ this.__config = mergeOption(config, {
14
+ root: (initTree: any) => initTree,
15
+ children: (parentTree: any) => parentTree.children,
16
+ id: (treedata: any) => treedata.name
17
+ })
18
+ }
19
+
20
+ use(initTree: any, noOpens = {}): TreeResultType {
21
+ return toPlainTree(initTree, this.__config, noOpens)
22
+ }
23
+
24
+ }
25
+
26
26
  export default Tree
@@ -1,57 +1,57 @@
1
- import type TreeConfigType from '../../../types/TreeConfig'
2
-
3
- /**
4
- * 根据配置的层次关系(配置的id,child,root)把原始数据变成内部结构,方便后期位置计算
5
- *
6
- * tempTree[id] = {
7
- * "data": 原始数据,
8
- * "pid": 父亲ID,
9
- * "id": 唯一标识ID,
10
- * "show": boolean,
11
- * "isOpen": boolean,
12
- * "children": [cid1、cid2、...]
13
- * }
14
- */
15
- export default (initTree: any, config: TreeConfigType) => {
16
- let tempTree = {}
17
-
18
- // 根结点
19
- let temp = config.root(initTree), id: number | string, rid: number | string
20
- id = rid = config.id(temp)
21
- tempTree[id] = {
22
- "data": temp,
23
- "pid": null,
24
- "id": id,
25
- "isOpen": true,
26
- "show": true,
27
- "children": []
28
- }
29
-
30
- let num: number = 1
31
-
32
- // 根据传递的原始数据,生成内部统一结构
33
- ; (function createTree(pdata: any, pid: number | string) {
34
- var children = config.children(pdata, initTree)
35
- num += children ? children.length : 0
36
- for (let flag = 0; children && flag < children.length; flag++) {
37
- id = config.id(children[flag])
38
- tempTree[pid].children.push(id);
39
- tempTree[id] = {
40
- "data": children[flag],
41
- "pid": pid,
42
- "id": id,
43
- "isOpen": true,
44
- "show": true,
45
- "children": []
46
- }
47
- createTree(children[flag], id)
48
- }
49
- })(temp, id)
50
-
51
- return {
52
- rid,
53
- value: tempTree,
54
- num
55
- }
56
-
1
+ import type TreeConfigType from '../../../types/TreeConfig'
2
+
3
+ /**
4
+ * 根据配置的层次关系(配置的id,child,root)把原始数据变成内部结构,方便后期位置计算
5
+ *
6
+ * tempTree[id] = {
7
+ * "data": 原始数据,
8
+ * "pid": 父亲ID,
9
+ * "id": 唯一标识ID,
10
+ * "show": boolean,
11
+ * "isOpen": boolean,
12
+ * "children": [cid1、cid2、...]
13
+ * }
14
+ */
15
+ export default (initTree: any, config: TreeConfigType) => {
16
+ let tempTree = {}
17
+
18
+ // 根结点
19
+ let temp = config.root(initTree), id: number | string, rid: number | string
20
+ id = rid = config.id(temp)
21
+ tempTree[id] = {
22
+ "data": temp,
23
+ "pid": null,
24
+ "id": id,
25
+ "isOpen": true,
26
+ "show": true,
27
+ "children": []
28
+ }
29
+
30
+ let num: number = 1
31
+
32
+ // 根据传递的原始数据,生成内部统一结构
33
+ ; (function createTree(pdata: any, pid: number | string) {
34
+ var children = config.children(pdata, initTree)
35
+ num += children ? children.length : 0
36
+ for (let flag = 0; children && flag < children.length; flag++) {
37
+ id = config.id(children[flag])
38
+ tempTree[pid].children.push(id);
39
+ tempTree[id] = {
40
+ "data": children[flag],
41
+ "pid": pid,
42
+ "id": id,
43
+ "isOpen": true,
44
+ "show": true,
45
+ "children": []
46
+ }
47
+ createTree(children[flag], id)
48
+ }
49
+ })(temp, id)
50
+
51
+ return {
52
+ rid,
53
+ value: tempTree,
54
+ num
55
+ }
56
+
57
57
  }
@@ -1,132 +1,132 @@
1
- import type TreeConfigType from '../../../types/TreeConfig'
2
-
3
- import toInnerTree from './toInnerTree'
4
-
5
- // 可以传递任意格式的树原始数据
6
- // 只要配置对应的解析方法即可
7
- export default function (initTree: any, config: TreeConfigType, noOpens: {}) {
8
- let treeData = toInnerTree(initTree, config)
9
-
10
- let alltreedata = treeData.value // 维护的树
11
- let rootid = treeData.rid // 根结点ID
12
-
13
- if (treeData.num == 1) {
14
- alltreedata[rootid].left = 0.5
15
- alltreedata[rootid].top = 0.5
16
- alltreedata[rootid].show = true
17
- return {
18
- deep: 1,
19
- node: alltreedata,
20
- root: rootid,
21
- size: 1
22
- }
23
- } else {
24
-
25
- let beforeDis = [], size = 0, maxDeep = 0
26
-
27
- if (noOpens[rootid]) {
28
- alltreedata[rootid].left = 0.5
29
- alltreedata[rootid].top = 0.5
30
- alltreedata[rootid].show = true
31
-
32
- size = 1
33
- } else {
34
- ; (function positionCalc(pNode, deep) {
35
-
36
- if (deep > maxDeep) maxDeep = deep
37
-
38
- let flag: number = 0
39
- if (!noOpens[pNode.id]) {
40
-
41
- for (flag = 0; flag < pNode.children.length; flag++)
42
-
43
- // 因为全部的子结点的位置确定了,父结点的y位置就是子结点的中间位置
44
- // 因此有子结点的,先计算子结点
45
- positionCalc(alltreedata[pNode.children[flag]], deep + 1)
46
-
47
- }
48
-
49
- // left的位置比较简单,deep从0开始编号
50
- // 比如deep=0,第一层,left=0+0.5=0.5,也就是根结点
51
- alltreedata[pNode.id].left = deep + 0.5
52
- if (flag == 0) {
53
-
54
- // beforeDis是一个数组,用以记录每一层此刻top下边缘(每一层是从上到下)
55
- // 比如一层的第一个,top值最小可以取top=0.5
56
- // 为了方便计算,beforeDis[deep] == undefined的时候表示现在准备计算的是这层的第一个结点
57
- // 因此设置最低上边缘为-0.5
58
- if (beforeDis[deep] == void 0) beforeDis[deep] = -0.5
59
- // 父边缘同意的进行初始化
60
- if (beforeDis[deep - 1] == void 0) beforeDis[deep - 1] = -0.5
61
-
62
- // 添加的新结点top值第一种求法:本层上边缘+1(比如上边缘是-0.5,那么top最小是top=-0.5+1=0.5)
63
- alltreedata[pNode.id].top = beforeDis[deep] + 1
64
-
65
- let pTop = beforeDis[deep] + 1 + (alltreedata[pNode.pid].children.length - 1) * 0.5
66
- // 计算的原则是:如果第一种可行,选择第一种,否则必须选择第二种
67
- // 判断第一种是否可行的方法就是:如果第一种计算后确定的孩子上边缘不对导致孩子和孩子的前兄弟重合就是可行的
68
- if (pTop - 1 < beforeDis[deep - 1])
69
- // 必须保证父亲结点和父亲的前一个兄弟保存1的距离,至少
70
- // 添加的新结点top值的第二种求法:根据孩子取孩子结点的中心top
71
- alltreedata[pNode.id].top = beforeDis[deep - 1] + 1 - (alltreedata[pNode.pid].children.length - 1) * 0.5
72
-
73
- } else {
74
-
75
- // 此刻flag!=0
76
- // 意味着结点有孩子,那么问题就解决了,直接取孩子的中间即可
77
- // 其实,flag==0的分支计算的就是孩子,是没有孩子的叶结点,那是关键
78
- alltreedata[pNode.id].top = (alltreedata[pNode.children[0]].top + alltreedata[pNode.children[flag - 1]].top) * 0.5
79
- }
80
-
81
- // 因为计算孩子的时候
82
- // 无法掌握父辈兄弟的情况
83
- // 可能会出现父亲和兄弟重叠问题
84
- if (alltreedata[pNode.id].top <= beforeDis[deep]) {
85
- let needUp = beforeDis[deep] + 1 - alltreedata[pNode.id].top
86
- (function doUp(_pid: number | string, _deep: number) {
87
- alltreedata[_pid].top += needUp;
88
- if (beforeDis[_deep] < alltreedata[_pid].top) beforeDis[_deep] = alltreedata[_pid].top
89
-
90
- for (let _flag = 0; _flag < alltreedata[_pid].children.length; _flag++) {
91
- doUp(alltreedata[_pid].children[_flag], _deep + 1)
92
- }
93
- })(pNode.id, deep)
94
- }
95
-
96
- // 计算好一个结点后,需要更新此刻该层的上边缘
97
- beforeDis[deep] = alltreedata[pNode.id].top
98
-
99
- // size在每次计算一个结点后更新,是为了最终绘图的时候知道树有多宽(此处应该叫高)
100
- if (alltreedata[pNode.id].top + 0.5 > size) size = alltreedata[pNode.id].top + 0.5
101
-
102
- })(alltreedata[rootid], 0)
103
-
104
- }
105
- // 对于不显示的,需要标记一下
106
- for (let key in noOpens) {
107
- if (noOpens[key]) {
108
- alltreedata[key].isOpen = false
109
- ; (function updateHidden(pid, left, top) {
110
- for (let index = 0; index < alltreedata[pid].children.length; index++) {
111
- alltreedata[alltreedata[pid].children[index]].left = left
112
- alltreedata[alltreedata[pid].children[index]].top = top
113
- alltreedata[alltreedata[pid].children[index]].show = false
114
-
115
- updateHidden(alltreedata[pid].children[index], left, top)
116
- }
117
- })(key, alltreedata[key].left, alltreedata[key].top)
118
- }
119
- }
120
-
121
- // 传递的参数分别表示:记录了位置信息的树结点集合、根结点ID和树的宽
122
- return {
123
- "node": alltreedata,
124
- "root": rootid,
125
- "size": size,
126
- "deep": maxDeep + 1
127
- }
128
-
129
- }
130
-
131
-
1
+ import type TreeConfigType from '../../../types/TreeConfig'
2
+
3
+ import toInnerTree from './toInnerTree'
4
+
5
+ // 可以传递任意格式的树原始数据
6
+ // 只要配置对应的解析方法即可
7
+ export default function (initTree: any, config: TreeConfigType, noOpens: {}) {
8
+ let treeData = toInnerTree(initTree, config)
9
+
10
+ let alltreedata = treeData.value // 维护的树
11
+ let rootid = treeData.rid // 根结点ID
12
+
13
+ if (treeData.num == 1) {
14
+ alltreedata[rootid].left = 0.5
15
+ alltreedata[rootid].top = 0.5
16
+ alltreedata[rootid].show = true
17
+ return {
18
+ deep: 1,
19
+ node: alltreedata,
20
+ root: rootid,
21
+ size: 1
22
+ }
23
+ } else {
24
+
25
+ let beforeDis = [], size = 0, maxDeep = 0
26
+
27
+ if (noOpens[rootid]) {
28
+ alltreedata[rootid].left = 0.5
29
+ alltreedata[rootid].top = 0.5
30
+ alltreedata[rootid].show = true
31
+
32
+ size = 1
33
+ } else {
34
+ ; (function positionCalc(pNode, deep) {
35
+
36
+ if (deep > maxDeep) maxDeep = deep
37
+
38
+ let flag: number = 0
39
+ if (!noOpens[pNode.id]) {
40
+
41
+ for (flag = 0; flag < pNode.children.length; flag++)
42
+
43
+ // 因为全部的子结点的位置确定了,父结点的y位置就是子结点的中间位置
44
+ // 因此有子结点的,先计算子结点
45
+ positionCalc(alltreedata[pNode.children[flag]], deep + 1)
46
+
47
+ }
48
+
49
+ // left的位置比较简单,deep从0开始编号
50
+ // 比如deep=0,第一层,left=0+0.5=0.5,也就是根结点
51
+ alltreedata[pNode.id].left = deep + 0.5
52
+ if (flag == 0) {
53
+
54
+ // beforeDis是一个数组,用以记录每一层此刻top下边缘(每一层是从上到下)
55
+ // 比如一层的第一个,top值最小可以取top=0.5
56
+ // 为了方便计算,beforeDis[deep] == undefined的时候表示现在准备计算的是这层的第一个结点
57
+ // 因此设置最低上边缘为-0.5
58
+ if (beforeDis[deep] == void 0) beforeDis[deep] = -0.5
59
+ // 父边缘同意的进行初始化
60
+ if (beforeDis[deep - 1] == void 0) beforeDis[deep - 1] = -0.5
61
+
62
+ // 添加的新结点top值第一种求法:本层上边缘+1(比如上边缘是-0.5,那么top最小是top=-0.5+1=0.5)
63
+ alltreedata[pNode.id].top = beforeDis[deep] + 1
64
+
65
+ let pTop = beforeDis[deep] + 1 + (alltreedata[pNode.pid].children.length - 1) * 0.5
66
+ // 计算的原则是:如果第一种可行,选择第一种,否则必须选择第二种
67
+ // 判断第一种是否可行的方法就是:如果第一种计算后确定的孩子上边缘不对导致孩子和孩子的前兄弟重合就是可行的
68
+ if (pTop - 1 < beforeDis[deep - 1])
69
+ // 必须保证父亲结点和父亲的前一个兄弟保存1的距离,至少
70
+ // 添加的新结点top值的第二种求法:根据孩子取孩子结点的中心top
71
+ alltreedata[pNode.id].top = beforeDis[deep - 1] + 1 - (alltreedata[pNode.pid].children.length - 1) * 0.5
72
+
73
+ } else {
74
+
75
+ // 此刻flag!=0
76
+ // 意味着结点有孩子,那么问题就解决了,直接取孩子的中间即可
77
+ // 其实,flag==0的分支计算的就是孩子,是没有孩子的叶结点,那是关键
78
+ alltreedata[pNode.id].top = (alltreedata[pNode.children[0]].top + alltreedata[pNode.children[flag - 1]].top) * 0.5
79
+ }
80
+
81
+ // 因为计算孩子的时候
82
+ // 无法掌握父辈兄弟的情况
83
+ // 可能会出现父亲和兄弟重叠问题
84
+ if (alltreedata[pNode.id].top <= beforeDis[deep]) {
85
+ let needUp = beforeDis[deep] + 1 - alltreedata[pNode.id].top
86
+ (function doUp(_pid: number | string, _deep: number) {
87
+ alltreedata[_pid].top += needUp;
88
+ if (beforeDis[_deep] < alltreedata[_pid].top) beforeDis[_deep] = alltreedata[_pid].top
89
+
90
+ for (let _flag = 0; _flag < alltreedata[_pid].children.length; _flag++) {
91
+ doUp(alltreedata[_pid].children[_flag], _deep + 1)
92
+ }
93
+ })(pNode.id, deep)
94
+ }
95
+
96
+ // 计算好一个结点后,需要更新此刻该层的上边缘
97
+ beforeDis[deep] = alltreedata[pNode.id].top
98
+
99
+ // size在每次计算一个结点后更新,是为了最终绘图的时候知道树有多宽(此处应该叫高)
100
+ if (alltreedata[pNode.id].top + 0.5 > size) size = alltreedata[pNode.id].top + 0.5
101
+
102
+ })(alltreedata[rootid], 0)
103
+
104
+ }
105
+ // 对于不显示的,需要标记一下
106
+ for (let key in noOpens) {
107
+ if (noOpens[key]) {
108
+ alltreedata[key].isOpen = false
109
+ ; (function updateHidden(pid, left, top) {
110
+ for (let index = 0; index < alltreedata[pid].children.length; index++) {
111
+ alltreedata[alltreedata[pid].children[index]].left = left
112
+ alltreedata[alltreedata[pid].children[index]].top = top
113
+ alltreedata[alltreedata[pid].children[index]].show = false
114
+
115
+ updateHidden(alltreedata[pid].children[index], left, top)
116
+ }
117
+ })(key, alltreedata[key].left, alltreedata[key].top)
118
+ }
119
+ }
120
+
121
+ // 传递的参数分别表示:记录了位置信息的树结点集合、根结点ID和树的宽
122
+ return {
123
+ "node": alltreedata,
124
+ "root": rootid,
125
+ "size": size,
126
+ "deep": maxDeep + 1
127
+ }
128
+
129
+ }
130
+
131
+
132
132
  }
@@ -1,80 +1,80 @@
1
- // 缓冲区分为两种:
2
- // 1.缓冲区中保存了包含顶点的数据
3
- // 2.缓冲区保存了包含顶点的索引值
4
-
5
- // 获取一个新的缓冲区
6
- // isElement默认false,创建第一种缓冲区,为true创建第二种
7
- let newBuffer = (painter: WebGLRenderingContext) => {
8
- return painter.createBuffer()
9
- }
10
-
11
- // 数据写入缓冲区
12
- // data是一个类型化数组,表示写入的数据
13
- // usage表示程序如何使用存储在缓冲区的数据
14
- let writeBuffer = (painter: WebGLRenderingContext, data: ArrayBuffer, isElement: boolean, usage: number) => {
15
- let TYPE = isElement ? painter.ELEMENT_ARRAY_BUFFER : painter.ARRAY_BUFFER
16
- painter.bufferData(TYPE, data, usage)
17
- }
18
-
19
- // 使用缓冲区数据
20
- // location指定待分配的attribute变量的存储位置
21
- // size每个分量个数
22
- // type数据类型,应该是以下的某个:
23
- // gl.UNSIGNED_BYTE Uint8Array
24
- // gl.SHORT Int16Array
25
- // gl.UNSIGNED_SHORT Uint16Array
26
- // gl.INT Int32Array
27
- // gl.UNSIGNED_INT Uint32Array
28
- // gl.FLOAT Float32Array
29
- // stride相邻两个数据项的字节数
30
- // offset数据的起点字节位置
31
- // normalized是否把非浮点型的数据归一化到[0,1]或[-1,1]区间
32
- let useBuffer = (painter: WebGLRenderingContext, location: number, size: number, type: number, stride: number, offset: number, normalized: boolean) => {
33
-
34
- // 把缓冲区对象分配给目标变量
35
- painter.vertexAttribPointer(location, size, type, normalized, stride, offset)
36
-
37
- // 连接目标对象和缓冲区对象
38
- painter.enableVertexAttribArray(location)
39
- }
40
-
41
- class BufferObject {
42
-
43
- private __painter: WebGLRenderingContext
44
- private __isElement: boolean
45
-
46
- private __buffer: WebGLBuffer
47
- private __type: number
48
- private __fsize: number
49
-
50
- constructor(painter: WebGLRenderingContext, isElement: boolean = false) {
51
- this.__painter = painter
52
- this.__isElement = isElement
53
-
54
- this.__buffer = newBuffer(painter)
55
- this.__type = isElement ? painter.ELEMENT_ARRAY_BUFFER : painter.ARRAY_BUFFER
56
- }
57
-
58
- // 使用这个缓冲区对象
59
- // (先于写入和分配)
60
- use() {
61
- this.__painter.bindBuffer(this.__type, this.__buffer) // 绑定到目标
62
- return this
63
- }
64
-
65
- // 写入数据
66
- write(data: Uint8Array | Int16Array | Uint16Array | Int32Array | Uint32Array | Float32Array) {
67
- writeBuffer(this.__painter, data, this.__isElement, this.__painter.STATIC_DRAW)
68
- this.__fsize = data.BYTES_PER_ELEMENT
69
- return this
70
- }
71
-
72
- // 分配使用
73
- // 第2~4位参数分别表示:一个完整数据的长度、一组数据的长度、读取位置偏移
74
- divide(location: number, size: number, stride: number, offset: number = 0) {
75
- useBuffer(this.__painter, location, size, this.__painter.FLOAT, stride * this.__fsize, offset * this.__fsize, false)
76
- return this
77
- }
78
- }
79
-
1
+ // 缓冲区分为两种:
2
+ // 1.缓冲区中保存了包含顶点的数据
3
+ // 2.缓冲区保存了包含顶点的索引值
4
+
5
+ // 获取一个新的缓冲区
6
+ // isElement默认false,创建第一种缓冲区,为true创建第二种
7
+ let newBuffer = (painter: WebGLRenderingContext) => {
8
+ return painter.createBuffer()
9
+ }
10
+
11
+ // 数据写入缓冲区
12
+ // data是一个类型化数组,表示写入的数据
13
+ // usage表示程序如何使用存储在缓冲区的数据
14
+ let writeBuffer = (painter: WebGLRenderingContext, data: ArrayBuffer, isElement: boolean, usage: number) => {
15
+ let TYPE = isElement ? painter.ELEMENT_ARRAY_BUFFER : painter.ARRAY_BUFFER
16
+ painter.bufferData(TYPE, data, usage)
17
+ }
18
+
19
+ // 使用缓冲区数据
20
+ // location指定待分配的attribute变量的存储位置
21
+ // size每个分量个数
22
+ // type数据类型,应该是以下的某个:
23
+ // gl.UNSIGNED_BYTE Uint8Array
24
+ // gl.SHORT Int16Array
25
+ // gl.UNSIGNED_SHORT Uint16Array
26
+ // gl.INT Int32Array
27
+ // gl.UNSIGNED_INT Uint32Array
28
+ // gl.FLOAT Float32Array
29
+ // stride相邻两个数据项的字节数
30
+ // offset数据的起点字节位置
31
+ // normalized是否把非浮点型的数据归一化到[0,1]或[-1,1]区间
32
+ let useBuffer = (painter: WebGLRenderingContext, location: number, size: number, type: number, stride: number, offset: number, normalized: boolean) => {
33
+
34
+ // 把缓冲区对象分配给目标变量
35
+ painter.vertexAttribPointer(location, size, type, normalized, stride, offset)
36
+
37
+ // 连接目标对象和缓冲区对象
38
+ painter.enableVertexAttribArray(location)
39
+ }
40
+
41
+ class BufferObject {
42
+
43
+ private __painter: WebGLRenderingContext
44
+ private __isElement: boolean
45
+
46
+ private __buffer: WebGLBuffer
47
+ private __type: number
48
+ private __fsize: number
49
+
50
+ constructor(painter: WebGLRenderingContext, isElement: boolean = false) {
51
+ this.__painter = painter
52
+ this.__isElement = isElement
53
+
54
+ this.__buffer = newBuffer(painter)
55
+ this.__type = isElement ? painter.ELEMENT_ARRAY_BUFFER : painter.ARRAY_BUFFER
56
+ }
57
+
58
+ // 使用这个缓冲区对象
59
+ // (先于写入和分配)
60
+ use() {
61
+ this.__painter.bindBuffer(this.__type, this.__buffer) // 绑定到目标
62
+ return this
63
+ }
64
+
65
+ // 写入数据
66
+ write(data: Uint8Array | Int16Array | Uint16Array | Int32Array | Uint32Array | Float32Array) {
67
+ writeBuffer(this.__painter, data, this.__isElement, this.__painter.STATIC_DRAW)
68
+ this.__fsize = data.BYTES_PER_ELEMENT
69
+ return this
70
+ }
71
+
72
+ // 分配使用
73
+ // 第2~4位参数分别表示:一个完整数据的长度、一组数据的长度、读取位置偏移
74
+ divide(location: number, size: number, stride: number, offset: number = 0) {
75
+ useBuffer(this.__painter, location, size, this.__painter.FLOAT, stride * this.__fsize, offset * this.__fsize, false)
76
+ return this
77
+ }
78
+ }
79
+
80
80
  export default BufferObject