CODEWITHSUNDEEP
javascript3dthree.jswebglshader
jkfuyaflkjd
jkfuyaflkjd

Reputation: 682

Ashima Perlin noise shader not working with recent versions of Three.JS

In a last ditch effort to be able to use the latest Three.JS I'm hoping someone on SO has experienced this problem as Google is giving me nothing.

I am using Ashima Perlin noise shader (see examples) - http://www.clicktorelease.com/blog/experiments-with-perlin-noise

I can get this working perfectly fine, if I use version 48 of Three.JS (latest is 59).

Attempting to use a recent version of this gets me this error: 

ERROR: 0:301: 'objectMatrix' : undeclared identifier 
ERROR: 0:301: 'objectMatrix' :  left of '[' is not of type array, matrix, or vector  
ERROR: 0:301: 'xyz' :  field selection requires structure, vector, or matrix on left hand side 
ERROR: 0:301: 'objectMatrix' :  left of '[' is not of type array, matrix, or vector  
ERROR: 0:301: 'xyz' :  field selection requires structure, vector, or matrix on left hand side 
ERROR: 0:301: 'objectMatrix' :  left of '[' is not of type array, matrix, or vector  
ERROR: 0:301: 'xyz' :  field selection requires structure, vector, or matrix on left hand side 
ERROR: 0:301: 'constructor' : not enough data provided for construction 
 three.min.js:40

This would normally be something I would debug, fix and push to git for others but I don't have the C knowledge or shaders knowledge to debug this.

Upvotes: 2

Views: 869

Answers (1)

jkfuyaflkjd
jkfuyaflkjd

Reputation: 682

Ok, so anyone trying to find why this demo won't work with the latest version of three.js: http://www.clicktorelease.com/code/perlin/chrome.html

It's because of a change in a varname and you simply need to change the vertex shader inside void main().

Change this line:

vec3 nWorld = normalize( mat3( objectMatrix[0].xyz, objectMatrix[1].xyz, objectMatrix[2].xyz ) * modifiedNormal );

to this:

vec3 nWorld = normalize( mat3( modelMatrix[0].xyz, modelMatrix[1].xyz, modelMatrix[2].xyz ) * modifiedNormal );

Thanks to @gaitat for the assist with pointing to the Three.js migration page, very helpful.

Upvotes: 4

Related Questions