vislite 1.12.0 → 1.12.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 (179) hide show
  1. package/AUTHORS.txt +6 -6
  2. package/CHANGELOG +408 -403
  3. package/LICENSE +20 -20
  4. package/README-en.md +245 -245
  5. package/README.md +245 -245
  6. package/bin/formatArgv.js +30 -30
  7. package/bin/help.js +17 -17
  8. package/bin/run +21 -21
  9. package/bin/skills.js +26 -26
  10. package/lib/BarLayout/index.es.js +348 -348
  11. package/lib/Buffer/index.es.js +34 -34
  12. package/lib/Canvas/index.es.js +804 -804
  13. package/lib/Cardinal/index.es.js +89 -89
  14. package/lib/Eoap/index.es.js +32 -32
  15. package/lib/Hermite/index.es.js +34 -34
  16. package/lib/MapCoordinate/index.es.js +199 -199
  17. package/lib/Matrix4/index.es.js +123 -123
  18. package/lib/Mercator/index.es.js +18 -18
  19. package/lib/PieLayout/index.es.js +115 -115
  20. package/lib/RawCanvas/index.es.js +736 -736
  21. package/lib/SVG/index.es.js +626 -626
  22. package/lib/Shader/index.es.js +34 -34
  23. package/lib/Texture/index.es.js +52 -52
  24. package/lib/TreeLayout/index.es.js +301 -301
  25. package/lib/animation/index.es.js +2 -2
  26. package/lib/assemble/index.es.js +19 -19
  27. package/lib/getLoopColors/index.es.js +34 -34
  28. package/lib/getWebGLContext/index.es.js +61 -61
  29. package/lib/index.umd.js +2797 -2797
  30. package/lib/index.umd.min.js +1 -1
  31. package/lib/initOption/index.es.js +5 -5
  32. package/lib/mergeOption/index.es.js +34 -34
  33. package/lib/move/index.es.js +6 -6
  34. package/lib/rotate/index.es.js +6 -6
  35. package/lib/ruler/index.es.js +136 -136
  36. package/lib/scale/index.es.js +5 -5
  37. package/minialipay/ui-canvas/drawImage.js +35 -35
  38. package/minialipay/ui-canvas/index.acss +4 -4
  39. package/minialipay/ui-canvas/index.axml +3 -3
  40. package/minialipay/ui-canvas/index.d.ts +1 -1
  41. package/minialipay/ui-canvas/index.js +100 -100
  42. package/minialipay/ui-canvas/index.json +6 -6
  43. package/miniprogram/ui-canvas/drawImage.js +35 -35
  44. package/miniprogram/ui-canvas/index.js +125 -125
  45. package/miniprogram/ui-canvas/index.json +4 -4
  46. package/miniprogram/ui-canvas/index.wxml +4 -4
  47. package/miniprogram/ui-canvas/index.wxss +5 -5
  48. package/package/BarLayout/index.ts +2 -2
  49. package/package/Buffer/index.ts +2 -2
  50. package/package/Canvas/index.ts +2 -2
  51. package/package/Cardinal/index.ts +2 -2
  52. package/package/Eoap/index.ts +2 -2
  53. package/package/Hermite/index.ts +2 -2
  54. package/package/MapCoordinate/index.ts +2 -2
  55. package/package/Matrix4/index.ts +2 -2
  56. package/package/Mercator/index.ts +2 -2
  57. package/package/PieLayout/index.ts +2 -2
  58. package/package/RawCanvas/index.ts +2 -2
  59. package/package/SVG/index.ts +2 -2
  60. package/package/Shader/index.ts +2 -2
  61. package/package/Texture/index.ts +2 -2
  62. package/package/TreeLayout/index.ts +2 -2
  63. package/package/animation/index.ts +5 -5
  64. package/package/assemble/index.ts +2 -2
  65. package/package/getLoopColors/index.ts +2 -2
  66. package/package/getWebGLContext/index.ts +40 -40
  67. package/package/index.ts +84 -84
  68. package/package/initOption/index.ts +2 -2
  69. package/package/mergeOption/index.ts +2 -2
  70. package/package/move/index.ts +2 -2
  71. package/package/rotate/index.ts +2 -2
  72. package/package/ruler/index.ts +2 -2
  73. package/package/scale/index.ts +2 -2
  74. package/package/throttle/index.ts +2 -2
  75. package/package.json +79 -79
  76. package/skills/vislite-lib/BarLayout.md +117 -117
  77. package/skills/vislite-lib/Canvas.md +183 -183
  78. package/skills/vislite-lib/Interpolation.md +129 -129
  79. package/skills/vislite-lib/Matrix.md +174 -174
  80. package/skills/vislite-lib/PieLayout.md +131 -131
  81. package/skills/vislite-lib/Projections.md +158 -158
  82. package/skills/vislite-lib/SKILL.md +179 -179
  83. package/skills/vislite-lib/SVG.md +137 -137
  84. package/skills/vislite-lib/TreeLayout.md +176 -176
  85. package/skills/vislite-lib/Utilities.md +261 -261
  86. package/skills/vislite-lib/WebGL.md +106 -106
  87. package/skills/vislite-lib/minialipay/ui-canvas.md +95 -95
  88. package/skills/vislite-lib/miniprogram/ui-canvas.md +98 -98
  89. package/skills/vislite-lib/uniapp/ui-canvas.md +113 -113
  90. package/src/Canvas.ts +89 -89
  91. package/src/Eoap.ts +66 -66
  92. package/src/Matrix4/index.ts +84 -84
  93. package/src/Matrix4/move.ts +12 -12
  94. package/src/Matrix4/rotate.ts +15 -15
  95. package/src/Matrix4/scale.ts +11 -11
  96. package/src/Matrix4/transform.ts +64 -64
  97. package/src/Mercator.ts +27 -27
  98. package/src/SVG.ts +86 -86
  99. package/src/common/assemble.ts +30 -30
  100. package/src/common/canvas/arc.ts +51 -51
  101. package/src/common/canvas/config.ts +176 -176
  102. package/src/common/canvas/default.ts +64 -64
  103. package/src/common/canvas/gradient.ts +31 -31
  104. package/src/common/canvas/index.ts +189 -189
  105. package/src/common/canvas/painter.ts +475 -475
  106. package/src/common/canvas/texts.ts +18 -18
  107. package/src/common/map/getBoundary.ts +15 -15
  108. package/src/common/map/tool.ts +29 -29
  109. package/src/common/option.ts +31 -31
  110. package/src/common/setStyle.ts +5 -5
  111. package/src/common/svg/config.ts +213 -213
  112. package/src/common/svg/default.ts +29 -29
  113. package/src/common/svg/gradient.ts +53 -53
  114. package/src/common/svg/index.ts +420 -420
  115. package/src/common/svg/tool.ts +51 -51
  116. package/src/common/tree/index.ts +25 -25
  117. package/src/common/tree/toInnerTree.ts +61 -61
  118. package/src/common/tree/toPlainTree.ts +135 -135
  119. package/src/common/type.ts +26 -26
  120. package/src/common/webgl/buffer.ts +79 -79
  121. package/src/common/webgl/getWebGLContext.ts +45 -45
  122. package/src/common/webgl/shader.ts +75 -75
  123. package/src/common/webgl/texture.ts +98 -98
  124. package/src/coordinate/MapCoordinate.ts +80 -80
  125. package/src/getLoopColors.ts +42 -42
  126. package/src/interpolation/Cardinal.ts +110 -110
  127. package/src/interpolation/Hermite.ts +65 -65
  128. package/src/layout/BarLayout.ts +249 -249
  129. package/src/layout/PieLayout.ts +146 -146
  130. package/src/layout/TreeLayout.ts +200 -200
  131. package/src/move.ts +7 -7
  132. package/src/rotate.ts +7 -7
  133. package/src/ruler.ts +209 -209
  134. package/src/scale.ts +6 -6
  135. package/types/Bar.d.ts +91 -91
  136. package/types/BarConfig.d.ts +4 -4
  137. package/types/BarLayout.d.ts +48 -48
  138. package/types/BarOption.d.ts +31 -31
  139. package/types/Buffer.d.ts +30 -30
  140. package/types/Canvas.d.ts +379 -379
  141. package/types/CanvasConfig.d.ts +61 -61
  142. package/types/CanvasOption.d.ts +13 -13
  143. package/types/CanvasOpts.d.ts +9 -9
  144. package/types/Cardinal.d.ts +20 -20
  145. package/types/Gradient.d.ts +20 -20
  146. package/types/Hermite.d.ts +25 -25
  147. package/types/Map.d.ts +9 -9
  148. package/types/MapConfig.d.ts +27 -27
  149. package/types/MapCoordinate.d.ts +22 -22
  150. package/types/Matrix4.d.ts +79 -79
  151. package/types/Pie.d.ts +73 -73
  152. package/types/PieConfig.d.ts +26 -26
  153. package/types/PieLayout.d.ts +40 -40
  154. package/types/PieOption.d.ts +21 -21
  155. package/types/SVG.d.ts +282 -282
  156. package/types/SVGConfig.d.ts +54 -54
  157. package/types/Shader.d.ts +22 -22
  158. package/types/Texture.d.ts +22 -22
  159. package/types/Tree.d.ts +74 -74
  160. package/types/TreeConfig.d.ts +52 -52
  161. package/types/TreeLayout.d.ts +71 -71
  162. package/types/TreeOption.d.ts +48 -48
  163. package/types/animation.d.ts +26 -26
  164. package/types/assemble.d.ts +14 -14
  165. package/types/getLoopColors.d.ts +13 -13
  166. package/types/getWebGLContext.d.ts +7 -7
  167. package/types/index.d.ts +220 -220
  168. package/types/module.d.ts +110 -110
  169. package/types/move.d.ts +15 -15
  170. package/types/option.d.ts +12 -12
  171. package/types/painterConfig.d.ts +14 -14
  172. package/types/rotate.d.ts +15 -15
  173. package/types/ruler.d.ts +24 -24
  174. package/types/scale.d.ts +15 -15
  175. package/types/throttle.d.ts +6 -6
  176. package/types/ui-canvas.d.ts +4 -4
  177. package/types/uni-canvas.d.ts +3 -3
  178. package/uni-app/drawImage.js +19 -19
  179. package/uni-app/ui-canvas.vue +295 -295
