Estoy experimentando un poco con el nuevo elemento de lienzo en HTML.

Simplemente quiero agregar una imagen al lienzo, pero no funciona por alguna razón.

Tengo el siguiente código

HTML

<canvas id="viewport"></canvas>

CSS

canvas#viewport { border: 1px solid white; width: 900px; }

JS

var canvas = document.getElementById('viewport'),
context = canvas.getContext('2d');

make_base();

function make_base()
{
  base_image = new Image();
  base_image.src = 'img/base.png';
  context.drawImage(base_image, 100, 100);
}

La imagen existe y no obtengo errores de JavaScript. La imagen simplemente no se muestra.

Debe ser algo realmente simple que he extrañado ...