Jump to content

Need help using a shader in babylon


Recommended Posts

I am not very familiar with GLSL. I am trying to integrate an Ambient Occlusion Shader with Babylon using ShaderMaterial. The shader source can be found at: https://github.com/mikolalysenko/ao-shader

Vertex Shader: https://github.com/mikolalysenko/ao-shader/blob/master/lib/ao.vsh
Fragment shader: https://github.com/mikolalysenko/ao-shader/blob/master/lib/ao.fsh

I've setup the shader in CYOS at: 

CYOS is throwing some errors:

[.Offscreen-For-WebGL-0x7f9aaa872c00]PERFORMANCE WARNING: Attribute 0 is disabled. This has significant performance penalty
[.Offscreen-For-WebGL-0x7f9aaa872c00]RENDER WARNING: there is no texture bound to the unit 0


When using the shader with `shaderMaterial` like:

var aoShader = new BABYLON.ShaderMaterial("AO", scene, {
  vertexElement: "vertexShaderCode",
  fragmentElement: "fragmentShaderCode"
  attributes: ["attrib0", "attrib1"],
  uniforms: ["projection", "view", "model", "tileCount", "tileSize", "tileMap"]
aoShader.setFloat('tileSize', 0.16);


This produces an error:

`babylon.js:4 WebGL: INVALID_OPERATION: drawElements: no buffer is bound to enabled attribute`


I believe the Shader is dependent on some external mesh data. I'm not sure how to pass it. 

Link to comment
Share on other sites

@Nabroski  Thanks very much for taking a look. I really aappreciate the help.

I'm looking at this particular shader because I am using a complementary voxel mesher see: https://github.com/mikolalysenko/ao-mesher

I haven't put together a playground because I'm working with a lot of binary data that's not easily copy/pasted to the playground.

I have open sourced what I have so far at https://github.com/kevzettler/robotbones

You can see the main entry point at: https://github.com/kevzettler/robotbones/blob/master/src/client.js

The code can be viewed live at https://kevzettler.com/robotbones

This shader and mesher have been used with THREE.js successfully. You can see that here https://github.com/shama/ndthree
I am basically trying to recreate that setup with Babylonjs

High level goals here are to take raw voxel data and convert it to babylonjs meshes that I can then attach to an animated skeleton. So far the mesher is working great and I can attach to a skeleton. I would be open to another shader solution.

Link to comment
Share on other sites


Okay we almost their. The Error Msg occurs due babylonjs runing in CYOS and PG has predef. declarations you have to use like uniform textureSampler and not TexCord etc. 


I will work on in from time to time, feel free to contribute. I think about to put the hole thing in a PostProcess. Also feed it with Phong -Shader http://www.babylonjs.com/cyos/#1HF00B


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...