ellipse.js 5.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147
  1. "use strict";
  2. /**
  3. * @fileoverview 椭圆的一些计算,
  4. * - 周长计算参考:https://www.mathsisfun.com/geometry/ellipse-perimeter.html
  5. * - 距离计算参考:https://wet-robots.ghost.io/simple-method-for-distance-to-ellipse/
  6. * @author dxq613@gmail.com
  7. */
  8. Object.defineProperty(exports, "__esModule", { value: true });
  9. var util_1 = require("./util");
  10. function copysign(v1, v2) {
  11. var absv = Math.abs(v1);
  12. return v2 > 0 ? absv : absv * -1;
  13. }
  14. exports.default = {
  15. /**
  16. * 包围盒计算
  17. * @param {number} x 椭圆中心 x
  18. * @param {number} y 椭圆中心 y
  19. * @param {number} rx 椭圆 x 方向半径
  20. * @param {number} ry 椭圆 y 方向半径
  21. * @return {object} 包围盒
  22. */
  23. box: function (x, y, rx, ry) {
  24. return {
  25. x: x - rx,
  26. y: y - ry,
  27. width: rx * 2,
  28. height: ry * 2,
  29. };
  30. },
  31. /**
  32. * 计算周长,使用近似法
  33. * @param {number} x 椭圆中心 x
  34. * @param {number} y 椭圆中心 y
  35. * @param {number} rx 椭圆 x 方向半径
  36. * @param {number} ry 椭圆 y 方向半径
  37. * @return {number} 椭圆周长
  38. */
  39. length: function (x, y, rx, ry) {
  40. return Math.PI * (3 * (rx + ry) - Math.sqrt((3 * rx + ry) * (rx + 3 * ry)));
  41. },
  42. /**
  43. * 距离椭圆最近的点
  44. * @param {number} x 椭圆中心 x
  45. * @param {number} y 椭圆中心 y
  46. * @param {number} rx 椭圆 x 方向半径
  47. * @param {number} ry 椭圆 y 方向半径
  48. * @param {number} x0 指定的点 x
  49. * @param {number} y0 指定的点 y
  50. * @return {object} 椭圆上距离指定点最近的点
  51. */
  52. nearestPoint: function (x, y, rx, ry, x0, y0) {
  53. var a = rx;
  54. var b = ry;
  55. // 假如椭圆半径为0则返回圆心
  56. if (a === 0 || b === 0) {
  57. return {
  58. x: x,
  59. y: y,
  60. };
  61. }
  62. // 转换成 0, 0 为中心的椭圆计算
  63. var relativeX = x0 - x;
  64. var relativeY = y0 - y;
  65. var px = Math.abs(relativeX);
  66. var py = Math.abs(relativeY);
  67. var squareA = a * a;
  68. var squareB = b * b;
  69. // const angle0 = Math.atan2(relativeY, relativeX);
  70. var t = Math.PI / 4;
  71. var nearestX; // 椭圆上的任一点
  72. var nearestY;
  73. // 迭代 4 次
  74. for (var i = 0; i < 4; i++) {
  75. nearestX = a * Math.cos(t);
  76. nearestY = b * Math.sin(t);
  77. var ex = ((squareA - squareB) * Math.pow(Math.cos(t), 3)) / a;
  78. var ey = ((squareB - squareA) * Math.pow(Math.sin(t), 3)) / b;
  79. var rx1 = nearestX - ex;
  80. var ry1 = nearestY - ey;
  81. var qx = px - ex;
  82. var qy = py - ey;
  83. var r = Math.hypot(ry1, rx1);
  84. var q = Math.hypot(qy, qx);
  85. var delta_c = r * Math.asin((rx1 * qy - ry1 * qx) / (r * q));
  86. var delta_t = delta_c / Math.sqrt(squareA + squareB - nearestX * nearestX - nearestY * nearestY);
  87. t += delta_t;
  88. t = Math.min(Math.PI / 2, Math.max(0, t));
  89. }
  90. return {
  91. x: x + copysign(nearestX, relativeX),
  92. y: y + copysign(nearestY, relativeY),
  93. };
  94. },
  95. /**
  96. * 点到椭圆最近的距离
  97. * @param {number} x 椭圆中心 x
  98. * @param {number} y 椭圆中心 y
  99. * @param {number} rx 椭圆 x 方向半径
  100. * @param {number} ry 椭圆 y 方向半径
  101. * @param {number} x0 指定的点 x
  102. * @param {number} y0 指定的点 y
  103. * @return {number} 点到椭圆的距离
  104. */
  105. pointDistance: function (x, y, rx, ry, x0, y0) {
  106. var nearestPoint = this.nearestPoint(x, y, rx, ry, x0, y0);
  107. return util_1.distance(nearestPoint.x, nearestPoint.y, x0, y0);
  108. },
  109. /**
  110. * 根据比例获取点
  111. * @param {number} x 椭圆中心 x
  112. * @param {number} y 椭圆中心 y
  113. * @param {number} rx 椭圆 x 方向半径
  114. * @param {number} ry 椭圆 y 方向半径
  115. * @param {number} t 指定比例,x轴方向为 0
  116. * @return {object} 点
  117. */
  118. pointAt: function (x, y, rx, ry, t) {
  119. var angle = 2 * Math.PI * t; // 按照角度进行计算,而不按照周长计算
  120. return {
  121. x: x + rx * Math.cos(angle),
  122. y: y + ry * Math.sin(angle),
  123. };
  124. },
  125. /**
  126. * 根据比例计算切线角度
  127. * @param {number} x 椭圆中心 x
  128. * @param {number} y 椭圆中心 y
  129. * @param {number} rx 椭圆 x 方向半径
  130. * @param {number} ry 椭圆 y 方向半径
  131. * @param {number} t 指定比例 0 - 1 之间,x轴方向为 0。在 0-1 范围之外是循环还是返回 null,还需要调整
  132. * @return {number} 角度,在 0 - 2PI 之间
  133. */
  134. tangentAngle: function (x, y, rx, ry, t) {
  135. var angle = 2 * Math.PI * t; // 按照角度进行计算,而不按照周长计算
  136. // 直接使用 x,y 的导数计算, x' = -rx * sin(t); y' = ry * cos(t);
  137. var tangentAngle = Math.atan2(ry * Math.cos(angle), -rx * Math.sin(angle));
  138. // 也可以使用指定点的切线方程计算,成本有些高
  139. // const point = this.pointAt(0, 0, rx, ry, t); // 椭圆的切线同椭圆的中心不相关
  140. // let tangentAngle = -1 * Math.atan((ry * ry * point.x) / (rx * rx * point.y));
  141. // if (angle >= 0 && angle <= Math.PI) {
  142. // tangentAngle += Math.PI;
  143. // }
  144. return util_1.piMod(tangentAngle);
  145. },
  146. };
  147. //# sourceMappingURL=ellipse.js.map