0

とりあえずこれ持ってる

var x = 150;
var o = 100;
var canvas = $('#NodeList').get(0);
var ctx = canvas.getContext('2d');

ctx.strokeStyle = "red";
canvas.height = 0;

var rects = [
    [20, 20, x, o],
    [20, 130, x, o],
    [20, 240, x, o],
    [20, 350, x, o],
    [20, 460, x, o],
    [20, 570, x, o],
    [20, 680, x, o],
    [20, 790, x, o],
    [20, 900, x, o]
];

ご覧のとおり、すべての長方形を手動で追加しました。

jQuery 関数を使用して追加された各四角形によって、自動的に 70 ピクセルを追加したいと考えていますdrawRect()。

これまでにこれを試しましたJcanvas

この理由は、この「キャンバス」の四角形をクリックして、他のキャンバスにデータをロードしたいからです。drawRect()以下のように手動で入力する代わりに、JQueryを使用する方が簡単だと思います。長方形にはIDがないため。

私は立ち往生しています。私のために物事を明確にしてもらえますか?

4

1 に答える 1

0

あなたのコメントから理解したように、次のようなものが必要です。

// Using Canvas API
ctx.fillStyle = '#000000';

rects.forEach(function (rect) {
    ctx.fillRect.apply(ctx, rect);
});

// Using Jcanvas
var canvas = $('#NodeList');

rects.forEach(function (rect) {
    canvas.drawRect({
        fillStyle: '#000000',
        x: rect[0],
        y: rect[1],
        width: rect[2],
        height: rect[3]
    });
});
于 2015-05-18T13:49:28.853 に答える