function Up () { var ctx = document.getElementById('canvas').getContext('2d'), img = new Image(), img.src = "ava1.png", img.src = src; img.onload = function() { context.drawlmage(img, 0, 0, 480, 402); } } 
 <button type="button" onclick="Up()" >add logo</button> <canvas id="canvas" width="480" height="402"></canvas>

when you press a button, nothing happens. why is that?

    1 answer 1

    Because a lot of mistakes:

    • instead of img.src = "ava1.png", should be src = "ava1.png"; there must be a semicolon at the end
    • instead of context...... should be ctx.....
    • instead of drawlmage should be drawImage

     function Up () { var ctx = document.getElementById('canvas').getContext('2d'), img = new Image(), src = "http://s00.yaplakal.com/pics/pics_original/3/2/0/6784023.jpg"; img.src = src; img.onload = function() { ctx.drawImage(img, 0, 0, 480, 402); } } 
     <button type="button" onclick="Up()" >add logo</button> <canvas id="canvas" width="480" height="402"></canvas>