自从投身于互联网学习的怀抱中后，一直想搭建一个属于自己的个人博客。了解过WordPress
，不过因为不懂服务器的知识只得暂时作罢;也看过csdn、博客园等，方便是方便，不过主题样式无法个人定制，这对于美工出身的我简直无法忍受。听朋友说起hexo，并且能够部署在github上，甚是方便，照着教程，一步一步搭建了这个博客。在搭建博客过程中遇到了很多问题，写下这篇教程的原因就是希望能够给需要的人些许帮助。

在HTML5中，我们可以使用drawImage方法在canvas上进行画图操作，其基本代码如下：

1
2
3
4
5

var canvas = document.getElementById("canvas");
var context = canvas.getContext("2d");
var image = new Image();
image.src = "images/01.jpg";
context.drawImage(image, 0, 0);  

不过我们会发现这样写是无法显示出图片的，因为图片并没有加载完全，我们就调用了drawImage方法，我们可以使用img的onload方法，使图片加载完全后
在执行drawImage操作，代码如下

1
2
3
4
5

var image = new Image();
image.src = "images/01.jpg";
image.onload = function() {
    context.drawImage(image, 0, 0);
}

或者使用<img>标签先加载图片
<img src="images/01.jpg" style="display: none" id="image">
然后使用getElementById来获得图片对象
var image = document.getElementById('image');