friction2d / friction

Friction Graphics
https://friction.graphics
GNU General Public License v3.0
233 stars 12 forks source link

"paths" animation SVG export #165

Closed adambelis closed 4 months ago

adambelis commented 4 months ago

i did simple animation with path in 0.9.6b . Export to SVG seems to be broken . friction_mLr92QVkZ8

render works fine https://github.com/friction2d/friction/assets/50795097/8e343320-357d-4715-99a2-5e0897c9cfa9

svg animation test export

Frion file animation text.zip

rodlie commented 4 months ago

Seems like the Path object "paths" keyframes are exported incorrectly(?). It's probably something missing/wrong in the XML (looks ok to me, but I'm no SVG spec wizard).

adambelis commented 4 months ago

hmm yes i found an example of working svg it has different formating (maybe both valid ) https://codepen.io/AnnieChn/pen/JEQXyB

adambelis commented 4 months ago

OK chat gpt know what is wrong (actually i am very impressed :D) https://chatgpt.com/share/c7d63c57-8431-4d30-80b8-45711d153ca9

animation test export- caht pgt fix

after chat gpt fixes

rodlie commented 4 months ago

Nice :+1:

Now I need to figure out where this problem happens in the code ..... meeeeh :)

rodlie commented 4 months ago

The real issue was

Each time value in the keyTimes list is specified as a floating point value between 0 and 1 (inclusive)

https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/keyTimes

So, we strip - from any keyTimes (not convert) when exporting and check if parent (path) has d, if not then we add d="M0 0", I'm now able to export a functional SVG from your project file.

adambelis commented 4 months ago

conforming fix