3D Image with Moving Graphic

[bpastucha]

Hello,

I am looking to create a 3D image that showcases the %fill of the water level within a container. We think it would be cool if we could overlay a 3D image that goes up or down based off of the water level %fill. I have attached the graphic that we looking to use to give a bit more context.

Has anyone ever implemented this into an experience? If so, any suggestions would be greatly appreciated!

Thanks,

Brad

[jmikesell]

I have not done this but i think you could do it with CSS sprites. You would make a sprite sheet with your gauge showing fill in like 5% increments. Then you would use JS/CSS to control what image from the sprite sheet you are using in the 3D image based on your data.

I guess you could also skip the sprite sheet and just upload all the images individually and then switch to the image you want based on data. But it would be messier code might not transition between fill levels as smoothly as the sprite method.