Jump to content

shaderMaterial custom attributes


Recommended Posts

Hi guys,


I have read some tutorials about ShaderMaterial, but I don't see in any of then if it is possible to add custom attributes apart from position, uv and normal.


What I would like is create a list of floats (one for each position) and keep it in the mesh (so far so good).

When creating the ShaderMaterial, I want to add this list as another attribute so I can take the right value for each position when rendering the material and work with it.


Any ideas?





Link to comment
Share on other sites

Hello, this is perfectly feasible using ShaderMaterial constructor:)

var myShaderMaterial = new BABYLON.ShaderMaterial("cloud", scene, {            vertexElement: "vertexShaderCode",            fragmentElement: "fragmentShaderCode",        },        {            needAlphaBlending: true,            attributes: ["position", "uv", "listOfStuff"],            uniforms: ["worldViewProjection"],            samplers: ["textureSampler"]        });

You have then to use mesh.setVerticesData("listOfStuff", data) to fill your data

Link to comment
Share on other sites

Hi Deltakosh, I did exactly was you told me, but when I define and try to use the new attribute "listOfStuff" in the vertex and fragment files I am getting this error:


[.WebGLRenderingContext]GL ERROR :GL_INVALID_OPERATION : glDrawElements: attempt to access out of range vertices in attribute 3 


I have checked the mesh and I can see my new list of floats when doing the getVerticesDataKinds, it is looking good. The way I have defined the attribute in the shader is like this:


attribute float listOfStuff;


It looks like the new attribute is not properly set at the moment the vertex files is executing. I was expecting the same behavior we have with normal, uv and position. Do I have to manually set the attribute values using the "setFloats"? If that is the case, I have to create a new material for each mesh and I was using the same material for several meshes.





Link to comment
Share on other sites

Not sure if this is the right way of sharing this, so let me know about it.


I have the proof of concept ready and failing as expected. I am trying to replicated as much as possible what I am doing, so it should give you an idea.


I have created a dummy html file (it should work just clicking, well, fail as expected):



It also include a simple js file and two images.


Thank you!

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...