martinRenou / threejs-caustics

Caustics computation using ThreeJS

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Increase size of area

eduardfossas opened this issue · comments

Hello Martin!

We have just spoken on Twitter. Right now I have a simple scene in aframe, the problem is that I cannot increase the water area to cover all the plane, I tried different things but without success:
Screenshot 2022-04-13 at 15 14 00

Let me know if you need more information and thanks in advance!

Hey :)

Would you be able to provide a bit of code? At least the part that creates the water mesh

Hey! It is exactly the same as you have, all are 2 by 2 planes, just adapted it a bit to work in an Aframe setup. I guess it could be a hardcoded value inside the shaders since when I modify all the plane geometries from your setup the shaders are stretched.
Screenshot 2022-04-13 at 16 46 11
Screenshot 2022-04-13 at 16 46 16

any luck with increasing plane size?

Sorry I haven't had the time to look into the code again. Though I believe you will need to increase both the water plane size and the orthogonal camera view area (the one that computes the caustics).

Another idea could also be to keep the water plane untouched, and scale down objects that are underwater, this would give the the impression that the water plane is bigger.

No worries @martinRenou.

I understand; for me, the former makes more sense since I think it can be more adjustable in other cases as well.

Thank you for your time.

I managed to increase the area by increasing the water plane size and the lightCamera Frustum size together like martin mentioned!

@eduardfossas @fractalhq can you guys please provide exact changes to be made cause I have been trying the same for couple of days with no success please.

I actually wound up rewriting it in Typescript so I can't answer that unfortunately because a lot changed (and it was a long time ago).

Have you tried scaling down underwater objects instead of increasing the water plane ?

image
@martinRenou have yiu hardcoded any size somewhere?

have yiu hardcoded any size somewhere?

Oh yeah it's very possible that it's hardcoded in a couple of places. Quoting myself from this thread:

Though I believe you will need to increase both the water plane size and the orthogonal camera view area (the one that computes the caustics).

So if I trust my old self you'd have two places to change? It's been a long time that I've looked at this code.

This project is more of a demo than something that was thought for being reusable. So you may need to update it slightly to match your case.

Also note that this code was running with a specific version of ThreeJS, I cannot guarantee it works with latest ThreeJS.

Finally, looking back, I would say ThreeJS is probably not thought for making such low-level usage of WebGL. I remember this code was a bit hacky to make it work. If I were to do this again, I'd probably use plain WebGL or something like https://github.com/regl-project/regl. (Not saying ThreeJS is not good, it's a great library).