Tagged: tumult hype
2022-03-15 at 9:05 am #50265
Hello fine people!
I am using Verge3D with Tumult Hype, and everything has been working well, however the app mostly wont load the 3D content on first viewing, and only works after page refresh.
Here is a link for the problematic file:
I am guessing I need to initialise the Verge HTML Canvas somehow differently but I am not sure. The verge panel is hidden by other elements when the file first loads, if you click on the ‘skip intro’ button you can get to the 3D content.
Console messages are attached. If anyone can help it would be greatly appreciated. Thanks!
Attachments:You must be logged in to view attached files.2022-03-15 at 10:20 am #502702022-03-15 at 12:00 pm #50272
Hello, thanks so much for your reply.
I made a (very hacky/horrible) change to the code, so that the main verge js content only fires after 2 seconds have passed. Screenshot attached.
This has stopped the problem (at least on my end), but I am aware that this is not a good solution.
The iframe and canvas element are initialised at the correct size, it is only that the z-index puts them behind a rectangle so they can’t be seen when the page first loads.
I’m sharing this in the hopes someone might be able to use this information to determine what the actual problem might be. It might be related to the way Tumult Hype handles things, perhaps.
Here is the link for the new (hacky) code that is at least working: https://content.une.edu.au/2022/3d_explainer_1s/index.html
- This reply was modified 8 months, 2 weeks ago by raphroberts.
Attachments:You must be logged in to view attached files.2022-03-15 at 1:24 pm #50279
Still black screen for me with error “Framebuffer is incomplete: Attachment has zero size.” meaning the WebGL canvas with zero dimensions. I think this is because Hype generates the HTML elements on the fly, so the canvas size is not set when the Verge3D app is initialized.
I’d try to bypass Hype’s iframe. Instead, you might add an element, a rectangle. Double-click and click on the pencil to edit the innerHTML. Add an iframe element like
<iframe width="100%" height="100%" frameborder="0" src="my_awesome_app.html"></iframe>
(I modified this advice)
2022-03-16 at 7:38 am #50299
- This reply was modified 8 months, 2 weeks ago by Yuri Kovelenov.
Hi Yuri – thanks again. I have updated as suggested, and it seems to be working well!
Because the other version was already working for me, I would love (if you have a chance) to check and see if it is now working on your machine alose, that would be greatly appreciated:2022-03-16 at 8:02 am #50301
- You must be logged in to reply to this topic.