path-intersection.js 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367
  1. import { isArray } from 'lodash-es';
  2. import rectPath from './rect-path';
  3. import path2Curve from './path-2-curve';
  4. var base3 = function (t, p1, p2, p3, p4) {
  5. var t1 = -3 * p1 + 9 * p2 - 9 * p3 + 3 * p4;
  6. var t2 = t * t1 + 6 * p1 - 12 * p2 + 6 * p3;
  7. return t * t2 - 3 * p1 + 3 * p2;
  8. };
  9. var bezlen = function (x1, y1, x2, y2, x3, y3, x4, y4, z) {
  10. if (z === null) {
  11. z = 1;
  12. }
  13. z = z > 1 ? 1 : z < 0 ? 0 : z;
  14. var z2 = z / 2;
  15. var n = 12;
  16. var Tvalues = [
  17. -0.1252, 0.1252, -0.3678, 0.3678, -0.5873, 0.5873, -0.7699, 0.7699, -0.9041, 0.9041, -0.9816, 0.9816,
  18. ];
  19. var Cvalues = [0.2491, 0.2491, 0.2335, 0.2335, 0.2032, 0.2032, 0.1601, 0.1601, 0.1069, 0.1069, 0.0472, 0.0472];
  20. var sum = 0;
  21. for (var i = 0; i < n; i++) {
  22. var ct = z2 * Tvalues[i] + z2;
  23. var xbase = base3(ct, x1, x2, x3, x4);
  24. var ybase = base3(ct, y1, y2, y3, y4);
  25. var comb = xbase * xbase + ybase * ybase;
  26. sum += Cvalues[i] * Math.sqrt(comb);
  27. }
  28. return z2 * sum;
  29. };
  30. var curveDim = function (x0, y0, x1, y1, x2, y2, x3, y3) {
  31. var tvalues = [];
  32. var bounds = [[], []];
  33. var a;
  34. var b;
  35. var c;
  36. var t;
  37. for (var i = 0; i < 2; ++i) {
  38. if (i === 0) {
  39. b = 6 * x0 - 12 * x1 + 6 * x2;
  40. a = -3 * x0 + 9 * x1 - 9 * x2 + 3 * x3;
  41. c = 3 * x1 - 3 * x0;
  42. }
  43. else {
  44. b = 6 * y0 - 12 * y1 + 6 * y2;
  45. a = -3 * y0 + 9 * y1 - 9 * y2 + 3 * y3;
  46. c = 3 * y1 - 3 * y0;
  47. }
  48. if (Math.abs(a) < 1e-12) {
  49. if (Math.abs(b) < 1e-12) {
  50. continue;
  51. }
  52. t = -c / b;
  53. if (t > 0 && t < 1) {
  54. tvalues.push(t);
  55. }
  56. continue;
  57. }
  58. var b2ac = b * b - 4 * c * a;
  59. var sqrtb2ac = Math.sqrt(b2ac);
  60. if (b2ac < 0) {
  61. continue;
  62. }
  63. var t1 = (-b + sqrtb2ac) / (2 * a);
  64. if (t1 > 0 && t1 < 1) {
  65. tvalues.push(t1);
  66. }
  67. var t2 = (-b - sqrtb2ac) / (2 * a);
  68. if (t2 > 0 && t2 < 1) {
  69. tvalues.push(t2);
  70. }
  71. }
  72. var j = tvalues.length;
  73. var jlen = j;
  74. var mt;
  75. while (j--) {
  76. t = tvalues[j];
  77. mt = 1 - t;
  78. bounds[0][j] = mt * mt * mt * x0 + 3 * mt * mt * t * x1 + 3 * mt * t * t * x2 + t * t * t * x3;
  79. bounds[1][j] = mt * mt * mt * y0 + 3 * mt * mt * t * y1 + 3 * mt * t * t * y2 + t * t * t * y3;
  80. }
  81. bounds[0][jlen] = x0;
  82. bounds[1][jlen] = y0;
  83. bounds[0][jlen + 1] = x3;
  84. bounds[1][jlen + 1] = y3;
  85. bounds[0].length = bounds[1].length = jlen + 2;
  86. return {
  87. min: {
  88. x: Math.min.apply(0, bounds[0]),
  89. y: Math.min.apply(0, bounds[1]),
  90. },
  91. max: {
  92. x: Math.max.apply(0, bounds[0]),
  93. y: Math.max.apply(0, bounds[1]),
  94. },
  95. };
  96. };
  97. var intersect = function (x1, y1, x2, y2, x3, y3, x4, y4) {
  98. if (Math.max(x1, x2) < Math.min(x3, x4) ||
  99. Math.min(x1, x2) > Math.max(x3, x4) ||
  100. Math.max(y1, y2) < Math.min(y3, y4) ||
  101. Math.min(y1, y2) > Math.max(y3, y4)) {
  102. return;
  103. }
  104. var nx = (x1 * y2 - y1 * x2) * (x3 - x4) - (x1 - x2) * (x3 * y4 - y3 * x4);
  105. var ny = (x1 * y2 - y1 * x2) * (y3 - y4) - (y1 - y2) * (x3 * y4 - y3 * x4);
  106. var denominator = (x1 - x2) * (y3 - y4) - (y1 - y2) * (x3 - x4);
  107. if (!denominator) {
  108. return;
  109. }
  110. var px = nx / denominator;
  111. var py = ny / denominator;
  112. var px2 = +px.toFixed(2);
  113. var py2 = +py.toFixed(2);
  114. if (px2 < +Math.min(x1, x2).toFixed(2) ||
  115. px2 > +Math.max(x1, x2).toFixed(2) ||
  116. px2 < +Math.min(x3, x4).toFixed(2) ||
  117. px2 > +Math.max(x3, x4).toFixed(2) ||
  118. py2 < +Math.min(y1, y2).toFixed(2) ||
  119. py2 > +Math.max(y1, y2).toFixed(2) ||
  120. py2 < +Math.min(y3, y4).toFixed(2) ||
  121. py2 > +Math.max(y3, y4).toFixed(2)) {
  122. return;
  123. }
  124. return {
  125. x: px,
  126. y: py,
  127. };
  128. };
  129. var isPointInsideBBox = function (bbox, x, y) {
  130. return x >= bbox.x && x <= bbox.x + bbox.width && y >= bbox.y && y <= bbox.y + bbox.height;
  131. };
  132. var box = function (x, y, width, height) {
  133. if (x === null) {
  134. x = y = width = height = 0;
  135. }
  136. if (y === null) {
  137. y = x.y;
  138. width = x.width;
  139. height = x.height;
  140. x = x.x;
  141. }
  142. return {
  143. x: x,
  144. y: y,
  145. width: width,
  146. w: width,
  147. height: height,
  148. h: height,
  149. x2: x + width,
  150. y2: y + height,
  151. cx: x + width / 2,
  152. cy: y + height / 2,
  153. r1: Math.min(width, height) / 2,
  154. r2: Math.max(width, height) / 2,
  155. r0: Math.sqrt(width * width + height * height) / 2,
  156. path: rectPath(x, y, width, height),
  157. vb: [x, y, width, height].join(' '),
  158. };
  159. };
  160. var isBBoxIntersect = function (bbox1, bbox2) {
  161. // @ts-ignore
  162. bbox1 = box(bbox1);
  163. // @ts-ignore
  164. bbox2 = box(bbox2);
  165. return (isPointInsideBBox(bbox2, bbox1.x, bbox1.y) ||
  166. isPointInsideBBox(bbox2, bbox1.x2, bbox1.y) ||
  167. isPointInsideBBox(bbox2, bbox1.x, bbox1.y2) ||
  168. isPointInsideBBox(bbox2, bbox1.x2, bbox1.y2) ||
  169. isPointInsideBBox(bbox1, bbox2.x, bbox2.y) ||
  170. isPointInsideBBox(bbox1, bbox2.x2, bbox2.y) ||
  171. isPointInsideBBox(bbox1, bbox2.x, bbox2.y2) ||
  172. isPointInsideBBox(bbox1, bbox2.x2, bbox2.y2) ||
  173. (((bbox1.x < bbox2.x2 && bbox1.x > bbox2.x) || (bbox2.x < bbox1.x2 && bbox2.x > bbox1.x)) &&
  174. ((bbox1.y < bbox2.y2 && bbox1.y > bbox2.y) || (bbox2.y < bbox1.y2 && bbox2.y > bbox1.y))));
  175. };
  176. var bezierBBox = function (p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y) {
  177. if (!isArray(p1x)) {
  178. p1x = [p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y];
  179. }
  180. var bbox = curveDim.apply(null, p1x);
  181. return box(bbox.min.x, bbox.min.y, bbox.max.x - bbox.min.x, bbox.max.y - bbox.min.y);
  182. };
  183. var findDotsAtSegment = function (p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, t) {
  184. var t1 = 1 - t;
  185. var t13 = Math.pow(t1, 3);
  186. var t12 = Math.pow(t1, 2);
  187. var t2 = t * t;
  188. var t3 = t2 * t;
  189. var x = t13 * p1x + t12 * 3 * t * c1x + t1 * 3 * t * t * c2x + t3 * p2x;
  190. var y = t13 * p1y + t12 * 3 * t * c1y + t1 * 3 * t * t * c2y + t3 * p2y;
  191. var mx = p1x + 2 * t * (c1x - p1x) + t2 * (c2x - 2 * c1x + p1x);
  192. var my = p1y + 2 * t * (c1y - p1y) + t2 * (c2y - 2 * c1y + p1y);
  193. var nx = c1x + 2 * t * (c2x - c1x) + t2 * (p2x - 2 * c2x + c1x);
  194. var ny = c1y + 2 * t * (c2y - c1y) + t2 * (p2y - 2 * c2y + c1y);
  195. var ax = t1 * p1x + t * c1x;
  196. var ay = t1 * p1y + t * c1y;
  197. var cx = t1 * c2x + t * p2x;
  198. var cy = t1 * c2y + t * p2y;
  199. var alpha = 90 - (Math.atan2(mx - nx, my - ny) * 180) / Math.PI;
  200. // (mx > nx || my < ny) && (alpha += 180);
  201. return {
  202. x: x,
  203. y: y,
  204. m: {
  205. x: mx,
  206. y: my,
  207. },
  208. n: {
  209. x: nx,
  210. y: ny,
  211. },
  212. start: {
  213. x: ax,
  214. y: ay,
  215. },
  216. end: {
  217. x: cx,
  218. y: cy,
  219. },
  220. alpha: alpha,
  221. };
  222. };
  223. var interHelper = function (bez1, bez2, justCount) {
  224. // @ts-ignore
  225. var bbox1 = bezierBBox(bez1);
  226. // @ts-ignore
  227. var bbox2 = bezierBBox(bez2);
  228. if (!isBBoxIntersect(bbox1, bbox2)) {
  229. return justCount ? 0 : [];
  230. }
  231. var l1 = bezlen.apply(0, bez1);
  232. var l2 = bezlen.apply(0, bez2);
  233. var n1 = ~~(l1 / 8);
  234. var n2 = ~~(l2 / 8);
  235. var dots1 = [];
  236. var dots2 = [];
  237. var xy = {};
  238. var res = justCount ? 0 : [];
  239. for (var i = 0; i < n1 + 1; i++) {
  240. var d = findDotsAtSegment.apply(0, bez1.concat(i / n1));
  241. dots1.push({
  242. x: d.x,
  243. y: d.y,
  244. t: i / n1,
  245. });
  246. }
  247. for (var i = 0; i < n2 + 1; i++) {
  248. var d = findDotsAtSegment.apply(0, bez2.concat(i / n2));
  249. dots2.push({
  250. x: d.x,
  251. y: d.y,
  252. t: i / n2,
  253. });
  254. }
  255. for (var i = 0; i < n1; i++) {
  256. for (var j = 0; j < n2; j++) {
  257. var di = dots1[i];
  258. var di1 = dots1[i + 1];
  259. var dj = dots2[j];
  260. var dj1 = dots2[j + 1];
  261. var ci = Math.abs(di1.x - di.x) < 0.001 ? 'y' : 'x';
  262. var cj = Math.abs(dj1.x - dj.x) < 0.001 ? 'y' : 'x';
  263. var is = intersect(di.x, di.y, di1.x, di1.y, dj.x, dj.y, dj1.x, dj1.y);
  264. if (is) {
  265. if (xy[is.x.toFixed(4)] === is.y.toFixed(4)) {
  266. continue;
  267. }
  268. xy[is.x.toFixed(4)] = is.y.toFixed(4);
  269. var t1 = di.t + Math.abs((is[ci] - di[ci]) / (di1[ci] - di[ci])) * (di1.t - di.t);
  270. var t2 = dj.t + Math.abs((is[cj] - dj[cj]) / (dj1[cj] - dj[cj])) * (dj1.t - dj.t);
  271. if (t1 >= 0 && t1 <= 1 && t2 >= 0 && t2 <= 1) {
  272. if (justCount) {
  273. // @ts-ignore
  274. res++;
  275. }
  276. else {
  277. // @ts-ignore
  278. res.push({
  279. x: is.x,
  280. y: is.y,
  281. t1: t1,
  282. t2: t2,
  283. });
  284. }
  285. }
  286. }
  287. }
  288. }
  289. return res;
  290. };
  291. var interPathHelper = function (path1, path2, justCount) {
  292. // @ts-ignore
  293. path1 = path2Curve(path1);
  294. // @ts-ignore
  295. path2 = path2Curve(path2);
  296. var x1;
  297. var y1;
  298. var x2;
  299. var y2;
  300. var x1m;
  301. var y1m;
  302. var x2m;
  303. var y2m;
  304. var bez1;
  305. var bez2;
  306. var res = justCount ? 0 : [];
  307. for (var i = 0, ii = path1.length; i < ii; i++) {
  308. var pi = path1[i];
  309. if (pi[0] === 'M') {
  310. x1 = x1m = pi[1];
  311. y1 = y1m = pi[2];
  312. }
  313. else {
  314. if (pi[0] === 'C') {
  315. bez1 = [x1, y1].concat(pi.slice(1));
  316. x1 = bez1[6];
  317. y1 = bez1[7];
  318. }
  319. else {
  320. bez1 = [x1, y1, x1, y1, x1m, y1m, x1m, y1m];
  321. x1 = x1m;
  322. y1 = y1m;
  323. }
  324. for (var j = 0, jj = path2.length; j < jj; j++) {
  325. var pj = path2[j];
  326. if (pj[0] === 'M') {
  327. x2 = x2m = pj[1];
  328. y2 = y2m = pj[2];
  329. }
  330. else {
  331. if (pj[0] === 'C') {
  332. bez2 = [x2, y2].concat(pj.slice(1));
  333. x2 = bez2[6];
  334. y2 = bez2[7];
  335. }
  336. else {
  337. bez2 = [x2, y2, x2, y2, x2m, y2m, x2m, y2m];
  338. x2 = x2m;
  339. y2 = y2m;
  340. }
  341. var intr = interHelper(bez1, bez2, justCount);
  342. if (justCount) {
  343. // @ts-ignore
  344. res += intr;
  345. }
  346. else {
  347. // @ts-ignore
  348. for (var k = 0, kk = intr.length; k < kk; k++) {
  349. intr[k].segment1 = i;
  350. intr[k].segment2 = j;
  351. intr[k].bez1 = bez1;
  352. intr[k].bez2 = bez2;
  353. }
  354. // @ts-ignore
  355. res = res.concat(intr);
  356. }
  357. }
  358. }
  359. }
  360. }
  361. return res;
  362. };
  363. export default function pathIntersection(path1, path2) {
  364. // @ts-ignore
  365. return interPathHelper(path1, path2);
  366. }
  367. //# sourceMappingURL=path-intersection.js.map