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 に答える