diff --git a/src/components/organisms/InteractiveGlobe2.svelte b/src/components/organisms/InteractiveGlobe2.svelte index 6ec8dc2..a25bbd5 100644 --- a/src/components/organisms/InteractiveGlobe2.svelte +++ b/src/components/organisms/InteractiveGlobe2.svelte @@ -7,7 +7,7 @@ import { fly } from 'svelte/transition' import { quartOut } from 'svelte/easing' import { Globe, type Marker } from '$modules/globe2' - import { getRandomItem } from '$utils/functions' + import { getRandomItem, debounce } from '$utils/functions' // Components import Image from '$components/atoms/Image.svelte' @@ -90,9 +90,9 @@ } // Resize - const resize = () => { + const resize = debounce(() => { globe.resize() - } + }, 100) // Destroy const destroy = () => { diff --git a/src/modules/globe2/index.ts b/src/modules/globe2/index.ts index 662d58d..fc2c87b 100644 --- a/src/modules/globe2/index.ts +++ b/src/modules/globe2/index.ts @@ -210,6 +210,8 @@ export class Globe { */ resize () { // this.renderer.setSize(window.innerWidth, window.innerHeight) + this.width = this.el.offsetWidth + this.height = this.el.offsetHeight this.renderer.setSize(this.width, this.height) this.camera.perspective({ aspect: this.gl.canvas.width / this.gl.canvas.height