@@ -1,81 +1,81 @@
1
- import type MapConfigType from '../../types/MapConfig'
2
- import type MapCoordinateType from '../../types/MapCoordinate'
3
- import type MapType from '../../types/Map'
4
-
5
- import { initOption, mergeOption } from '../common/option'
6
- import getBoundary from '../common/map/getBoundary'
7
- import Mercator from '../Mercator'
8
- import Eoap from '../Eoap'
9
-
10
- class MapCoordinate implements MapCoordinateType {
11
- readonly name: string = 'MapCoordinate'
12
-
13
- private __config: MapConfigType
14
- private __map: MapType
15
- private __boundary: Array<number>
16
-
17
- constructor(config: MapConfigType = {}) {
18
- this.__config = initOption(config, {
19
- api: "Mercator",
20
- width: 400,
21
- height: 300,
22
- left: 0,
23
- top: 0
24
- })
25
- }
26
-
27
- private $$updateMap() {
28
- const [minLongitude, maxLongitude, minLatitude, maxLatitude] = this.__boundary
29
-
30
- if (this.__config.api == "Eoap") {
31
-
32
- const xScale = (this.__config.width as number) * 0.836 / (maxLongitude - minLongitude)
33
- const yScale = (this.__config.height as number) * 0.557 / (maxLatitude - minLatitude)
34
-
35
- this.__map = new Eoap(xScale < yScale ? xScale : yScale, [
36
- (minLongitude + maxLongitude) * 0.5 * 0.9778,
37
- (minLatitude + maxLatitude) * 0.5 * 1.025
38
- ])
39
-
40
- } else if (this.__config.api == "Mercator") {
41
-
42
- const xScale = (this.__config.width as number) * 0.72 / (maxLongitude - minLongitude)
43
- const yScale = (this.__config.height as number) * 0.575 / (maxLatitude - minLatitude)
44
-
45
- this.__map = new Mercator(xScale < yScale ? xScale : yScale, [
46
- (minLongitude + maxLongitude) * 0.5,
47
- (minLatitude + maxLatitude) * 0.5
48
- ])
49
-
50
- } else {
51
- throw new Error("Unexpected API types:" + this.__config.api)
52
- }
53
- }
54
-
55
- setConfig(config: MapConfigType) {
56
- mergeOption(this.__config, config)
57
- this.$$updateMap()
58
- return this
59
- }
60
-
61
- setGeos(...geos: any[]) {
62
- this.__boundary = getBoundary(...geos)
63
- this.$$updateMap()
64
- return this
65
- }
66
-
67
- use(λ: number, φ: number): [number, number] {
68
- if (this.__map) {
69
- const dxyz = this.__map.use(λ, φ)
70
- return [
71
- (this.__config.left as number) + (this.__config.width as number) * 0.5 + dxyz[0],
72
- (this.__config.top as number) + (this.__config.height as number) * 0.5 + dxyz[1],
73
- ]
74
- } else {
75
- throw new Error("Geographic data not set")
76
- }
77
- }
78
-
79
- }
80
-
1
+ import type MapConfigType from '../../types/MapConfig'
2
+ import type MapCoordinateType from '../../types/MapCoordinate'
3
+ import type MapType from '../../types/Map'
4
+
5
+ import { initOption, mergeOption } from '../common/option'
6
+ import getBoundary from '../common/map/getBoundary'
7
+ import Mercator from '../Mercator'
8
+ import Eoap from '../Eoap'
9
+
10
+ class MapCoordinate implements MapCoordinateType {
11
+ readonly name: string = 'MapCoordinate'
12
+
13
+ private __config: MapConfigType
14
+ private __map: MapType
15
+ private __boundary: Array<number>
16
+
17
+ constructor(config: MapConfigType = {}) {
18
+ this.__config = initOption(config, {
19
+ api: "Mercator",
20
+ width: 400,
21
+ height: 300,
22
+ left: 0,
23
+ top: 0
24
+ })
25
+ }
26
+
27
+ private $$updateMap() {
28
+ const [minLongitude, maxLongitude, minLatitude, maxLatitude] = this.__boundary
29
+
30
+ if (this.__config.api == "Eoap") {
31
+
32
+ const xScale = (this.__config.width as number) * 0.836 / (maxLongitude - minLongitude)
33
+ const yScale = (this.__config.height as number) * 0.557 / (maxLatitude - minLatitude)
34
+
35
+ this.__map = new Eoap(xScale < yScale ? xScale : yScale, [
36
+ (minLongitude + maxLongitude) * 0.5 * 0.9778,
37
+ (minLatitude + maxLatitude) * 0.5 * 1.025
38
+ ])
39
+
40
+ } else if (this.__config.api == "Mercator") {
41
+
42
+ const xScale = (this.__config.width as number) * 0.72 / (maxLongitude - minLongitude)
43
+ const yScale = (this.__config.height as number) * 0.575 / (maxLatitude - minLatitude)
44
+
45
+ this.__map = new Mercator(xScale < yScale ? xScale : yScale, [
46
+ (minLongitude + maxLongitude) * 0.5,
47
+ (minLatitude + maxLatitude) * 0.5
48
+ ])
49
+
50
+ } else {
51
+ throw new Error("Unexpected API types:" + this.__config.api)
52
+ }
53
+ }
54
+
55
+ setConfig(config: MapConfigType) {
56
+ mergeOption(this.__config, config)
57
+ this.$$updateMap()
58
+ return this
59
+ }
60
+
61
+ setGeos(...geos: any[]) {
62
+ this.__boundary = getBoundary(...geos)
63
+ this.$$updateMap()
64
+ return this
65
+ }
66
+
67
+ use(λ: number, φ: number): [number, number] {
68
+ if (this.__map) {
69
+ const dxyz = this.__map.use(λ, φ)
70
+ return [
71
+ (this.__config.left as number) + (this.__config.width as number) * 0.5 + dxyz[0],
72
+ (this.__config.top as number) + (this.__config.height as number) * 0.5 + dxyz[1],
73
+ ]
74
+ } else {
75
+ throw new Error("Geographic data not set")
76
+ }
77
+ }
78
+
79
+ }
80
+
81
81
  export default MapCoordinate
