StraightOuttaHell

var canvas = document.querySelector('canvas');
document.querySelector('form').addEventListener('submit', function(event) {
  var ctx = canvas.getContext('2d')
    , line = 0;
  
  ctx.clearRect(0, 0, canvas.width, canvas.height);
  [].forEach.call(event.srcElement.querySelectorAll('label'), function(label) {
    ctx.fillText(label.textContent + label.querySelector('input').value, 20, (++line) * 20);
  });
});
form, canvas { width: 500px }
canvas { height: 200px }
form > * { display: block }
form > * + * { margin-top: .5em; }
form input { width: 100% }
<form>
  <label>Name: <input name="name"></label>
  <label>Address: <input name="address"></label>
  <button>draw</button>
</form>
<canvas></canvas>