Finish SVG Matrix Transformation Calculation

$10-30 USD

Completed

Posted

almost 6 years ago

$10-30 USD

Paid on delivery

I need to figure out the calculation to properly translate an internal SVG group element relative to the parent, after the group element has been scaled. The goal is that whenever the 'viewBox' dimensions are changed, the internal group elements are scaled and translated so that they remain in the same relative position that they were in prior. I believe you just need to determine the groups internal SVG position relative to the parent SVG tag before the change, and then do a calculation after the change to determine the correct offset in the translation so that the elements are moved to the same relative position they were in prior to the scale. It needs to work with any viewbox dimensions. The following is a simple Vue component that illustrates what I'm trying to accomplish. In it, you'll see the 'default dimensions' and the 'default matrix' for each group element. The proper scale is calculated whenever the dimensions change, you just need to figure out what the offset translation needs to be to place them in the correct relative position. Essentially just the E and F matrix values for the two groups you see. You're tasked with finishing the 'changeDimensions' function with the above described calculation. [login to view URL],js,output

HTML5

JavaScript

SVG

Project ID: 17037213

About the project

2 proposals

Remote project

Active 6 yrs ago

Looking to make some money?

Email address

Benefits of bidding on Freelancer

Set your budget and timeframe

Get paid for your work

Outline your proposal

It's free to sign up and bid on jobs

Awarded to:

@mitkoradev

$25 USD in 1 day

5.0

(6 reviews)

2.8

2 freelancers are bidding on average $25 USD for this job

@ArielLin822

Hello! Thanks for inviting me to submit a proposal .I have read the job description and got very interested in working on this project as it perfectly fits in my skill stack. Talk about a perfect match! I’ll keep this short and we can go into more details when we chat. As you can see I enjoy working with clients. I took the time to check out your website and you certainly fit the bill. I'm a senior Web & Mobile Program Developer. Freelance web developer specializing in small to medium sized business websites and content management systems. I design and develop responsive websites using the most current technologies to provide the best user experience while satisfying customer needs. My previous employment and management experience provides me with leadership skills that allow me to effectively communicate with others to achieve our goals. In addition, it has provided me the knowledge of understanding and communicating with customers to satisfy their needs. I am a fast learner who enjoys challenges and thrives in a fast paced, goal oriented environment. Currently I have experience working with HTML, CSS, JavaScript, jQuery, Ruby on Rails, PHP, and WordPress. And I'm also very well-versed at object-c, Swift and etc. The best quality, accurate timeline, free and polite after-service are what I guarantee to my clients. I always try to make clients say there’s not a thing that they would change when they see my work. I can start the work right now!! Sincerely. thanks.

$25 USD in 1 day