1

私はコーディングとJavascriptに不慣れで、少し迷っています。更新時にアニメーション化する複数の行を作成しようとしています。このようなもの...

http://jsfiddle.net/79zcp/6/

        if (min < max) {
    context.beginPath();
    if (direction) {
        context.moveTo(topMinX, topMinY);
        topMinX = topMinX + 2;
        context.lineTo(topMinX, topMaxY);
    } else {
        context.moveTo(topMinX, topMinY);
        topMinY = topMinY + 2;
        context.lineTo(topMaxX, topMinY);
    }
    context.lineWidth = 4;
    context.stroke();
}

}

ただし、複数の線がy軸を下っており、約20ピクセル離れています。

私の先生は配列で複数の行を作ることを提案しましたが、私は完全に迷子になっています。

4

1 に答える 1

0

新しいフィドルを作成するためにフィドルをフォークしました：http：//jsfiddle.net/UcrUj/3。
垂直線に対してのみ機能するように関数を変更したことに注意してください（direction変数は廃止されました）。

x座標として配列を使用する必要があります。ここで、配列は

linesX = [20, 40, 60, 80]

これは、x座標x = 20、x = 40、x = 60、およびx = 80に4本の線を指定します。ここで、for各x座標を通過するループを実行し、各線を個別に描画します。最後に、増分が最後に追加されます。topMinY += 2これは、明確にするためにの省略形ですtopMinY = topMinY + 2。

于 2013-03-04T02:01:28.593 に答える