@@ -1,42 +1,42 @@
1
- // 获取一组循环色彩
2
- export default function (num: number, alpha: number = 1, colorsFactory?: (alpha: number) => Array<string>) {
3
- // 颜色集合
4
- const colorList = colorsFactory ? colorsFactory(alpha) : [
5
- 'rgba(84,112,198,' + alpha + ")", 'rgba(145,204,117,' + alpha + ")",
6
- 'rgba(250,200,88,' + alpha + ")", 'rgba(238,102,102,' + alpha + ")",
7
- 'rgba(115,192,222,' + alpha + ")", 'rgba(59,162,114,' + alpha + ")",
8
- 'rgba(252,132,82,' + alpha + ")", 'rgba(154,96,180,' + alpha + ")",
9
- 'rgba(234,124,204,' + alpha + ")"
10
- ]
11
-
12
- let colors: string[] = []
13
-
14
- // 根据情况返回颜色数组
15
- if (num <= colorList.length) {
16
- // 这种情况就不需要任何处理
17
- return colorList
18
- } else {
19
- // 如果正好是集合长度的倍数
20
- if (num % colorList.length == 0) {
21
- // 将颜色数组循环加入后再返回
22
- for (let i = 0; i < (num / colorList.length); i++) {
23
- colors = colors.concat(colorList)
24
- }
25
- } else {
26
- for (let j = 1; j < (num / colorList.length); j++) {
27
- colors = colors.concat(colorList)
28
- }
29
- // 防止最后一个颜色和第一个颜色重复
30
- if (num % colorList.length == 1) {
31
- colors = colors.concat(colorList[4])
32
- } else {
33
- for (let k = 0; k < num % colorList.length; k++) {
34
- colors = colors.concat(colorList[k])
35
- }
36
- }
37
- }
38
- }
39
-
40
- // 返回结果
41
- return colors
42
- }
1
+ // 获取一组循环色彩
2
+ export default function (num: number, alpha: number = 1, colorsFactory?: (alpha: number) => Array<string>) {
3
+ // 颜色集合
4
+ const colorList = colorsFactory ? colorsFactory(alpha) : [
5
+ 'rgba(84,112,198,' + alpha + ")", 'rgba(145,204,117,' + alpha + ")",
6
+ 'rgba(250,200,88,' + alpha + ")", 'rgba(238,102,102,' + alpha + ")",
7
+ 'rgba(115,192,222,' + alpha + ")", 'rgba(59,162,114,' + alpha + ")",
8
+ 'rgba(252,132,82,' + alpha + ")", 'rgba(154,96,180,' + alpha + ")",
9
+ 'rgba(234,124,204,' + alpha + ")"
10
+ ]
11
+
12
+ let colors: string[] = []
13
+
14
+ // 根据情况返回颜色数组
15
+ if (num <= colorList.length) {
16
+ // 这种情况就不需要任何处理
17
+ return colorList
18
+ } else {
19
+ // 如果正好是集合长度的倍数
20
+ if (num % colorList.length == 0) {
21
+ // 将颜色数组循环加入后再返回
22
+ for (let i = 0; i < (num / colorList.length); i++) {
23
+ colors = colors.concat(colorList)
24
+ }
25
+ } else {
26
+ for (let j = 1; j < (num / colorList.length); j++) {
27
+ colors = colors.concat(colorList)
28
+ }
29
+ // 防止最后一个颜色和第一个颜色重复
30
+ if (num % colorList.length == 1) {
31
+ colors = colors.concat(colorList[4])
32
+ } else {
33
+ for (let k = 0; k < num % colorList.length; k++) {
34
+ colors = colors.concat(colorList[k])
35
+ }
36
+ }
37
+ }
38
+ }
39
+
40
+ // 返回结果
41
+ return colors
42
+ }
@@ -1,111 +1,111 @@
1
- /**
2
- * Cardinal三次插值
3
- * ----------------------------
4
- * Hermite拟合的计算是,确定两个点和两个点的斜率
5
- * 用一个y=ax(3)+bx(2)+cx+d的三次多项式来求解
6
- * 而Cardinal是建立在此基础上
7
- * 给定需要拟合的两个点和第一个点的前一个点+最后一个点的后一个点
8
- * 第一个点的斜率由第一个点的前一个点和第二个点的斜率确定
9
- * 第二个点的斜率由第一个点和第二个点的后一个点的斜率确定
10
- */
11
-
12
- import type CardinalType from '../../types/Cardinal'
13
-
14
- import Hermite from './Hermite'
15
-
16
- class Cardinal implements CardinalType {
17
- readonly name: string = 'Cardinal'
18
-
19
- // 该参数用于调整曲线走势,默认数值t=0,分水岭t=-1,|t-(-1)|的值越大,曲线走势调整的越严重
20
- private __t: number
21
-
22
- private __HS: {
23
- x: number[],
24
- h: Hermite[]
25
- }
26
- private __i: number
27
-
28
- constructor(t: number = 0) {
29
- this.__t = t
30
- }
31
-
32
- // 设置点的位置
33
- // 参数格式:[[x1, y1], [x2, y2], ... ]
34
- // 至少两个点
35
- setP(points: number[][]) {
36
-
37
- this.__HS = {
38
- "x": [],
39
- "h": []
40
- };
41
- let flag: number,
42
- slope = (points[1][1] - points[0][1]) / (points[1][0] - points[0][0]),
43
- temp: number
44
- this.__HS.x[0] = points[0][0]
45
- for (flag = 1; flag < points.length; flag++) {
46
- if (points[flag][0] <= points[flag - 1][0]) throw new Error('The point position should be increamented!')
47
- this.__HS.x[flag] = points[flag][0]
48
-
49
- // 求点斜率
50
-
51
- // temp = flag < points.length - 1 ?
52
- // (points[flag + 1][1] - points[flag - 1][1]) / (points[flag + 1][0] - points[flag - 1][0]) :
53
- // (points[flag][1] - points[flag - 1][1]) / (points[flag][0] - points[flag - 1][0])
54
-
55
- // 修复超过界限的值问题
56
- // 2023年6月25日 于南京
57
- if (flag < points.length - 1) {
58
- if (
59
- (points[flag + 1][1] > points[flag][1] && points[flag - 1][1] > points[flag][1]) ||
60
- (points[flag + 1][1] < points[flag][1] && points[flag - 1][1] < points[flag][1]) ||
61
- points[flag + 1][1] == points[flag][1] ||
62
- points[flag - 1][1] == points[flag][1]
63
- ) {
64
- temp = 0
65
- } else {
66
- temp = (points[flag + 1][1] - points[flag - 1][1]) / (points[flag + 1][0] - points[flag - 1][0])
67
- }
68
- } else {
69
- temp = (points[flag][1] - points[flag - 1][1]) / (points[flag][0] - points[flag - 1][0])
70
- }
71
-
72
- // 求解两个点直接的插值方程
73
- // 第一个点的前一个点直接取第一个点
74
- // 最后一个点的后一个点直接取最后一个点
75
- this.__HS.h[flag - 1] = new Hermite((1 - this.__t) * 0.5).setP(points[flag - 1][0], points[flag - 1][1], points[flag][0], points[flag][1], slope, temp)
76
- slope = temp
77
- }
78
- return this
79
-
80
- }
81
-
82
- // 根据x值返回y值
83
- use(x: number) {
84
- if (this.__HS) {
85
- this.__i = -1
86
-
87
- // 寻找记录x所在位置的区间
88
- // 这里就是寻找对应的拟合函数
89
- while (this.__i + 1 < this.__HS.x.length && (x > this.__HS.x[this.__i + 1] || (this.__i == -1 && x >= this.__HS.x[this.__i + 1]))) {
90
- this.__i += 1
91
- }
92
-
93
- // 由于js浮点运算不准确,我们对于越界的情况进行兼容
94
-
95
- if (this.__i < 0) {
96
- return this.__HS.h[0].use(this.__HS.x[0])
97
- }
98
-
99
- else if (this.__i >= this.__HS.h.length) {
100
- return this.__HS.h[this.__HS.h.length - 1].use(this.__HS.x[this.__HS.x.length - 1])
101
- }
102
-
103
- return this.__HS.h[this.__i].use(x)
104
- } else {
105
- throw new Error('You shoud first set the position!')
106
- }
107
- }
108
-
109
- }
110
-
1
+ /**
2
+ * Cardinal三次插值
3
+ * ----------------------------
4
+ * Hermite拟合的计算是,确定两个点和两个点的斜率
5
+ * 用一个y=ax(3)+bx(2)+cx+d的三次多项式来求解
6
+ * 而Cardinal是建立在此基础上
7
+ * 给定需要拟合的两个点和第一个点的前一个点+最后一个点的后一个点
8
+ * 第一个点的斜率由第一个点的前一个点和第二个点的斜率确定
9
+ * 第二个点的斜率由第一个点和第二个点的后一个点的斜率确定
10
+ */
11
+
12
+ import type CardinalType from '../../types/Cardinal'
13
+
14
+ import Hermite from './Hermite'
15
+
16
+ class Cardinal implements CardinalType {
17
+ readonly name: string = 'Cardinal'
18
+
19
+ // 该参数用于调整曲线走势,默认数值t=0,分水岭t=-1,|t-(-1)|的值越大,曲线走势调整的越严重
20
+ private __t: number
21
+
22
+ private __HS: {
23
+ x: number[],
24
+ h: Hermite[]
25
+ }
26
+ private __i: number
27
+
28
+ constructor(t: number = 0) {
29
+ this.__t = t
30
+ }
31
+
32
+ // 设置点的位置
33
+ // 参数格式:[[x1, y1], [x2, y2], ... ]
34
+ // 至少两个点
35
+ setP(points: number[][]) {
36
+
37
+ this.__HS = {
38
+ "x": [],
39
+ "h": []
40
+ };
41
+ let flag: number,
42
+ slope = (points[1][1] - points[0][1]) / (points[1][0] - points[0][0]),
43
+ temp: number
44
+ this.__HS.x[0] = points[0][0]
45
+ for (flag = 1; flag < points.length; flag++) {
46
+ if (points[flag][0] <= points[flag - 1][0]) throw new Error('The point position should be increamented!')
47
+ this.__HS.x[flag] = points[flag][0]
48
+
49
+ // 求点斜率
50
+
51
+ // temp = flag < points.length - 1 ?
52
+ // (points[flag + 1][1] - points[flag - 1][1]) / (points[flag + 1][0] - points[flag - 1][0]) :
53
+ // (points[flag][1] - points[flag - 1][1]) / (points[flag][0] - points[flag - 1][0])
54
+
55
+ // 修复超过界限的值问题
56
+ // 2023年6月25日 于南京
57
+ if (flag < points.length - 1) {
58
+ if (
59
+ (points[flag + 1][1] > points[flag][1] && points[flag - 1][1] > points[flag][1]) ||
60
+ (points[flag + 1][1] < points[flag][1] && points[flag - 1][1] < points[flag][1]) ||
61
+ points[flag + 1][1] == points[flag][1] ||
62
+ points[flag - 1][1] == points[flag][1]
63
+ ) {
64
+ temp = 0
65
+ } else {
66
+ temp = (points[flag + 1][1] - points[flag - 1][1]) / (points[flag + 1][0] - points[flag - 1][0])
67
+ }
68
+ } else {
69
+ temp = (points[flag][1] - points[flag - 1][1]) / (points[flag][0] - points[flag - 1][0])
70
+ }
71
+
72
+ // 求解两个点直接的插值方程
73
+ // 第一个点的前一个点直接取第一个点
74
+ // 最后一个点的后一个点直接取最后一个点
75
+ this.__HS.h[flag - 1] = new Hermite((1 - this.__t) * 0.5).setP(points[flag - 1][0], points[flag - 1][1], points[flag][0], points[flag][1], slope, temp)
76
+ slope = temp
77
+ }
78
+ return this
79
+
80
+ }
81
+
82
+ // 根据x值返回y值
83
+ use(x: number) {
84
+ if (this.__HS) {
85
+ this.__i = -1
86
+
87
+ // 寻找记录x所在位置的区间
88
+ // 这里就是寻找对应的拟合函数
89
+ while (this.__i + 1 < this.__HS.x.length && (x > this.__HS.x[this.__i + 1] || (this.__i == -1 && x >= this.__HS.x[this.__i + 1]))) {
90
+ this.__i += 1
91
+ }
92
+
93
+ // 由于js浮点运算不准确,我们对于越界的情况进行兼容
94
+
95
+ if (this.__i < 0) {
96
+ return this.__HS.h[0].use(this.__HS.x[0])
97
+ }
98
+
99
+ else if (this.__i >= this.__HS.h.length) {
100
+ return this.__HS.h[this.__HS.h.length - 1].use(this.__HS.x[this.__HS.x.length - 1])
101
+ }
102
+
103
+ return this.__HS.h[this.__i].use(x)
104
+ } else {
105
+ throw new Error('You shoud first set the position!')
106
+ }
107
+ }
108
+
109
+ }
110
+
111
111
  export default Cardinal
