用Paper.js动画圆上的多边形点
用Paper.js动画圆上的多边形点
提问于 2019-04-21 16:32:47
我需要动画一个点(在Paper.js中称为分段)的多边形，旋转它在一个圆与原点在原来的多边形点。见下图：
我试着用下面的代码来做：
// Draw the polygon
var polygon = new Path.RegularPolygon({
center: [100, 100],
sides: 8,
radius: 80,
});
// Animate
view.onFrame = function (event) {
var offset = new Point(Math.cos(event.time*2), Math.sin(event.time*2));
polygon.firstSegment.point = polygon.firstSegment.point.add(offset);
};但我有两个问题：
- 圆的起源是错误的。
- 经过一些时间的动画，它开始以一些奇怪的，(显然)随机的方式旋转。它似乎改变了圆的起源。
在这里，查看它的全部代码是：
https://codepen.io/anon/pen/xezQpb
有人能帮忙吗？谢谢
回答 1
Stack Overflow用户
回答已采纳
发布于 2019-04-22 08:41:42
问题是，在每一帧中，你指的是第一段的位置，它在前一帧中移动了一点，所以偏移量之和。
相反，只需在开始时记录中心并与其相抵：
var center = polygon.firstSegment.point.clone();
[...]
polygon.firstSegment.point = center.add(offset);页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/55784596
复制相关文章
相似问题
腾讯云开发者
