We use cookies to ensure that we give you the best experience on our website. If you continue to use this site we will assume that you are happy with it.

Ok, I Agree

App only works after refreshing the page.

Home › Forums › WebGL & WebXR Troubleshooting › App only works after refreshing the page.

Tagged: 

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • 2022-03-15 at 9:05 am #50265
    raphroberts
    Customer

    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:
    https://content.une.edu.au/2022/3d_explainer/index.html

    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 #50270
    Yuri Kovelenov
    Staff

    hi,

    we are too seeing only black screen. I think the canvas element (and the iframe) must be of certain dimensions originally (i.e. not zero pixels) for WebGL to work properly.

    Chief 3D Verger | LinkedIn | Twitter

    2022-03-15 at 12:00 pm #50272
    raphroberts
    Customer

    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

    Attachments:
    You must be logged in to view attached files.
    2022-03-15 at 1:24 pm #50279
    Yuri Kovelenov
    Staff

    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)

    Chief 3D Verger | LinkedIn | Twitter

    2022-03-16 at 7:38 am #50299
    raphroberts
    Customer

    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:

    https://content.une.edu.au/2022/3D_demo/index.html

    2022-03-16 at 8:02 am #50301
    Yuri Kovelenov
    Staff

    yup, it works for me too!

    Chief 3D Verger | LinkedIn | Twitter

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.