Skip to main content
B
bpastucha5-Regular Member
5-Regular Member
May 31, 2018
Question

3D Image with Moving Graphic

  • May 31, 2018
  • 1 reply
  • 1108 views

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

1 reply

J
jmikesell1-Visitor
1-Visitor
May 31, 2018

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.

Terms & ConditionsAccessibility statement