我正在尝试使线指向圆的中心 - 或圆形 - 并且在下面的代码中它们显然不是。他们在适当的位置初始化，但他们在错误的地方结束。应该相当容易，但我无法破解它。我如何实现这一目标？在paperjs中的圆段上绘制线
var path = new Path.RegularPolygon({
center: [100, 100],
radius: 50,
sides: 10
});
path.style = {
fillColor: 'red',
strokeColor: null
}
path.selected = true;
for(var i = 0; i < path.segments.length; i++){
spike = new Path();
spike.add(new Point(path.segments[i].point.x, path.segments[i].point.y));
spike.add(new Point(path.segments[i].point.x + 10, path.segments[i].point.y + 10));
spike.strokeColor = 'black';
spike.strokeWidth = 2.5;
}
这是什么出来的吧：
2 回答
设置另一条路径，如同半径为40（50 - 10 = 40）的相同形状的路径。由于您希望10的尖峰）为每个点绘制从路径到路径1的尖峰
最终的代码如下
var path = new Path.RegularPolygon({
center: [100, 100],
radius: 50,
sides: 10
});
path.style = {
fillColor: 'red',
strokeColor: null
}
path.selected = true;
/* Add path1 */
var path1 = new Path.RegularPolygon({
center: [100, 100],
radius: 40, // 50 -10 =40
sides: 10
});
path1.style = {
strokeColor: 'red'
}
for(var i = 0; i < path.segments.length; i++){
spike = new Path();
spike.add(new Point(path.segments[i].point.x, path.segments[i].point.y));
/* end point is on path1 */
spike.add(new Point(path1.segments[i].point.x , path1.segments[i].point.y));
spike.strokeColor = 'black';
spike.strokeWidth = 2.5;
}
不知道任何paper.js，但就数学去，这里是一个尝试：
var ctr = {x: 100.0, y: 100.0};
var rad = 50.0;
var spikeLen = 10;
for(var i = 0; i < path.segments.length; i++){
spike = new Path();
var p = {
x: path.segments[i].point.x,
y: path.segments[i].point.y
};
spike.add(new Point(p.x, p.y));
spike.add(new Point(p.x - spikeLen*(ctr.x-p.x)/rad, p.y - spikeLen*(ctr.y-p.y)/rad);
spike.strokeColor = 'black';
spike.strokeWidth = 2.5;
}
