2

我一直坚持使用 paper.js 仅调整画布中项目的宽度，我已经按照以下方式调整大小，但这会导致从矩形/圆形的中心调整左右两侧的大小。

function onMouseDrag(event){

(selectedItem.bounds.contains(event.point)) ?
selectedItem.scale(0.9871668311944719,1) : selectedItem.scale(1.013, 1);
}

上面的代码在两个 x 方向上调整大小。

帮助我仅在一个方向上调整宽度。

谢谢，

苏里巴布。

4

3 回答 3

1

您可以使用以下表格将缩放操作居中：

scale(hor, ver, point)

因此，在您的情况下，如果您想从所选项目的左中心进行缩放，您可以使用：

function onMouseDrag(event){

(selectedItem.bounds.contains(event.point)) ?
selectedItem.scale(0.9871668311944719, 1, selectedItem.bounds.left) : selectedItem.scale(1.013, 1, selectedItem.bounds.left);
}
于 2013-02-28T07:41:09.280 回答
0

我不确定您仅缩放宽度是什么意思。如果您想拥有比更改更粗的路径，strokeWidth则可能会做您想做的事情。

如果您想知道为什么缩放路径会在 x 轴上的两个方向上扩展，那么您可能会检查路径本地中心的位置。如果路径的某些节点相对于该局部中心具有负坐标，则用正值缩放它们会进一步降低它们的坐标。

也许您应该对所有顶点进行归一化，即直接移动它们，使所有顶点的最小 x 和 y 值为 0。

问候和好运

于 2013-02-28T07:32:35.127 回答
0

尝试这个：

function onMouseDown(e) {
    var cx = e.point.x;
    var cy = e.point.y;
    var rectangle = new Rectangle(e.point, new Size(1,1));
    path = new Path.Ellipse(rectangle);
    path.strokeColor = 'red';       
}

function onMouseDrag(e) {
    path.remove();
    var x = Math.min(e.point.x, cx),
        y = Math.min(e.point.y, cy),
        w = Math.abs(e.point.x -cx),
        h = Math.abs(e.point.y -cy);
    var rectangle = new Rectangle(x,y,w,h);
    path = new Path.Ellipse(rectangle);
    path.strokeColor = 'red'
}
于 2013-09-03T12:39:30.363 回答