KineticJS: How do I scale a Stage?

Question

I have a KineticJS Stage with one layer. Here is a demo: http://jsfiddle.net/confile/7QTmz/

var stage = new Kinetic.Stage({
    container: 'container',
    width: 578,
    height: 200
});
var layer = new Kinetic.Layer();

var imageObj = new Image();
imageObj.onload = function () {
    var yoda = new Kinetic.Image({
        x: 200,
        y: 50,
        image: imageObj,
        width: 106,
        height: 118
    });

    // add the shape to the layer
    layer.add(yoda);

    // add the layer to the stage
    stage.add(layer);

    stage.size({
        width: 100,
        height: 200
    });

    layer.draw();
    stage.draw();
};
imageObj.src = 'http://www.html5canvastutorials.com/demos/assets/yoda.jpg';

How can I resize the stage such that stage.toDataUrl() will return an image with the new dimensions?

Answer 1

You can 2X the stage and its content like this (also...thanks to @Greg for info on stage.size):

var scaleFactor=2;

stage.size({width:stage.width()*scaleFactor,height:stage.height()*scaleFactor});

stage.scaleX(scaleFactor);
stage.scaleY(scaleFactor);

stage.draw();