Three.js not showing in WebKit Browser (Chrome, Safari)

[awSB]

Hi!

When I'm open http://mrdoob.github.com/three.js/examples/webgl_panorama_equirectangular.html in Chome 13.0.782.107 or Safari Version 5.0.5 (6533.21.1) on a Mac OSX 10.6.7 I get the the following errors:

Three.js:294:: Error creating WebGL context.
Three.js:294:: Uncaught TypeError: Cannot call method 'clearColor' of null
Three.js:294:: THREE.WebGLRenderer
webgl_panorama_equirectangular.html:66:: init
webgl_panorama_equirectangular.html:49:: (anonymous function)

When I open it in Firefox 5.0.1 everything is fine. Does someone can confirm this issue?

Thanks!

[mrdoob]

Does that happen with just that example?

[SignpostMarv]

This bug also occurs on http://svc.sl.marvulous.co.uk/raw2sculpt.html

[damoun]

The same with google chromium V14.0.835.202

Error creating WebGL context.
Uncaught TypeError: Cannot call method 'clearColor' of null

[arcanis]

Someone of my team also get this error with chrome, but in our base application (which is currently a plain white screen).

When I asked him to open one of ThreeJS demo, there was the "Invalid graphic card message" (and I think that's a correct behavior). However, as Firefox didn't throw any error, I asked him to load exactly the same demo (it was the minecraft demo), and this time the browser has hanged (no "Invalid graphic card" message).

I don't know if it could help you ...

[mrdoob]

Maybe it is because the texture is bigger than 4096x4096? I think old graphics cards (or new but crappy ones) can't handle that. Can anyone confirm?

[mrdoob]

Oh! And... does it happen in Chrome and Safari but not in Firefox?

[arcanis]

He's on Linux, so we hadn't tried Safari.

Chrome : throw following text and print "Invalid graphic card" on screen
Firefox : no error, hang out during WebGL execution (we had to pkill firefox)

Three.js:294:: Error creating WebGL context.
Three.js:294:: Uncaught TypeError: Cannot call method 'clearColor' of null

[mrdoob]

Does any other example show that error?

[alteredq]

Which stuff do you see here?

http://alteredqualia.com/tmp/webgl-maxparams-test/

Do WebGL demos not created with three.js work?

[damoun]

The WebGL MAX param with firefox : http://pastebin.com/cF37iLes

I can't run this page with chrome, I have an error :
Uncaught TypeError: Cannot read property 'MAX_VERTEX_ATTRIBS' of null

With firefox, I can watch other WebGL démo. It works without freeze (exept the minecraft demos).

[solsys]

Getting the same results as arcanin and Damoun on Chrome 15.0.874.106 on Mac OS X 10.7.2 with a Radeon 5870. Firefox 7.0.1 on the same machine works correctly.

[tanepiper]

Same with Blocky Earth (http://www.clicktorelease.com/code/blocky_earth/) on Chrome 15.0.874.106 on MacOS X 10.6.8 with ATI Radeon HD 2600 Pro. Worked fine in Firefox 7.0.1 (despite saying it was Firefox 9+ needed)

[mrdoob]

And does the cube spin here on these setups?

[alteredq]

Seems like it's not just WebGL with problems on Macs:

http://twitter.com/#!/oosmoxiecode/status/131711805243400192

Weird though that Firefox runs ok.

[kyktommy]

chrome don;t work with tutorial of getting started.
but firefox can

[knowuh]

Still seeing the error that SinoBoeckmann described in August when visiting the url: http://mrdoob.github.com/three.js/examples/webgl_panorama_equirectangular.html

Its now December 2011, and in safari 5.1.2 on 10.7.2 I see the same error using r46 of Three.js

I don't see the error it in Chrome 16.0.92.

Was there a solution I missed?

[mrdoob]

We'll try to get this "fixed" for r47.

[arodic]

Im running into this issue now. Everything worked well until few weeks ago. It seams that Chrome silently updated this causing the issue for me. Im running 16.0.912.75

On Firefox 8.0.1 context gets created but clear doesn't work.

[mrdoob]

@arodic do you have more details? do you get the issue with all the examples?

[arodic]

Yes it was with all examples but now it works (after I restarted Chrome) Weird...

[mrdoob]

Magic! :)

[KorvinSzanto]

For the record, this is based on intel integrated graphics with the mesa drivers, it's prone to crashing so chrome turns off webgl. http://code.google.com/p/chromium/issues/detail?id=76703

[stephaneeybert]

When trying the dema application with the sphere in the scene, I also have the error message:

Error creating WebGL context.
Uncaught TypeError: Cannot call method 'getExtension' of null

This occus in Chromium 22.0.1229.94 Ubuntu 12.10 (161065) on Lubuntu 12.10

[MrIsaacs]

same problem here:

Error creating WebGL context.
Uncaught TypeError: Cannot call method 'getExtension' of null

MacBook4,1 OS X 10.6.8
Chrome ver. 23.0.1271.64

WebGL Paramtest:
VERSION: WebGL 1.0 (OpenGL ES 2.0 Chromium)
SHADING_LANGUAGE_VERSION: WebGL GLSL ES 1.0 (OpenGL ES GLSL ES 1.0 Chromium)

just for record (;

[MrIsaacs]

in btw. can't you move the anwser on top? is it possible?

[andreblumenau]

Same problem running on Chromium Portable on my dad's old dual core laptop. But running Chromium Portable on my new computer, everything is all right, and at least 10fps faster, than in Chrome.

[webdevbyjoss]

Heh, I've got the same error today! Yesterday everything was working smoothly and nothing have been changed in my code. Canvas 3D context just fails to initialize for some reason.

I'm on Ubuntu 12.10 32 bit with Intel mesa driver and disabled Chrome GPU blacklist
Chrome version 24.0.1312.69

[mrdoob]

Tried restarting the browser?

[bhouston]

I just got this error a minute ago:

Error: Cannot call method 'getExtension' of null
at initGL (http://.../three.js:24868:34)
at new THREE.WebGLRenderer (http://.../three.js:17693:2)

Restarted Chrome (Version 24.0.1312.57 m) and it went away. There was no update of Chrome pending. Strange but worrisome.

[timseverien]

I'm running OSX 10.8.2. My demo works in Google Chrome (24.0.1312.57) and Firefox (18.0.2), but not in Safari (6.0.2). See the demo here: http://www.timseverien.nl/random/seismomap/

PS. Restarting Safari doesn't work.

[mrdoob]

@timseverien What version of three.js are you using? Does other webgl stuff work on your Safari instalation?

[webdevbyjoss]

Hey, restarting the browser doesn't helps in my case as well.

But after I restarted the whole system - it went through and now works like it was fully working before.
Looks like some kind of glitch within Browser WebGL -> graphics driver chain.

[mrdoob]

[timseverien]

@mrdoob after rechecking at http://get.webgl.org/ it does seem like a Safari bug. Why implement a feature that doesn't work? Oh well, I am running r55 if it still matters. Thanks anyway!

[webdevbyjoss]

looks like Chrome bug as well, was able to reproduce it again today.
Checked on http://get.webgl.org/ and it fails. Damn...

[timbergus]

Hi! First time around WebGL and Three.js and I think it's fantastic, but when writing the example from the beginning of the page it only works in Chrome when using renderer = new THREE.CanvasRenderer();. If I use renderer = new THREE.WebGLRenderer(); it only works in Firefox. I have done the test in last versions of both explorers on Ubuntu. Maybe it's just a problem with my graphic card, but I tell here just in case.

[cipri-tom]

I found a fix for Chrome and Chromium.
Enter in the location bar chrome://flags and enable Override software rendering list. Then restart the browser. WebGL now should work.

[timbergus]

It's working!! Finally. Thank you very much, because it was really frustrating not being able to work on Ubuntu using Chrome :)

But I think you have to active too GPU compositing on all pages because in other case some pages don't render properly; at least in my case.

[cipri-tom]

yes, maybe that also helps. I have enabled almost everything that I could find related to GPU rendering haha.

[ghost]

I get the same error as #404 (comment)

update: For me, it works now in Chrome. (Feb. 2014)

[AlexTiTanium]

Still reproduced

[mrdoob]

@AlexTiTanium Care to share some details?

[jopango]

I just had the same problem for an app i was working on a few weeks/months ago, which was working, and today i got the same message as #404 (comment)

I tried setting (among others) "GPU compositing on all pages" to activated, in Chrome flags, now it works again.

[nkov]

I have a MacBook running 10.6.8 and Chrome 33.0.1750.152 and am getting this same error. Firefox 28.0 reports a similar error: "Error: WebGL: Can't get a usable WebGL context. TypeError: _gl is null. Error creating WebGL context."

As an interesting point, I have another MacBook (this time Pro), running the same versions of OSX and Chrome, and it works fine there ("Override software rendering", and "gpu compositing" are enabled on both).

[mrdoob]

@zeepeeare I think you need to update to a newer version of OSX on that machine. It's all about browsers black-listing some configurations due to outdated graphic drivers.

[prabhat1992]

All right! here is the thing. Chrome by default doesn't enable hardware acceleration on Mac device. You need to go to chrome setting and enable it. check out chrome://gpu/ for reference as well.

[DoisKoh]

"I found a fix for Chrome and Chromium.
Enter in the location bar chrome://flags and enable Override software rendering list. Then restart the browser. WebGL now should work." - cipri-tom

That worked for me, thanks.

Chrome, Ubuntu 15.04

[aryeharmon]

Ubuntu 16.04

this happened suddenly for me after installing java and android sdk, i don't think it's connected but who knows...

@DoisKoh answer fixed it but made my application much slower then it was.