ejemplo 1

ej001.html

<!-- Creamos nuestro lienzo canvas de 300x100 pixels -->
<canvas height="100" id="canvas" width="300"></canvas>

<!-- Creamos el javascript para dibujar nuestro Hola Mundo -->
<script type="text/javascript">

// Definimos un evento que espere que se carga la 
// página (load) antes de ejecutar nuestro script

window.addEventListener('load', function () {

  // Buscamos nuestro elemento con id=canvas
  var elem = document.getElementById('canvas');
  if (!elem || !elem.getContext) {
    return;
  }

  // Luego creamos un contexto 2d para dibujar encima
  var context = elem.getContext('2d');
  if (!context) {
    return;
  }

  // Le definimos un color, una fuente y una posición
  context.fillStyle    = '#00f';
  context.font         = '40px sans-serif';
  context.textBaseline = 'top';

  // Finalmente rellenamos con un texto en la posición
  // 0px a partir de la izquierda y 30px a partir de arriba
  if (context.fillText) {
    context.fillText('Hola Mundo!', 0, 30);
  }
}, false);
</script>