I am building a Digital Twin for a office building ( 3D model of building where we can show all the building details )
The features which we need are like - Showing Lighting of the room according to occupancy ( Refer to blue light in the image ), Heat map in the model as shown in the Video . and some user location in form of a person image moving around.
Our main requirement was also to draw some zone on the 3d model from browser only . For example there is some room in building, So a User can mark the room in 3D model and I can store the dimension of that in my DB.
Sorry for going into too much detail.
My team was confused whether we can do this in Threejs. We are new at ThreeJS tech, I wanted to know the possibility of drawing rooms( Zones) in runtime environment and showing heatmap and some Air physics like air flowing from Point A to B ( I guess that is a animation thing and we can handle that on blender ) but the point is nothing of above features can be hardcoded in model as it will get changed according to data we get from that particular building sensors. Like the color and location of light as shown in heatmap video will be changed according to sensor data
I have seen some videos of Unity that people are doing this but haven’t stumbled with Threejs. Also We have some basic digital twin models in Threejs so our priority is this tech and It would be great if we can take this tech to mark down all our requirements.
Can anyone help me with my questions. That will be highly appreciated . Thanks in advance.
Hey @makc3d , Thanks for replying. We don’t have any person in team who knows Unity. Assets in our team only knows Threejs that too basic. So do you mean in this situation, We should go with Threejs. Is that right?
If so can you suggest us something that from where our team can start learning all this stuff. Thanks.
I think what you’re looking for is a way to render volumes based on the rooms, and change the specific colors based on occupancy. That’s definitely doable, but as has been pointed out, would likely require some custom shader work.
One way to approach it could be to have a texture that uses the red channel to encode the different rooms (easy enough as long as you don’t have more than 255 rooms in a single floor). You could use the green channel of the same texture to encode the occupancy. That texture could be really small, and could be re-generated at some regular cadence. As long as you have some API or similar to get the occupancy data, it shouldn’t be too hard.
But you might not even need full volume rendering- you could maybe get by with just stacking some semitransparent planes on top of each other (again, with some custom shader work, but likely simpler).
Hope that gives you something to go on- good luck!
Thanks, @aherbez for the advice. Helps me a lot to get forward with my requirement.
I also wanted to show my 3-D building model in Maps so that I can mark rooms and get Lat and Long for that point. Can you suggest me some way to do this. Do you have any experience with google maps API to integrate 3-D model in Map . WebGL Overlay (ThreeJS wrapper) Â |Â Maps JavaScript API Â |Â Google Developers
It would be very helpful if you can share some of your findings in this case.
