Community
Forma Developer Forum
Welcome to Autodesk Forma Developer Forum. Share your knowledge, ask questions, and explore popular Forma API topics.
cancel
Showing results for 
Show  only  | Search instead for 
Did you mean: 

How do I create the rotating effect similar to Labels?

3 REPLIES 3
SOLVED
Reply
Message 1 of 4
iklimis
219 Views, 3 Replies

How do I create the rotating effect similar to Labels?

rotating-effect-demo.gif

Hi Forma Team!, 

I was trying out the new Label feature and noticed that the label rotates depending the direction the user is looking at it. This is an excellent feature that enhances the overall usability and wondered myself how to achieve this effect quite a few times.

Could you share some tips on how to achieve this effect or is there any chance you could expose such setting in the elements properties maybe.

Thank a lot for your help and insights
Giannis


 
 



Tags (2)
Labels (1)
3 REPLIES 3
Message 2 of 4
kasper.herlov
in reply to: iklimis

Hi Giannis, glad you like it. In terms of how to achieve the effect, do you mean it terms of how we built it or? 
Happy to help, just not sure how to help exactly 🙂 

Message 3 of 4
iklimis
in reply to: iklimis

Hey @kasper.herlov,

Mainly how would I achieve this effect on our side. Meaning using the existing Forma Sdk and tools in our disposal if it is possible to create this effect?

And if it is not would you think of exposing this effect as an setting of a rendered 3D object?
For example: if I render in the canvas a Glb would a setting called "autoRotate" be possible?



Regards
Giannis

Message 4 of 4

Hello Giannis 👋

Thank you for the great feedback!  Unfortunately I don't think this particular technique can be applied to a generic 3d object/GLB as the Labels are rendered using HTML/CSS and repositioned continuously. The code that renders labels is contained within our webapp at the moment, and we feel that it's not mature enough to be exposed. 

However, it's really interesting feedback to get, it's very much appreciated. I can see how your suggestions could be useful!


---

In short this is how Labels technically are implemented:
  • 'Labels' are rendered in 2D with HTML/CSS, and not as an object in the 3d scene. That’s why they will always feel like they “face the camera”
  • They have attached a [x, y, z] position (transform) to where it was placed.
  • When moving the camera around, the position of the label are updated continuously, by translating the 3d position to 2d coordinates.
  • Then CSS is applied to move the HTML element with translate3d
Kristoffer
Sr. Software Engineer

Can't find what you're looking for? Ask the community or share your knowledge.

Post to forums  

Technology Administrators