Fog in JavaScript / WebGL

Home Forums Programming Fog in JavaScript / WebGL

Tagged: 

This topic contains 13 replies, has 3 voices, and was last updated by Yuri Kovelenov Yuri Kovelenov 2 weeks, 6 days ago.

Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • #18822
    GlifTek
    GlifTek
    Newbie

    Hi
    I’ve been using layers of low transparency black color emission material to simulate black fog while experimenting with certain ideas.

    I’d like to implement ACTUAL simulated fog now though.

    I’ve read the manual instructions on how to implement webgl into our .js files and understood it by experimenting with that.

    I’ve looked at the manual page on FOG but don’t quite understand as there’s not an example given (excuse my n00bness).

    I’ve looked around the web, but most of the material i find isn’t quite reproducible, as it’s not in the context of the Verge3D configuration of things.

    Does anyone know of a quick snippet that’s compatible with the Verge3D ‘arrangement of things’ that I could place into my .js file to simulate simple black fog?

    thanks.

    #18842
    Yuri Kovelenov
    Yuri Kovelenov
    Developer
    #18890
    GlifTek
    GlifTek
    Newbie

    yeah that’s the first one i looked at.
    all i saw was a tanish-pink screen and nothing changed.
    but now the fog CLEARS and i see mountains.. ahhhhahah.
    thanks!
    I’ll see what i can do with this.

    #18902
    Yuri Kovelenov
    Yuri Kovelenov
    Developer

    :good:

    3D Verger, the CEO
    LinkedIn | FB | Twitter | VK | 新浪微博

    #19277
    GlifTek
    GlifTek
    Newbie

    so…
    still struggling with implementing this in the .js file.
    in the source for that example at github here
    there’s all the terrain and mouse interaction code in the script within the html…
    but if i JUST want the code, it should be a very simple line like the one i find there..
    scene.fog = new v3d.FogExp2(0xefd1b5, 0.0025);
    i’ve put that, like i do other external js call code after the “hello there” part of our .js file.
    and i call js function “fog” and to no avail.. :unsure:

    i also deleted “scene” and had it just “fog” and newp.

    also tried doing something like..
    app.ExternalInterface.fog = new v3d.Fog(black, 0.0025, 5);

    and

    app.ExternalInterface.fog = new THREE.Fog(0x000000, 0.0025, 5);
    which i found on other samples

    but no.
    I used to use javascript alot long ago.. and am probably in need of a refresher course, but i am stumped at this, as it seems so simple.

    thanks

    • This reply was modified 3 weeks, 5 days ago by GlifTek GlifTek.
    #19309
    Yuri Kovelenov
    Yuri Kovelenov
    Developer

    Hi,

    Try making it

    app.scene.fog = new v3d.FogExp2(0xefd1b5, 0.0025);

    place this line inside the runCode() function in your app js file.

    3D Verger, the CEO
    LinkedIn | FB | Twitter | VK | 新浪微博

    #19350
    GlifTek
    GlifTek
    Newbie

    Hi,
    Try making it
    app.scene.fog = new v3d.FogExp2(0xefd1b5, 0.0025);
    place this line inside the runCode() function in your app js file.

    hmm..
    not working..
    tried it in a diff app also. (also updated my v3d.js and ammo.js in both)
    i also tried it in firefox and chrome.
    here’s the whole code i have in my runcode area..

    what should be called in the JScall function puzzle field? just “fog” ? or should i not use one? ( i also tried “app.scene.fog” and “scene.fog” and “FogExp2” and “v3d.Fogexp2” in the Js Call function puzzle.

    Do we have to identify it as a function somehow?

    • This reply was modified 3 weeks, 3 days ago by GlifTek GlifTek.
    • This reply was modified 3 weeks, 3 days ago by GlifTek GlifTek.
    #19353
    GlifTek
    GlifTek
    Newbie

    i also tried to set it up like the removeObject function with variables for the parameters…

    with these puzzles –
    fog puzzles

    • This reply was modified 3 weeks, 3 days ago by GlifTek GlifTek.
    • This reply was modified 3 weeks, 3 days ago by GlifTek GlifTek.
    Attachments:
    You must be logged in to view attached files.
    #19357
    GlifTek
    GlifTek
    Newbie

    also i tried this with the puzzles

    • This reply was modified 3 weeks, 3 days ago by GlifTek GlifTek.
    #19400
    GlifTek
    GlifTek
    Newbie

    using this now.

    2 with variables in them.
    2 that need them named.

    with the puzzles..
    puzzles

    you just click on one of 4 cubes to trigger their JS calls.

    pretty sure that should all work right?

    • This reply was modified 3 weeks, 3 days ago by GlifTek GlifTek.
    • This reply was modified 3 weeks, 3 days ago by GlifTek GlifTek.
    Attachments:
    You must be logged in to view attached files.
    #19404

    Hi,

    we’ve just supported fog in all Verge3D materials. Check out the upcoming release!

    Co-founder and CTO at Soft8Soft
    FB | Twitter | VK

    #19410
    GlifTek
    GlifTek
    Newbie

    Hi,
    we’ve just supported fog in all Verge3D materials. Check out the upcoming release!

    in the new Verge3D 2.15 pre3?

    #19413
    Yuri Kovelenov
    Yuri Kovelenov
    Developer

    nope, it missed pre3, but will be available with the stable build in a few days!

    3D Verger, the CEO
    LinkedIn | FB | Twitter | VK | 新浪微博

    #19652
    Yuri Kovelenov
    Yuri Kovelenov
    Developer

    Hi,

    Fog should work in v.2.15. Check it out!

    3D Verger, the CEO
    LinkedIn | FB | Twitter | VK | 新浪微博

Viewing 14 posts - 1 through 14 (of 14 total)

You must be logged in to reply to this topic.