vislite 1.12.0 → 2.0.0-next.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/AUTHORS.txt +6 -6
  2. package/CHANGELOG +414 -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 +21 -17
  8. package/bin/minialipay.js +27 -0
  9. package/bin/run +25 -21
  10. package/bin/skills.js +26 -26
  11. package/lib/BarLayout/index.es.js +348 -348
  12. package/lib/Buffer/index.es.js +34 -34
  13. package/lib/Canvas/index.es.js +804 -804
  14. package/lib/Cardinal/index.es.js +89 -89
  15. package/lib/Eoap/index.es.js +32 -32
  16. package/lib/Hermite/index.es.js +34 -34
  17. package/lib/MapCoordinate/index.es.js +199 -199
  18. package/lib/Matrix4/index.es.js +123 -123
  19. package/lib/Mercator/index.es.js +18 -18
  20. package/lib/PieLayout/index.es.js +115 -115
  21. package/lib/RawCanvas/index.es.js +736 -736
  22. package/lib/SVG/index.es.js +626 -626
  23. package/lib/Shader/index.es.js +34 -34
  24. package/lib/Texture/index.es.js +52 -52
  25. package/lib/TreeLayout/index.es.js +301 -301
  26. package/lib/animation/index.es.js +2 -2
  27. package/lib/assemble/index.es.js +19 -19
  28. package/lib/getLoopColors/index.es.js +34 -34
  29. package/lib/getWebGLContext/index.es.js +61 -61
  30. package/lib/index.umd.js +2797 -2797
  31. package/lib/index.umd.min.js +1 -1
  32. package/lib/initOption/index.es.js +5 -5
  33. package/lib/mergeOption/index.es.js +34 -34
  34. package/lib/move/index.es.js +6 -6
  35. package/lib/rotate/index.es.js +6 -6
  36. package/lib/ruler/index.es.js +136 -136
  37. package/lib/scale/index.es.js +5 -5
  38. package/minialipay/ui-canvas/drawImage.js +35 -35
  39. package/minialipay/ui-canvas/index.acss +4 -4
  40. package/minialipay/ui-canvas/index.axml +3 -3
  41. package/minialipay/ui-canvas/index.d.ts +1 -1
  42. package/minialipay/ui-canvas/index.js +100 -100
  43. package/minialipay/ui-canvas/index.json +6 -6
  44. package/miniprogram/ui-canvas/drawImage.js +35 -35
  45. package/miniprogram/ui-canvas/index.js +125 -125
  46. package/miniprogram/ui-canvas/index.json +4 -4
  47. package/miniprogram/ui-canvas/index.wxml +4 -4
  48. package/miniprogram/ui-canvas/index.wxss +5 -5
  49. package/package/BarLayout/index.ts +2 -2
  50. package/package/Buffer/index.ts +2 -2
  51. package/package/Canvas/index.ts +2 -2
  52. package/package/Cardinal/index.ts +2 -2
  53. package/package/Eoap/index.ts +2 -2
  54. package/package/Hermite/index.ts +2 -2
  55. package/package/MapCoordinate/index.ts +2 -2
  56. package/package/Matrix4/index.ts +2 -2
  57. package/package/Mercator/index.ts +2 -2
  58. package/package/PieLayout/index.ts +2 -2
  59. package/package/RawCanvas/index.ts +2 -2
  60. package/package/SVG/index.ts +2 -2
  61. package/package/Shader/index.ts +2 -2
  62. package/package/Texture/index.ts +2 -2
  63. package/package/TreeLayout/index.ts +2 -2
  64. package/package/animation/index.ts +5 -5
  65. package/package/assemble/index.ts +2 -2
  66. package/package/getLoopColors/index.ts +2 -2
  67. package/package/getWebGLContext/index.ts +40 -40
  68. package/package/index.ts +84 -84
  69. package/package/initOption/index.ts +2 -2
  70. package/package/mergeOption/index.ts +2 -2
  71. package/package/move/index.ts +2 -2
  72. package/package/rotate/index.ts +2 -2
  73. package/package/ruler/index.ts +2 -2
  74. package/package/scale/index.ts +2 -2
  75. package/package/throttle/index.ts +2 -2
  76. package/package.json +103 -79
  77. package/skills/vislite-lib/BarLayout.md +117 -117
  78. package/skills/vislite-lib/Canvas.md +183 -183
  79. package/skills/vislite-lib/Interpolation.md +129 -129
  80. package/skills/vislite-lib/Matrix.md +174 -174
  81. package/skills/vislite-lib/PieLayout.md +131 -131
  82. package/skills/vislite-lib/Projections.md +158 -158
  83. package/skills/vislite-lib/SKILL.md +179 -179
  84. package/skills/vislite-lib/SVG.md +137 -137
  85. package/skills/vislite-lib/TreeLayout.md +176 -176
  86. package/skills/vislite-lib/Utilities.md +261 -261
  87. package/skills/vislite-lib/WebGL.md +106 -106
  88. package/skills/vislite-lib/minialipay/ui-canvas.md +95 -95
  89. package/skills/vislite-lib/miniprogram/ui-canvas.md +98 -98
  90. package/skills/vislite-lib/uniapp/ui-canvas.md +113 -113
  91. package/src/Canvas.ts +89 -89
  92. package/src/Eoap.ts +66 -66
  93. package/src/Matrix4/index.ts +84 -84
  94. package/src/Matrix4/move.ts +12 -12
  95. package/src/Matrix4/rotate.ts +15 -15
  96. package/src/Matrix4/scale.ts +11 -11
  97. package/src/Matrix4/transform.ts +64 -64
  98. package/src/Mercator.ts +27 -27
  99. package/src/SVG.ts +86 -86
  100. package/src/common/assemble.ts +30 -30
  101. package/src/common/canvas/arc.ts +51 -51
  102. package/src/common/canvas/config.ts +176 -176
  103. package/src/common/canvas/default.ts +64 -64
  104. package/src/common/canvas/gradient.ts +31 -31
  105. package/src/common/canvas/index.ts +189 -189
  106. package/src/common/canvas/painter.ts +475 -475
  107. package/src/common/canvas/texts.ts +18 -18
  108. package/src/common/map/getBoundary.ts +15 -15
  109. package/src/common/map/tool.ts +29 -29
  110. package/src/common/option.ts +31 -31
  111. package/src/common/setStyle.ts +5 -5
  112. package/src/common/svg/config.ts +213 -213
  113. package/src/common/svg/default.ts +29 -29
  114. package/src/common/svg/gradient.ts +53 -53
  115. package/src/common/svg/index.ts +420 -420
  116. package/src/common/svg/tool.ts +51 -51
  117. package/src/common/tree/index.ts +25 -25
  118. package/src/common/tree/toInnerTree.ts +61 -61
  119. package/src/common/tree/toPlainTree.ts +135 -135
  120. package/src/common/type.ts +26 -26
  121. package/src/common/webgl/buffer.ts +79 -79
  122. package/src/common/webgl/getWebGLContext.ts +45 -45
  123. package/src/common/webgl/shader.ts +75 -75
  124. package/src/common/webgl/texture.ts +98 -98
  125. package/src/coordinate/MapCoordinate.ts +80 -80
  126. package/src/getLoopColors.ts +42 -42
  127. package/src/interpolation/Cardinal.ts +110 -110
  128. package/src/interpolation/Hermite.ts +65 -65
  129. package/src/layout/BarLayout.ts +249 -249
  130. package/src/layout/PieLayout.ts +146 -146
  131. package/src/layout/TreeLayout.ts +200 -200
  132. package/src/move.ts +7 -7
  133. package/src/rotate.ts +7 -7
  134. package/src/ruler.ts +209 -209
  135. package/src/scale.ts +6 -6
  136. package/types/Bar.d.ts +91 -91
  137. package/types/BarConfig.d.ts +4 -4
  138. package/types/BarLayout.d.ts +48 -48
  139. package/types/BarOption.d.ts +31 -31
  140. package/types/Buffer.d.ts +30 -30
  141. package/types/Canvas.d.ts +379 -379
  142. package/types/CanvasConfig.d.ts +61 -61
  143. package/types/CanvasOption.d.ts +13 -13
  144. package/types/CanvasOpts.d.ts +9 -9
  145. package/types/Cardinal.d.ts +20 -20
  146. package/types/Gradient.d.ts +20 -20
  147. package/types/Hermite.d.ts +25 -25
  148. package/types/Map.d.ts +9 -9
  149. package/types/MapConfig.d.ts +27 -27
  150. package/types/MapCoordinate.d.ts +22 -22
  151. package/types/Matrix4.d.ts +79 -79
  152. package/types/Pie.d.ts +73 -73
  153. package/types/PieConfig.d.ts +26 -26
  154. package/types/PieLayout.d.ts +40 -40
  155. package/types/PieOption.d.ts +21 -21
  156. package/types/SVG.d.ts +282 -282
  157. package/types/SVGConfig.d.ts +54 -54
  158. package/types/Shader.d.ts +22 -22
  159. package/types/Texture.d.ts +22 -22
  160. package/types/Tree.d.ts +74 -74
  161. package/types/TreeConfig.d.ts +52 -52
  162. package/types/TreeLayout.d.ts +71 -71
  163. package/types/TreeOption.d.ts +48 -48
  164. package/types/animation.d.ts +26 -26
  165. package/types/assemble.d.ts +14 -14
  166. package/types/getLoopColors.d.ts +13 -13
  167. package/types/getWebGLContext.d.ts +7 -7
  168. package/types/index.d.ts +220 -220
  169. package/types/module.d.ts +110 -110
  170. package/types/move.d.ts +15 -15
  171. package/types/option.d.ts +12 -12
  172. package/types/painterConfig.d.ts +14 -14
  173. package/types/rotate.d.ts +15 -15
  174. package/types/ruler.d.ts +24 -24
  175. package/types/scale.d.ts +15 -15
  176. package/types/throttle.d.ts +6 -6
  177. package/types/ui-canvas.d.ts +4 -4
  178. package/types/uni-canvas.d.ts +3 -3
  179. package/uni-app/drawImage.js +19 -19
  180. 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