canvas画布添加图片

1.首先得定义dom元素

    var canvas = document.getElementById("mapCanvas");
    var ctx = canvas.getContext('2d');
    var w = canvas.offsetWidth;
    var h = canvas.offsetHeight;
      
2.获取图片地址
    var image = new Image();
    image.src = src;

3. 将图片画到canvas上去并设置大小size
    var size = 20;
    ctx.beginPath();
    ctx.drawImage(image,  w, h , size, size);
   
4. 可以添加文字设置字体大小，位置，颜色
    ctx.strokeStyle = 'black';
    ctx.font = "14px Arial";
    ctx.textBaseline = "bottom";
    ctx.textAlign = "center";
    ctx.fillText("123", w, h);
5.最后收尾
    ctx.closePath();
    ctx.stroke();