Jump to content

Search In
  • More options...
Find results that contain...
Find results in...

Draggable TransformOrigin Isn't working in React

Recommended Posts

I would say that you need to set transformOrigin to center center


transformOrigin: "center center" 


But that doesn't make it work 🙃



Ok, I think this is what you want, it spins from the center of the wrapper. Just take a look to the position relative/absolute I added https://codesandbox.io/s/beautiful-ptolemy-mtmeq?fontsize=14&hidenavigation=1&theme=dark

  • Like 1
Link to comment
Share on other sites

Hi! Thank you! This is sort of a fix for it. I don't understand why it was necessary to wrap the svg with divs and use the styling to position it though. Why can't I just transformOrigin on the group inside the div?

Link to comment
Share on other sites

Here's a codepen example where I got it working by using the id on the svg tag. Why can't I rotate a group within an svg? That is my big question.


Also, when I try to change it to transformOrigin: "bottom right", it doesn't change the location of rotation.

See the Pen LYprPWq?editors=1010 by blumaa (@blumaa) on CodePen

Link to comment
Share on other sites

That was it! And it was such an easy fix. I can't believe it! Thank you.

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.