Hello, I am trying to animate a little “online” artifact like a wifi symbol, with the emanations of the signal growing outwards and disappearing. Basically I just want the bands to appear until all three are there, then disappear, and loop the animation.
Here is my code. I figured when I have my business logic, I could be setting state for each ring that mutates a visibility attribute, but I am not sure the best way to do it
Yeahhh so I tried this and it seems to work, but my intuition is that i’m doing something much too complicated and there’s a much simpler solution so I’d be interested in hearing that lol.
Basically I am driving state changes defined by the field stateArray using a sin wave, and when it changes from negative to positive I advance the state
if not, just change the delay for each segment. you don’t need any of the code you have up there. also the materials, just <meshBasicMaterial transparent color="#008000" /> will do.
Your approach is fine, when there are not so many such things in the scene.
I would go with instanced mesh and modified material, drawing those signals in shaders:
btw, if you want to animate like in @prisoner849’s example, just slap a Math.round in front of the formula that calculates opacity and you have it flip between visible/invisible instead of smoothly animating it.