Sunlight Analysis in CesiumJS

Hello, I want to share happiness of successfully finding out the way to realize sunlight analysis in CesiumJS, through custom offscreen render, I learned a lot in the process. The result is below:

use different color to show different sunlight coverage in a specific location, that blue is low coverage of sunlight, while red is the opposite, high coverage rate. And the date and time range could be self define. default is in 2023-12-22 from 6:am to 6:pm

show with pionts and polygon geometry, when in polygon geometry, the height could change:

And we also could click one point to get the sunlight coverage percentage value of the specific place in the time range:

It is so interesting to look into the code of CesiumJS.

1 Like

This looks awesome!

Would you be interested in sharing this through our social media?

Sure, cool, what can I do to share this through your social media?

Can you tell me how it was made? I am very curious about this

It is complex, because we need to get the offscreen render texture and compute coordinate of fragment to compare the depth, then get a specific val to flag whethere a specific location place been in the sunlight, finally to accumulate the vals to get the percentage rate.

can you write a Sandcastle example for it?

unfortunately, I can’t provide total code due to the complex of code, I recommend using thought below:

  1. divide the total time range to several timespan
  2. get every timespan’s midtime depth texture
  3. in the fragment, compute the gl_position in each virtual camera, get the depth
  4. in the fragment, compare depth value in 3# and 2#, then you will get if it is in the sunlight in each timespan.
  5. in the fragment, accumulate the compare result in 4#, and set the color of the fragment based on the accumulate result.
1 Like

Thank you very much for your idea. I’ll give it a try. Looking forward to seeing your sharing soon

This is really cool. Would it be convenient for you to establish a repository in GitHub? I believe many people will be involved.

Could you share some code snippets? I’ve been trying to achieve this effect for several days and haven’t found the right way yet.

OK, maybe I should consider to put the organized code on the Git, then reply on this page.