Jump to content

Fog Density


Recommended Posts

Hello everyone,  

I was wondering is there a way I could use scene.fogStart and scene.fogEnd, but with the scene.fogMode = BABYLON.Scene.FOGMODE_EXP,  or EXP2, where fogStart and fogEnd just changed where the fog starts to show, that way there is not hard maths involved(just a simple if(fogPos>fogstart){fog.alpha = alpha}else{fog.alpha = 0}. something like this).  Im not sure how to go about this because from what I understand fog is a function in the BABYLON.Scene, which I dont think I should edit, and dont know how I could edit and still keep it in my game. 

So what I would like to know is, can it be done, changing the fog to the above ideas, and if it can be done how should I go about it, is changing how scenes work really the only way, would it even be as difficult as I think?

Link to comment
Share on other sites

to add on this, my understanding of fog in BABYLONjs, 

I am under the impression that with fog linear, the fog starts from the camera position plus the fogStart, in a sphere around the entire camera, then another sphere that is fogEnd, which is where the fog stops.  Inbetween the two spheres is fog that gets thicker the farther away it is from fogStart sphere.

I would like this similarly with fog density but I would like to be able to start it offset from the camera so that the player can see better.

Link to comment
Share on other sites

2 minutes ago, Deltakosh said:

It will change it permanently (I mean for the page lifetime)

hmm just to make sure I understand, 

if I put this in my code:

BABYLON.Effect.IncludesShadersStore["fogFragmentDeclaration"]='#ifdef FOG

#define FOGMODE_NONE    0.
#define FOGMODE_EXP     1.
#define FOGMODE_EXP2    2.
#define FOGMODE_LINEAR  3.
#define E 2.71828

uniform vec4 vFogInfos;
uniform vec3 vFogColor;
varying vec3 vFogDistance;

float CalcFogFactor()

	return 0;

then it will over ride it, if I load my page,  I will look like the shader above describes.  

But if I take that declaration out of the code,  then reload the page it will be back to normal as if I changed nothing?

Link to comment
Share on other sites

Hey @Deltakosh, I just started trying to edit the fog, I thought it would be the same as making a shader for shaderStore, but I can't seem to even figure out how to declare it... 

Here is what I tried:


but that didn't seem to work at all, the console doesn't say anything.

How should I go about starting the declaration?

Link to comment
Share on other sites

  • 1 month later...
On 8/29/2018 at 12:44 PM, Deltakosh said:

Sure, just write the new code to BABYLON.Effect.IncludesShadersStore["fogFragmentDeclaration"]

Hey, im trying to clean up my code, and put shaders in files, and then organize then into a shaders folder.  I tried putting this. fogdeclaration into a .fx file just like the rest of my shaders.  However it doesn't get instantiated like the other shaders i believe, so it doesn't directly call this shader file.  Any ideas about how i could keep this shader in its own file, without over writing the original shader permanently.  Just calling this one...


Link to comment
Share on other sites

You cannot have your file in a separate folder unfortunately. But you can trick it to make it work: Just add some code that will first do an xhr to read all your files and store the results in the Effect store.

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