Hello amazing minds of stackoverflow. I am in the process of converting three js mesh positions to html5 canvas positions. While I have successfully converted vector3 position to canvas position, I am facing difficulties with converting mesh rotation to canvas rotation.
https://i.sstatic.net/LjDVR.png
This is what I have tried:
ctx.rotate(rotation._y);
ctx.rect( 0, 0, width,height);
Unfortunately, it did not work. What is the correct way to achieve this?
Thank you
UPDATE:
I believe that the rotation for the mesh object starts at the center point. Therefore, I modified my approach by first translating to the center point and then performing a rotate operation, which has been successful.
this.context.translate( cx, cy );
this.context.rotate(item.rotation._y);