Peaceultime/obsidian-visualiser
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fix zoom performance issues

Browse Source
This commit is contained in:
Peaceultime
2025-04-19 13:44:31 +02:00
parent fef7c8f57c
commit 403a65158a
1 changed files with 12 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
components/page/Canvas.vue
View File

@@ -115,6 +115,17 @@ const canvas = computed(() => overview.value && overview.value.content ? overvie
const dispX = ref(0), dispY = ref(0), minZoom = ref(0.1), zoom = ref(0.5); const dispX = ref(0), dispY = ref(0), minZoom = ref(0.1), zoom = ref(0.5);
const canvasRef = useTemplateRef('canvasRef'), transformRef = useTemplateRef('transformRef'); const canvasRef = useTemplateRef('canvasRef'), transformRef = useTemplateRef('transformRef');
const updateScaleVar = useDebounceFn(() => {
if(transformRef.value)
{
transformRef.value.style.setProperty('--tw-scale', zoom.value.toString());
}
if(canvasRef.value)
{
canvasRef.value.style.setProperty('--zoom-multiplier', (1 / Math.pow(zoom.value, 0.7)).toFixed(3));
}
}, 100);
const reset = (_: MouseEvent) => { const reset = (_: MouseEvent) => {
zoom.value = minZoom.value; zoom.value = minZoom.value;
@@ -233,8 +244,8 @@ function updateTransform()
if(transformRef.value) if(transformRef.value)
{ {
transformRef.value.style.transform = `scale3d(${zoom.value}, ${zoom.value}, 1) translate3d(${dispX.value}px, ${dispY.value}px, 0)`; transformRef.value.style.transform = `scale3d(${zoom.value}, ${zoom.value}, 1) translate3d(${dispX.value}px, ${dispY.value}px, 0)`;
transformRef.value.style.setProperty('--tw-scale', zoom.value.toString());
} }
updateScaleVar();
} }
</script> </script>