优化在缩放情况下的定位问题

This commit is contained in:
2betop 2020-01-17 14:27:11 +08:00
parent f4642e966e
commit 1cdbc2252d
1 changed files with 10 additions and 8 deletions

View File

@ -140,7 +140,7 @@ function getLeftDelta(
export function calculatePosition(
placement: any,
overlayNode: any,
target: any,
target: HTMLElement,
container: any,
padding: any = 0
) {
@ -149,6 +149,9 @@ export function calculatePosition(
? getOffset(target)
: getPosition(target, container);
const {height: overlayHeight, width: overlayWidth} = getOffset(overlayNode);
const clip = target.getBoundingClientRect();
const scaleX = clip.width / target.offsetWidth;
const scaleY = clip.height / target.offsetHeight;
// auto 尝试四个方向对齐。
placement =
@ -195,10 +198,9 @@ export function calculatePosition(
// 如果还有其他可选项,则做位置判断,是否在可视区域,不完全在则继续看其他定位情况。
if (tests.length) {
let clip = target.getBoundingClientRect();
const transformed = {
x: clip.x + positionLeft - childOffset.left,
y: clip.y + positionTop - childOffset.top,
x: clip.x + positionLeft / scaleX - childOffset.left,
y: clip.y + positionTop / scaleY - childOffset.top,
width: overlayWidth,
height: overlayHeight
};
@ -267,10 +269,10 @@ export function calculatePosition(
}
return {
positionLeft,
positionTop,
arrowOffsetLeft,
arrowOffsetTop,
positionLeft: positionLeft / scaleX,
positionTop: positionTop / scaleY,
arrowOffsetLeft: arrowOffsetLeft / scaleX,
arrowOffsetTop: arrowOffsetTop / scaleY,
activePlacement
};
}