@@ -1,66 +1,66 @@
1
- import type HermiteType from '../../types/Hermite'
2
-
3
- class Hermite implements HermiteType {
4
- readonly name: string = 'Hermite'
5
-
6
- private __u: number // 张弛系数
7
-
8
- private __MR: number[]
9
- private __a: number
10
- private __b: number
11
-
12
- constructor(u: number = 0.5) {
13
- this.__u = u
14
- }
15
-
16
- /**
17
- * 设置点的位置
18
- * @param {Number} x1 左边点的位置
19
- * @param {Number} y1
20
- * @param {Number} x2 右边点的位置
21
- * @param {Number} y2
22
- * @param {Number} s1 两个点的斜率
23
- * @param {Number} s2
24
- */
25
- setP(x1: number, y1: number, x2: number, y2: number, s1: number, s2: number) {
26
- if (x1 < x2) {
27
- // 记录原始尺寸
28
- this.__a = x1
29
- this.__b = x2
30
- const p3 = this.__u * s1,
31
- p4 = this.__u * s2
32
- // 缩放到[0,1]定义域
33
- y1 /= (x2 - x1)
34
- y2 /= (x2 - x1)
35
- // MR是提前计算好的多项式通解矩阵
36
- // 为了加速计算
37
- // 如上面说的
38
- // 统一在[0,1]上计算后再通过缩放和移动恢复
39
- // 避免了动态求解矩阵的麻烦
40
- this.__MR = [
41
- 2 * y1 - 2 * y2 + p3 + p4,
42
- 3 * y2 - 3 * y1 - 2 * p3 - p4,
43
- p3,
44
- y1
45
- ]
46
- } else throw new Error('The point x-position should be increamented!')
47
- return this
48
- }
49
-
50
-
51
- /**
52
- * 根据x值返回y值
53
- * @param {Number} x
54
- */
55
- use(x: number) {
56
- if (this.__MR) {
57
- const sx = (x - this.__a) / (this.__b - this.__a),
58
- sx2 = sx * sx,
59
- sx3 = sx * sx2
60
- const sResult = sx3 * this.__MR[0] + sx2 * this.__MR[1] + sx * this.__MR[2] + this.__MR[3]
61
- return sResult * (this.__b - this.__a)
62
- } else throw new Error('You shoud first set the position!')
63
- }
64
- }
65
-
1
+ import type HermiteType from '../../types/Hermite'
2
+
3
+ class Hermite implements HermiteType {
4
+ readonly name: string = 'Hermite'
5
+
6
+ private __u: number // 张弛系数
7
+
8
+ private __MR: number[]
9
+ private __a: number
10
+ private __b: number
11
+
12
+ constructor(u: number = 0.5) {
13
+ this.__u = u
14
+ }
15
+
16
+ /**
17
+ * 设置点的位置
18
+ * @param {Number} x1 左边点的位置
19
+ * @param {Number} y1
20
+ * @param {Number} x2 右边点的位置
21
+ * @param {Number} y2
22
+ * @param {Number} s1 两个点的斜率
23
+ * @param {Number} s2
24
+ */
25
+ setP(x1: number, y1: number, x2: number, y2: number, s1: number, s2: number) {
26
+ if (x1 < x2) {
27
+ // 记录原始尺寸
28
+ this.__a = x1
29
+ this.__b = x2
30
+ const p3 = this.__u * s1,
31
+ p4 = this.__u * s2
32
+ // 缩放到[0,1]定义域
33
+ y1 /= (x2 - x1)
34
+ y2 /= (x2 - x1)
35
+ // MR是提前计算好的多项式通解矩阵
36
+ // 为了加速计算
37
+ // 如上面说的
38
+ // 统一在[0,1]上计算后再通过缩放和移动恢复
39
+ // 避免了动态求解矩阵的麻烦
40
+ this.__MR = [
41
+ 2 * y1 - 2 * y2 + p3 + p4,
42
+ 3 * y2 - 3 * y1 - 2 * p3 - p4,
43
+ p3,
44
+ y1
45
+ ]
46
+ } else throw new Error('The point x-position should be increamented!')
47
+ return this
48
+ }
49
+
50
+
51
+ /**
52
+ * 根据x值返回y值
53
+ * @param {Number} x
54
+ */
55
+ use(x: number) {
56
+ if (this.__MR) {
57
+ const sx = (x - this.__a) / (this.__b - this.__a),
58
+ sx2 = sx * sx,
59
+ sx3 = sx * sx2
60
+ const sResult = sx3 * this.__MR[0] + sx2 * this.__MR[1] + sx * this.__MR[2] + this.__MR[3]
61
+ return sResult * (this.__b - this.__a)
62
+ } else throw new Error('You shoud first set the position!')
63
+ }
64
+ }
65
+
66
66
  export default Hermite