fix(calendar-lab): center panzoom fit on selected target
This commit is contained in:
@@ -73,6 +73,7 @@ function getRectInScene(element: HTMLElement, scene: HTMLElement) {
|
|||||||
let x = 0;
|
let x = 0;
|
||||||
let y = 0;
|
let y = 0;
|
||||||
let node: HTMLElement | null = element;
|
let node: HTMLElement | null = element;
|
||||||
|
let reachedScene = false;
|
||||||
|
|
||||||
while (node && node !== scene) {
|
while (node && node !== scene) {
|
||||||
x += node.offsetLeft;
|
x += node.offsetLeft;
|
||||||
@@ -80,6 +81,22 @@ function getRectInScene(element: HTMLElement, scene: HTMLElement) {
|
|||||||
node = node.offsetParent as HTMLElement | null;
|
node = node.offsetParent as HTMLElement | null;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (node === scene) {
|
||||||
|
reachedScene = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!reachedScene) {
|
||||||
|
const sceneRect = scene.getBoundingClientRect();
|
||||||
|
const elementRect = element.getBoundingClientRect();
|
||||||
|
const scale = panzoomRef.value?.getScale() ?? 1;
|
||||||
|
return {
|
||||||
|
x: (elementRect.left - sceneRect.left) / Math.max(0.0001, scale),
|
||||||
|
y: (elementRect.top - sceneRect.top) / Math.max(0.0001, scale),
|
||||||
|
width: Math.max(1, elementRect.width / Math.max(0.0001, scale)),
|
||||||
|
height: Math.max(1, elementRect.height / Math.max(0.0001, scale)),
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
return {
|
return {
|
||||||
x,
|
x,
|
||||||
y,
|
y,
|
||||||
@@ -459,6 +476,7 @@ onBeforeUnmount(() => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.calendar-lab-scene {
|
.calendar-lab-scene {
|
||||||
|
position: relative;
|
||||||
width: 1400px;
|
width: 1400px;
|
||||||
height: 900px;
|
height: 900px;
|
||||||
will-change: transform;
|
will-change: transform;
|
||||||
|
|||||||
Reference in New Issue
Block a user