0

I'm building a grphical editor that allows moving objects, resizing etc.

In the picture you can see the upper rectangle. When I move the anchors it resizes just fine. However, when it has a rotation like in the lower image (ie. transform: rotate(20deg)) and I move the anchors, the rectangele starts floating in different directions depending on the rotation. I'm guessing it's because the the x and y axis get rotated as well. I'm looking to do some sort of calculation to keep the rectangle in place just as if it weren't rotated. transform-origin doesn't cut it as it has other transforms applied to it.

Could anyone help me find what x and y offset I have to apply to the position when it gets resized. Thank you very much!

enter image description here

elmgo
  • 21
  • 3
  • Can you provide an image of what happens when you scale after rotating, and an image of what you would expect to get. Also, please define "starts floating in different direction", I have difficulty figuring what is happening to the shape. – Gilles-Philippe Paillé Feb 05 '20 at 13:32
  • no source no sample example we can only guess ... this look related to yours https://stackoverflow.com/q/60058988/2521214 at least show how are your objects represented and how are you transforming ... As I wrote in the other question of yours uniform transform matrices are best for this where each object has its own matrix ... and view is seprate single matrix ... with such representation is easy to do both local and global transformations , extract actual position and orientation etc ... – Spektre Feb 05 '20 at 13:58
  • Sorry, I figured it out. I had to rotate the top left coordinate, the offset the x and y by the difference of the rotated coordinate and the original one. – elmgo Feb 06 '20 at 15:16

0 Answers0