How exactly does morphing works?
hristov296 opened this issue · comments
I can't for the life of me understand the morph and the morphPrecision and morhpIndex attributes. I have a shape with starting and ending path. I would really like to have it travel the least distance possible. The right part of the shape is basically the same in both cases. Can I make it so that only the left part sort of expands until it reaches the final path? Without any rotations, as it is now. I made both paths with the same number of points. Any help would be much appreciated
You can configure your morph animations here.
I recommend that you check the documentation but be aware that soon, the demo and the entire KUTE.js code base will be updated to ES6/ES7.
I think I will update that codepen guide with something better, some time soon.
The demo page explains how the library works, but perhaps the shapes you're morphing are too large, looking at the viewBox="0 0 1920 937", but the shapes are actually very simple.
I believe you can try and use svgpath to scale down your shapes, might improve the visual experience of your specific animation.