Svg path manipulation

ساخت وبلاگ
Hi folks

There are many good JS libs out there to handle SVG. But they are all bloated. All i need a simple functions. Maybe someone of you have links to something useful.

I have a SVG path string.

E.g. "M797 884c-86,-67 -662,-473 -774,-335 -77,95 65,226 123,256 53,28 161,47 190,112 31,69 256,169 337,132 45,-20 78,-50 118,-75 78,-48 56,-1 45,-36 -3,-12 -37,-47 -39,-54zm172 39c59,159....."

Also i have a function that stored each path segment in an object ARRAY

E.g.
[0]
object.identer='M'
object.choords=[797,884]
[0]
object.identer='c'
object.choords=[-86,-67....]
and so on

SVG is a pretty complex toppic and a don't want to invent the wheel once again, as i know that there are a lot of working functions for my goal.

Goal 1: Convert relative to absolute. (m - M)
Goal 2: Convert absolute to relative. (M - m)
Goal 3: Recalculate choords to new width and height a nd new startx + starty without using transform, scale or similar. (E.g. M100 100L500 100L500 1000L100 1000L100 100z to Startx 200, Starty 300 and width/height 100 = M200 300L300 300L300 400....)
Goal 4: Recalculate choords as described under Goal 3 but with calculated new points by rotation angle (without using rotate())

If it's only M,L,H,V recalculation isn't a problem. But all those cubic, bezier curve stuff...No idea how to calculate it.

Any help is apreciated.
CodingForums...
ما را در سایت CodingForums دنبال می کنید

برچسب : نویسنده : codingforums بازدید : 148 تاريخ : سه شنبه 25 مهر 1396 ساعت: 22:45