I was reading on ThreeJS custom attributes and got confused about how to set them up.
So i've seen that we add an attribute to the geometry attribute list and then the same to the ShaderMaterial attributes list ?
My question is how to add custom attributes in 3js ?
The new version (r67) features RawShaderMaterial which allows full control of attributes/shaders. Here's an example:
http://threejs.org/examples/webgl_buffergeometry_rawshader.html
If you want something less "raw" but still performant, here's an example using BufferGeometry and ShaderMaterial:
http://threejs.org/examples/webgl_buffergeometry_custom_attributes_particles.html
And, if you want to use Geometry here's an example of that too:
http://threejs.org/examples/webgl_custom_attributes.html
Related
I am trying to implement new custom features to the MeshStandardMaterial, in particular I would like to add the possibility to add two normal map that use different UV sets. Then I will combine them inside the fragment shader.
So far I have "doubled" meshstandardmaterial and make WebGLProgram insert keyword like "Use NormalMap2". The next step would be to mess around with actual glsl code.
Is there some way to print fragment shader or some how look what has been passed to it?
The easiest way to debug my code was to use webGL inspector, it shows me what texture has been passed to the shader and also it shows me all shader code
How to get access to custom canvas group shader? I need to desaturate all child of game object situated on canvas. Something like canvas group component that provide possibility to change alpha of all child objets.
Unity might be using a more elegant solution by hiding their implementation of setting the alpha via the CanvasGroup component in their C++ part of the engine.
For now it looks like there is no other way than to set the material property on all UI elements (UnityEngine.UI.Graphic) with a custom material.
Remember, you can download the official shader source files. ;) There's a default UI shader, which you need to modify to add additional color functionality.
I get an error:
THREE.ShaderMaterial: attributes should now be defined in THREE.BufferGeometry
THREE.ShaderMaterial: 'attributes' is not a property of this material.
and i'm trying to figure out what is going on.
I used to make a buffer geometry with some attributes. I never really figured out why this was needed, but i did notice i need to "type" it of sorts, to get three to hook it up with the shader.
{
attributes: {
aSomeAttribute:{
type: 'v3',
value:null
}
}
}
i'm trying to figure out what material.prototype.setValues( parameter ) does. From what i see it takes the parameters passed to the material ({vertexShader:...,uniforms:...}) and goes bonkers when it encounters attributes.
You can now apply custom attributes only on geometries inheriting from THREE.BufferGeometry for example if it's a sphere use THREE.SphereBufferGeometry instead of THREE.SphereGeometry. Then create your array of attributes and add it to the geometry thanks to THREE.BufferGeometry. After that you will be able to use your attribute in your shader. You can find an example here.
What's the best way to extend CanvasRenderer in Three.js for a custom material?
I've got a ShaderMaterial for customized dashed lines in WebGL, but I need CanvasRenderer support as well. I figure I could create a custom material that extends the Material class. But I'm sure I'll have to extend Canvas Renderer in some way. How should I go about that? Copy and paste, creating a new class entirely?
Here is a jsFiddle (http://jsfiddle.net/VyP29/1/) . of what I want to do, but in WebGL. I need the lines to stay a consistent length so it will probably have to be implemented by expanding a single line to multiple lines and gaps (for the CanvasRenderer).
I would like to extend the default lambert material shader of three.js.
I basically would like to add some custom code at the end of the default fragment shader so the last line will apply my color transformations.
It's there any simple way to do that? Or should I rewrite a completely new one adding the default code on it?
I've created a custom ShaderMaterial using the predefined blocks from the default materials.