CODEWITHSUNDEEP
javascriptgoogle-chromewebglthree.js
lost_guadelenn
lost_guadelenn

Reputation: 447

Webgl shader compilation errors in google chrome

I'm learning three.js using this tutorial: http://demo.bkcore.com/threejs/webgl_tron_glow_seq.html. The tutorial itself works fine, but my own code, based on it fails with errors like:

ERROR: 0:26: 'nuniform' : syntax error  Three.js:325
precision highp float;
#define MAX_DIR_LIGHTS 0
...
uniform vec3 cameraPosition;
uniform sampler2D tDiffuse;nuniform sampler2D tGlow;nvarying vec2 vUv;nvoid main() {nvec4 texel = texture2D( tDiffuse, vUv );nvec4 glow = texture2D( tGlow, vUv );ngl_FragColor = texel + vec4(0.5, 0.75, 1.0, 1.0) * glow * 2.0;n} 


ERROR: 0:62: 'nvoid' : syntax error  Three.js:325
precision highp float;
#define VERTEX_TEXTURES
...
varying vec2 vUv;nvoid main() {nvUv = vec2( uv.x, 1.0 - uv.y );ngl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );n}

etc.

It looks like browser (google chrome) doesn't parse properly strings with shaders encoded in them. Errors appear in the code from three.js sources (minified version).

At a glance, the code is ok.

I'm just missing something, but I have no idea what exactly.

Any help?

Upvotes: 0

Views: 2455

Answers (2)

user128511
user128511

Reputation:

What you posted definitely looks wrong.

The 5th line has 'nuniform' which is not valid GLSL.

It looks like whatever minifier you used has a bug. If your shaders are in <script> tags you probably need to fix the minifier to only minify scripts that have no 'type' or have type="javascript" or type="text/javascript" because anything else is not JavaScript and should not be minified.

Upvotes: 0

Goz
Goz

Reputation: 62323

It looks to me like there are "\n"s in there causing problems. It looks like the \ is removed but the n is left in.

Upvotes: 2

Related Questions