3

http://jsfiddle.net/psycketom/TUyJb/3/

最近、パーセンテージに基づいてキャンバスの線の端点を計算するための質問をしました：キャンバス、線分を描画します

今、私は実際の開始点として使用される開始点からの行のXパーセンテージを計算する方法に固執しています。

上記のフィドルでは、エンドポイントをミラーリングしようとしました。

growth = 0.2;

// calculate line endpoint
current.x = start.x + (target.x - start.x) * growth;
current.y = start.y + (target.y - start.y) * growth;

// calculate line startpoint
scurrent.x = start.x + (start.x - target.x) * growth;
scurrent.y = start.y + (start.y - target.y) * growth;

しかし、それは私が望んでいることをしていないようです。

私の本当の目標は、線を引く関数を作成することです。

  • 点xの境界で、点yまで
  • 長さn
  • 位置zから開始します。
4

1 に答える 1

3

エンドポイントとして指定されているのは、実際には「開始点」です。

// calculate line "endpoint"
current.x = start.x + (target.x - start.x) * growth;
current.y = start.y + (target.y - start.y) * growth;

ウェイポイントを返す関数は次のとおりです。

// start and end are points with .x and .y
// q is a number between 0.0 and 1.0
var waypoint = function (start, end, q) {

    return {
        x: start.x + (end.x - start.x) * q,
        y: start.y + (end.y - start.y) * q
    };
}

これで、好きな場所でウェイポイントを計算できます。

var start = {x: 10, y: 20},
    end = {x: 120, y: 70},

    a = waypoint(start, end, 0.2),
    b = waypoint(start, end, 0.8);

ab元の線の両端から20％ポイントになります。

于 2012-10-30T14:14:35.887 に答える