4 ms·

The webgl examples don't seem to be working :(

Jasper_ 9y ago
Can you go to https://magcius.github.io/model-viewer/embed.html#sunshine_water/full https://magcius.github.io/model-viewer/embed.html#sunshine_w... and look for the console output? I've heard reports of GitHub throttling me...
- CaliforniaKarl 9y ago
  It's probably not GitHub, it's probably because of https://caniuse.com/#feat=webgl2 https://caniuse.com/#feat=webgl2
- CaliforniaKarl 9y ago
  BTW, in case you're curious, here's how the WebGL 2.0 unavailability is represented in Safari 11.0.2 on macOS 10.12.6, according to the Developer Console: [Error] Unhandled Promise Rejection: Error: Can't find variable: WebGL2RenderingContext Evaluating https://magcius.github.io/model-viewer/render https://magcius.github.io/model-viewer/render Evaluating https://magcius.github.io/model-viewer/viewer https://magcius.github.io/model-viewer/viewer Evaluating https://magcius.github.io/model-viewer/embeds/main https://magcius.github.io/model-viewer/embeds/main Loading embeds/main (anonymous function) (system.js:4:231) promiseReactionJob
comex 9y ago
They appear to be using WebGL 2, which works in Firefox and Chrome but not Safari or Edge.
- Jasper_ 9y ago
  Ah, I didn't realize that WebGL 2 had such rocky support. I'll look into porting back into WebGL 1, but I would require OES_vertex_array_object and searching online it seems to have as spurious support as WebGL 2, so I'm not sure it would be a huge improvement. For now, I'll look into adding error messages for people that cannot initialize WebGL 2.
- Narishma 9y ago
  And only if your GPU/driver isn't blacklisted.
CaliforniaKarl 9y ago
Not sure who downvoted the parent comment. Vouching for this, because: It seems the examples are using WebGL2, which (according to https://caniuse.com/#feat=webgl2 https://caniuse.com/#feat=webgl2 ) is only on by default in Chrome & Firefox (and can be enabled in Safari). So, if you're not seeing the examples, and you are _not_ using Chrome or Firefox, then you should try opening the site on that. P.S. I really do not want to start a discussion on features not being in some browsers or others.
petercooper 9y ago
For anyone who is curious but cannot render the WebGL2 examples, I've just created a video of me scrolling through them: http://no.gd/mariowater.mp4 http://no.gd/mariowater.mp4
- Jasper_ 9y ago
  Thank you! I've wanted to create backup videos as a fallback for people who cannot get the demos to work, but I haven't been able to get recording working properly.
  - petercooper 9y ago
    Well in case this helps at all, I've just created (not very optimized) animated GIFs of them all: http://no.gd/mariowater/ http://no.gd/mariowater/ If you decide to use them, I'll leave them there as long as it causes no bandwidth issues, but you might want to mirror long-term :-) (and run them through an optimizer)
    - Jasper_ 9y ago
      Thank you! I mirrored them to my own hosting and linked them at the beginning of the post.
      - petercooper 9y ago
        Awesome - go team HN! :-D

Can you go to https://magcius.github.io/model-viewer/embed.html#sunshine_water/full https://magcius.github.io/model-viewer/embed.html#sunshine_w... and look for the console output? I've heard reports of GitHub throttling me...

CaliforniaKarl 9y ago
It's probably not GitHub, it's probably because of https://caniuse.com/#feat=webgl2 https://caniuse.com/#feat=webgl2
CaliforniaKarl 9y ago
BTW, in case you're curious, here's how the WebGL 2.0 unavailability is represented in Safari 11.0.2 on macOS 10.12.6, according to the Developer Console: [Error] Unhandled Promise Rejection: Error: Can't find variable: WebGL2RenderingContext Evaluating https://magcius.github.io/model-viewer/render https://magcius.github.io/model-viewer/render Evaluating https://magcius.github.io/model-viewer/viewer https://magcius.github.io/model-viewer/viewer Evaluating https://magcius.github.io/model-viewer/embeds/main https://magcius.github.io/model-viewer/embeds/main Loading embeds/main (anonymous function) (system.js:4:231) promiseReactionJob

comex 9y ago

They appear to be using WebGL 2, which works in Firefox and Chrome but not Safari or Edge.

Jasper_ 9y ago
Ah, I didn't realize that WebGL 2 had such rocky support. I'll look into porting back into WebGL 1, but I would require OES_vertex_array_object and searching online it seems to have as spurious support as WebGL 2, so I'm not sure it would be a huge improvement. For now, I'll look into adding error messages for people that cannot initialize WebGL 2.
Narishma 9y ago
And only if your GPU/driver isn't blacklisted.

CaliforniaKarl 9y ago

Not sure who downvoted the parent comment. Vouching for this, because: It seems the examples are using WebGL2, which (according to https://caniuse.com/#feat=webgl2 https://caniuse.com/#feat=webgl2 ) is only on by default in Chrome & Firefox (and can be enabled in Safari). So, if you're not seeing the examples, and you are _not_ using Chrome or Firefox, then you should try opening the site on that. P.S. I really do not want to start a discussion on features not being in some browsers or others.

petercooper 9y ago

For anyone who is curious but cannot render the WebGL2 examples, I've just created a video of me scrolling through them: http://no.gd/mariowater.mp4 http://no.gd/mariowater.mp4

Jasper_ 9y ago
Thank you! I've wanted to create backup videos as a fallback for people who cannot get the demos to work, but I haven't been able to get recording working properly.
- petercooper 9y ago
  Well in case this helps at all, I've just created (not very optimized) animated GIFs of them all: http://no.gd/mariowater/ http://no.gd/mariowater/ If you decide to use them, I'll leave them there as long as it causes no bandwidth issues, but you might want to mirror long-term :-) (and run them through an optimizer)
  - Jasper_ 9y ago
    Thank you! I mirrored them to my own hosting and linked them at the beginning of the post.
    - petercooper 9y ago
      Awesome - go team HN! :-D