align.js 3.1 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697
  1. "use strict";
  2. Object.defineProperty(exports, "__esModule", { value: true });
  3. exports.getAlignPoint = exports.getPointByPosition = exports.getOutSides = void 0;
  4. // 检测各边是否超出
  5. function getOutSides(x, y, width, height, limitBox) {
  6. var hits = {
  7. left: x < limitBox.x,
  8. right: x + width > limitBox.x + limitBox.width,
  9. top: y < limitBox.y,
  10. bottom: y + height > limitBox.y + limitBox.height,
  11. };
  12. return hits;
  13. }
  14. exports.getOutSides = getOutSides;
  15. function getPointByPosition(x, y, offset, width, height, position) {
  16. var px = x;
  17. var py = y;
  18. switch (position) {
  19. case 'left': // left center
  20. px = x - width - offset;
  21. py = y - height / 2;
  22. break;
  23. case 'right':
  24. px = x + offset;
  25. py = y - height / 2;
  26. break;
  27. case 'top':
  28. px = x - width / 2;
  29. py = y - height - offset;
  30. break;
  31. case 'bottom':
  32. // bottom
  33. px = x - width / 2;
  34. py = y + offset;
  35. break;
  36. default:
  37. // auto, 在 top-right
  38. px = x + offset;
  39. py = y - height - offset;
  40. break;
  41. }
  42. return {
  43. x: px,
  44. y: py,
  45. };
  46. }
  47. exports.getPointByPosition = getPointByPosition;
  48. function getAlignPoint(x, y, offset, width, height, position, limitBox) {
  49. var point = getPointByPosition(x, y, offset, width, height, position);
  50. if (limitBox) {
  51. var outSides = getOutSides(point.x, point.y, width, height, limitBox);
  52. if (position === 'auto') {
  53. // 如果是 auto,默认 tooltip 在右上角,仅需要判定右侧和上测冲突即可
  54. if (outSides.right) {
  55. point.x = Math.max(0, x - width - offset);
  56. }
  57. if (outSides.top) {
  58. point.y = Math.max(0, y - height - offset);
  59. }
  60. }
  61. else if (position === 'top' || position === 'bottom') {
  62. if (outSides.left) {
  63. // 左侧躲避
  64. point.x = limitBox.x;
  65. }
  66. if (outSides.right) {
  67. // 右侧躲避
  68. point.x = limitBox.x + limitBox.width - width;
  69. }
  70. if (position === 'top' && outSides.top) {
  71. // 如果上面对齐检测上面,不检测下面
  72. point.y = y + offset;
  73. }
  74. if (position === 'bottom' && outSides.bottom) {
  75. point.y = y - height - offset;
  76. }
  77. }
  78. else {
  79. // 检测左右位置
  80. if (outSides.top) {
  81. point.y = limitBox.y;
  82. }
  83. if (outSides.bottom) {
  84. point.y = limitBox.y + limitBox.height - height;
  85. }
  86. if (position === 'left' && outSides.left) {
  87. point.x = x + offset;
  88. }
  89. if (position === 'right' && outSides.right) {
  90. point.x = x - width - offset;
  91. }
  92. }
  93. }
  94. return point;
  95. }
  96. exports.getAlignPoint = getAlignPoint;
  97. //# sourceMappingURL=align.js.map