0

次のようなことをしたい...

// commmands - context commands to build primitives. 
// See comments in loop for example.
function DrawToCanvas(commands, height, width){

    var canvas = document.createElement("canvas");
    canvas.width = inWidth;
    canvas.height = inHeight;
    var context = canvas.getContext("2d")    

    for(var i = 0; i < commands.length; i++){

        // Do Stuff like 
        // context.beginPath();
        // context.moveTo(25,25);
        // context.lineTo(105,25);
        // context.lineTo(25,105);
        // context.fill();

        // context.commands[i] <- Something like this
    }

    return canvas;
}

context.commands[i]などに相当するものはありますか...

これが不可能な場合、代わりにコールバック関数を渡す別のオプションがあると考えていました。何かのようなもの...

function MakeALine(){

var newLineAsCanvas =  DrawToCanvas(100,100,function(context){
     context.beginPath();
     context.moveTo(25,25);
     // etc...
 }
}

このようなことをする最善の方法は何でしょうか?

4

1 に答える 1

1

私はあなたが何を求めているのか少し混乱していますが、javascript callコマンドが役立つ可能性があります。

var commands = [];
commands.push(function(context) {
  context.beginPath();
});
commands.push(function(context) {
  context.moveTo(25,25);
  context.lineTo(105,25);
  context.lineTo(25,105);
});
commands.push(function(context) {
  context.fill();
});
document.body.appendChild(DrawToCanvas(commands, 300, 300));

function DrawToCanvas(commands, height, width){

    var canvas = document.createElement("canvas");
    canvas.width = width;
    canvas.height = height;
    var context = canvas.getContext("2d")

    for(var i = 0; i < commands.length; i++){
        commands[i].call(this, context);
    }

    return canvas;
}
于 2012-08-07T06:18:01.260 に答える