benoit Posted December 2, 2021 Share Posted December 2, 2021 Hi, SVG/GSAP question Why the end of the d value is like this ? The "C curveTo " have 18 arguments for 6 (C x1 y1, x2 y2, x y) ? Anyway to "normalize" this? See the Pen YzrXGpL?editors=1111 by benoitwimart (@benoitwimart) on CodePen Link to comment Share on other sites More sharing options...
Cassie Posted December 2, 2021 Share Posted December 2, 2021 Hi Benoit, apologies if I'm misunderstanding. But I think you're asking why there aren't any more commands after the C when there are more than 6 arguaments? If so - The command letter can be eliminated on subsequent commands if the same command is used multiple times in a row, so you actually have three 'C - curveTo' commands, each with 6 arguments. 3 Link to comment Share on other sites More sharing options...
benoit Posted December 2, 2021 Author Share Posted December 2, 2021 Thank you @Cassie (I looked at your site last night and now you are answering my question ) I work with SVG and opentypeJS, so I need to format my path. So I will make a split regex replace swip wizzz function to deal with this. 2 Link to comment Share on other sites More sharing options...
Cassie Posted December 2, 2021 Share Posted December 2, 2021 What a coincidence ✨ Good luck down the regex mines! Link to comment Share on other sites More sharing options...
benoit Posted December 2, 2021 Author Share Posted December 2, 2021 function isNum(n) { return !isNaN(parseFloat(n)) && !isNaN(n - 0) } let d= "M23,80.5 C48,64.83333 73,49.16667 98,33.5 80.16667,28.5 62.33333,23.5 44.5,18.5 53.16667,49.16667 61.83333,79.83333 70.5,110.5 "; d = d.trim().replaceAll(/([A-Z])+/ig, "$1 "); d = d.replaceAll(/,/ig, " "); d = d.split(' ') let format = {"C":7,"M":3,"L":3,"V":2,"H":2,"Q":5,"Z":0}; d.forEach((e,i) => { if(!isNum(e)){ if(isNum(d[i+format[e]])) d.splice(i+format[e], 0, e); } }); Pretty Ugly 2 Link to comment Share on other sites More sharing options...
Cassie Posted December 2, 2021 Share Posted December 2, 2021 Nicely done! 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