SPath.ts 6.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208
  1. /*
  2. * *********************************************************************************************************************
  3. *
  4. * !!
  5. * .F88X
  6. * X8888Y
  7. * .}888888N;
  8. * i888888N; .:! .I$WI:
  9. * R888888I .'N88~ i8}+8Y&8"l8i$8>8W~'>W8}8]KW+8IIN"8&
  10. * .R888888I .;N8888~ .X8' "8I.!,/8" !%NY8`"8I8~~8>,88I
  11. * +888888N; .8888888Y "&&8Y.}8,
  12. * ./888888N; .R888888Y .'}~ .>}'.`+> i}! "i' +/' .'i~ !11,.:">, .~]! .i}i
  13. * ~888888%: .I888888l .]88~`1/iY88Ii+1'.R$8$8]"888888888> Y8$ W8E X8E W8888'188Il}Y88$*
  14. * 18888888 E8888881 .]W%8$`R8X'&8%++N8i,8N%N8+l8%` .}8N:.R$RE%N88N%N$K$R 188,FE$8%~Y88I
  15. * .E888888I .i8888888' .:$8I;88+`E8R:/8N,.>881.`$8E/1/]N8X.Y8N`"KF&&FK!'88*."88K./$88%RN888+~
  16. * 8888888I .,N888888~ ~88i"8W,!N8*.I88.}888%F,i$88"F88" 888:E8X.>88!i88>`888*.}Fl1]*}1YKi'
  17. * i888888N' I888Y ]88;/EX*IFKFK88X K8R .l8W 88Y ~88}'88E&%8W.X8N``]88!.$8K .:W8I
  18. * .i888888N; I8Y .&8$ .X88! i881.:%888>I88 ;88] +88+.';;;;:.Y88X 18N.,88l .+88/
  19. * .:R888888I
  20. * .&888888I Copyright (c) 2009-2020. 博锐尚格科技股份有限公司
  21. * ~8888'
  22. * .!88~ All rights reserved.
  23. *
  24. * *********************************************************************************************************************
  25. */
  26. import { SPathCommand } from "./SPathCommand";
  27. import { SPoint } from "./types/SPoint";
  28. /**
  29. * Path 对象
  30. *
  31. * @author 庞利祥 <sybotan@126.com>
  32. */
  33. export class SPath {
  34. /** 命令集合 */
  35. cmdList: SPathCommand[] = [];
  36. /**
  37. * 添加 path 命令
  38. *
  39. * @param cmd 命令
  40. * @param args 命令参数
  41. */
  42. private addCommand(cmd: string, ...args: number[]): void {
  43. this.cmdList.push({ command: cmd, args: args });
  44. } // Function addCommand()
  45. /**
  46. * 添加一条新路径到对当前路径。
  47. *
  48. * @param path 路径对象
  49. */
  50. addPath(path: SPath): void {
  51. this.cmdList = this.cmdList.concat(path.cmdList);
  52. } // Function addPath()
  53. /**
  54. * 使笔点返回到当前子路径的起始点。它尝试从当前点到起始点绘制一条直线。 如果图形已经是封闭的或者只有一个点,那么此函数不会做任何操作。
  55. */
  56. closePath(): void {
  57. this.addCommand("Z");
  58. } // Function closePath()
  59. /**
  60. * 移动当前点到指定位置
  61. *
  62. * @param x X 坐标
  63. * @param y Y 坐标
  64. */
  65. moveTo(x: number, y: number): void {
  66. this.addCommand("M", x, y);
  67. } // Function moveTo()
  68. /**
  69. * 从当前点向指定点画线
  70. *
  71. * @param x X 坐标
  72. * @param y Y 坐标
  73. */
  74. lineTo(x: number, y: number): void {
  75. this.addCommand("L", x, y);
  76. } // Function lineTo()
  77. /**
  78. * 添加一条圆弧路径。
  79. *
  80. * @param x 圆孤圆心的 X 坐标
  81. * @param y 圆弧圆心的 Y 坐标
  82. * @param radius 圆弧半径
  83. * @param startAngle 开始角度
  84. * @param endAngle 结束角度
  85. * @param anticlockwise 是否逆时针绘制( 1 是, 0 不是)
  86. */
  87. arc(
  88. x: number,
  89. y: number,
  90. radius: number,
  91. startAngle: number,
  92. endAngle: number,
  93. anticlockwise: number
  94. ): void {
  95. this.addCommand(
  96. "Arc",
  97. x,
  98. y,
  99. radius,
  100. startAngle,
  101. endAngle,
  102. anticlockwise
  103. );
  104. } // Function arc()
  105. /**
  106. * 根据控制点和半径添加一条圆弧路径,使用直线连接前一个点。
  107. *
  108. * @param x1 点 1 的 x 坐标
  109. * @param y1 点 1 的 y 坐标
  110. * @param x2 点 2 的 x 坐标
  111. * @param y2 点 1 的 y 坐标
  112. * @param radius 半径
  113. */
  114. arcTo(
  115. x1: number,
  116. y1: number,
  117. x2: number,
  118. y2: number,
  119. radius: number
  120. ): void {
  121. this.addCommand("ArcTo", x1, y1, x2, y2, radius);
  122. } // Function arcTo()
  123. /**
  124. * 添加二次贝塞尔曲线
  125. *
  126. * @param cp1x 控制点 X 坐标
  127. * @param cp1y 控制点 Y 坐标
  128. * @param x 结束点 X 坐标
  129. * @param y 结束点 Y 坐标
  130. */
  131. quadraticCurveTo(cp1x: number, cp1y: number, x: number, y: number): void {
  132. this.addCommand("Q", cp1x, cp1y, x, y);
  133. } // Function quadraticCurveTo()
  134. /**
  135. * 添加三次贝塞尔曲线
  136. *
  137. * @param cp1x 起始点控制点 X 坐标
  138. * @param cp1y 起始点控制点 Y 坐标
  139. * @param cp2x 结束点控制点 X 坐标
  140. * @param cp2y 结束点控制点 Y 坐标
  141. * @param x 结束点 X 坐标
  142. * @param y 结束点 Y 坐标
  143. */
  144. bezierCurveTo(
  145. cp1x: number,
  146. cp1y: number,
  147. cp2x: number,
  148. cp2y: number,
  149. x: number,
  150. y: number
  151. ): void {
  152. this.addCommand("C", cp1x, cp1y, cp2x, cp2y, x, y);
  153. } // Function bezierCurveTo()
  154. /**
  155. * 添加椭圆
  156. *
  157. * @param cx 圆点 X 坐标
  158. * @param cy 圆点 Y 坐标
  159. * @param rx 水平半径
  160. * @param ry 垂直半径
  161. */
  162. ellipse(cx: number, cy: number, rx: number, ry: number): void {
  163. this.addCommand("Ellipse", cx, cy, rx, ry);
  164. } // Function ellipse()
  165. /**
  166. * 添加矩形
  167. *
  168. * @param x X 坐标
  169. * @param y Y 坐标
  170. * @param w 宽度
  171. * @param h 高度
  172. */
  173. rect(x: number, y: number, w: number, h: number): void {
  174. this.addCommand("M", x, y);
  175. this.addCommand("L", x + w, y);
  176. this.addCommand("L", x + w, y + h);
  177. this.addCommand("L", x, y + h);
  178. this.addCommand("Z");
  179. } // Function rect()
  180. /**
  181. * 添加多边形
  182. *
  183. * @param pList 点集数组
  184. */
  185. polygon(pList: SPoint[]): void {
  186. if (pList.length > 2) {
  187. this.addCommand("M", pList[0].x, pList[0].y);
  188. for (let i = 1; i < pList.length; i++) {
  189. this.addCommand("L", pList[i].x, pList[i].y);
  190. }
  191. this.addCommand("Z");
  192. }
  193. } // Function polygon()
  194. } // Class SPath