Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

某些path之间过渡的不是很好 #6

Open
Rowandjj opened this issue Jul 19, 2018 · 8 comments
Open

某些path之间过渡的不是很好 #6

Rowandjj opened this issue Jul 19, 2018 · 8 comments

Comments

@Rowandjj
Copy link

Rowandjj commented Jul 19, 2018

像下面这两个形状之间的过渡效果很"奇怪"。这块能否优化下?我调研了下flubber似乎是专门做过优化的

morph_passion

@dntzhang
Copy link
Owner

但是 flubber 不支持 stroke 模式

@Rowandjj
Copy link
Author

@dntzhang 其实是支持的,我刚看了下。。。

@dntzhang
Copy link
Owner

是吗?那就说明它的算法更优 = =!

@dntzhang
Copy link
Owner

这里其实是有很大优化空间,而且后续想把颜色 lerp 也加上~~

@dntzhang
Copy link
Owner

path + color 同时运动

@Rowandjj
Copy link
Author

很多svg属性都可以lerp。比如transform、width、height等

@akira-cn
Copy link
Contributor

flubber优化算法的确更好一些,但也复杂得多。我当年在MSRA实习的时候就是研究这个,当时较好的做法其实是做多边形的相容三角剖分然后morphing,毕设就做的这个,这个项目里面有些当年研究过的paper。

这个项目虽然有些情况过渡不是很好,不过代码小,实现简单,我用在spritejs里了:https://github.com/spritejs/sprite-core/blob/master/src/helpers/path/index.js

还是要感谢作者 @dntzhang

如果要进一步优化的话可以看一下后续打算怎么做,有时间我可以帮忙一起弄。

@dntzhang
Copy link
Owner

赞啊! 很棒~ @akira-cn

主要是会有很多条件分支需要独立优化。目前使用的是无脑对齐shape和curves数量并旋转判定最短距离然后计算插值。

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants