Javascript 在PaperJS中,是否可以显式设置直线路径的长度?

Javascript 在PaperJS中,是否可以显式设置直线路径的长度?,javascript,canvas,vector-graphics,paperjs,Javascript,Canvas,Vector Graphics,Paperjs,从我所看到的看来,改变一条路径长度的唯一方法是Path.scale(x)it。但是,我想让线的长度围绕其原始长度稍微振荡,这很难用缩放,因为如果你给它输入随机值,它的长度实际上会进行随机游走,最终可能会远离其原始长度 是否可以显式设置行路径的长度,例如path.length=10?根据文件,这似乎是不可能的。为什么不呢?实现我期望的结果的最佳方法是什么?你可以通过注意paperjs中的路径不是几何形状来做到这一点,尽管它们可能被指定为一个几何形状。它们是线段点的数组;这就是为什么不可能直接设置线

从我所看到的看来,改变一条路径长度的唯一方法是
Path.scale(x)
it。但是,我想让线的长度围绕其原始长度稍微振荡,这很难用
缩放
,因为如果你给它输入随机值,它的长度实际上会进行随机游走,最终可能会远离其原始长度


是否可以显式设置行路径的长度,例如
path.length=10
?根据文件,这似乎是不可能的。为什么不呢?实现我期望的结果的最佳方法是什么?

你可以通过注意paperjs中的路径不是几何形状来做到这一点,尽管它们可能被指定为一个几何形状。它们是线段点的数组;这就是为什么不可能直接设置线的长度。直线有两个线段点-一个用于直线的起点,一个用于直线的终点。通过操纵第二个线段点,可以调整直线的长度。这(以下代码)说明了如何执行此操作。要调整原始行的长度,请取消注释最后一行代码

line = new Path.Line([100,100], [200, 300]);
line.strokeColor = 'black';
line.strokeWidth = 5;

// paths in paper are arrays of segments, not instances of
// circle or line or rectangle. so find the vector that
// represents the delta between the first point and the
// second point.
vector = line.segments[0].point - line.segments[1].point;

// adjustment for the line - this would vary in your case
factor = 0.9;

// I'm drawing a new line here to make it easy to see
p0 = line.segments[0].point;
p1 = p0 - vector * factor;

newline = new Path.Line(p0, p1);
newline.strokeColor = 'red';
newline.strokeWidth = 2;

// but to adjust your original line just use the following
//line.segments[1].point = p1;
如果选择,可以将原始向量存储在属性
行.data
中,这是一个空对象,纸张可以根据用户的意愿创建。所以
line.data.vector=vector将允许您保留每条线的原始向量。您可以使用以下命令将线的长度设置为特定长度:

var v = line.data.vector.clone();
v.length = 10;         // specific length
line.segments[1].point = p0 - v;

如果这能回答你的问题,我将不胜感激。如果它不让我知道。谢谢对不起,我从来没有接受这个。我想我一开始对所有的步骤都感到困惑,但当它回答了我的问题时,我接受了它。谢谢