I am new to Paper.js therefore might this a basic question but I am trying to the the following:

var xpos;
var ypos;

function onMouseMove(event) {

   xpos = event.point.x;
   ypos = event.point.y;

}

get the current mouseposition and save it as the variables xpos and ypos

function onFrame(event) {

   path.segments[1].point.x = path.segments[1].point.x+xpos/10;
   path.segments[1].point.y = path.segments[1].point.y+ypos/10;

}

and then use them to update the onFrame animation. But it does not work, how can I update the animation with the new values?

Thanks in advance.

有帮助吗?

解决方案

It looks like your code is increasing the position of path.segments[1] every frame. I believe what you want is to subtract a portion of the difference between the segment and mouse positions per frame.

Try this:

var path = new Path.Line((0,0), view.center);
path.strokeColor = "black";
var pos = new Point(0, 0);
function onMouseMove(event) {
   pos = event.point;
}
function onFrame(event) {
   path.segments[1].point += (pos - path.segments[1].point) / 10;
}
许可以下: CC-BY-SA归因
不隶属于 StackOverflow
scroll top