Volt 22 Posted June 24, 2023 Share Posted June 24, 2023 Hello, How can I rotate an SVG path in the y-axis only? See the Pen dyQOjmN by Iam_Jesse (@Iam_Jesse) on CodePen Link to comment Share on other sites More sharing options...
akapowl Posted June 24, 2023 Share Posted June 24, 2023 Hello @Volt 22 Unfortunately the short answer is: you can't. While you can apply 3D transforms to an SVG element itself, paths and shapes in SVGs don't support 3D transforms - that is just a limitation of SVG. If you won't have a perspective applied anyway, a scaleX to 0 might have a very similar visual effect, though. Beside that, another thing you could try is morph the SVG path to a shape similar to what it would have if you were to transform it in 3D space. You'll likely want to have a look at the MorphSVGPlugin in that case. 1 Link to comment Share on other sites More sharing options...
Volt 22 Posted June 24, 2023 Author Share Posted June 24, 2023 Hello @akapowl, Thank you for your reply. I did a scaleX instead, the animation is similar to what I want to achieve. 1 Link to comment Share on other sites More sharing options...
Recommended Posts
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 accountSign in
Already have an account? Sign in here.
Sign In Now