This function then updates the HTML canvas element that the mind map is rendered on and tells three.js to adjust the settings of the 3D scene's camera. I'm going to add an window resize event listener that executes a function when the browser window resizes.
When I switch to various mobile device profiles, the mind map is cut off and not shown in the center of the viewport anymore. Execute a JavaScript when the browser window is resized: In HTML:
When I resize the browser's viewport (using the responsive preview feature of CodeSandbox, in this case), this happens:įirst, I have a viewport size equivalent to a 13" MacBook Air. I've built a mind map that is rendered with three.js. Follow me if you're interested in what I've learned along the way about building web apps with React, Tailwind CSS, Firebase, Apollo/GraphQL, three.js and TypeScript.
I'm building a social media network and collaboration tool based on mind maps, documenting my work in this series of blog posts.
0 kommentar(er)
