update

13.md

@@ -114,6 +114,8 @@
 
 [演示 13-2](http://airingursb.github.io/canvas/Canvas/13/13-2.html)
 
+运行结果：
+
 ![图形变换的坑](http://7xkcl8.com1.z0.glb.clouddn.com/edu13-3.png-html.jpg)
 
 这里的绿色矩形并没有如我们所愿在（300，300）位置处，而是跑到了（400，400）这里。为什么呢？想必大家已经知道了答案——Canvas是基于状态的绘制。在我们第一次平移之后，坐标系已经在（100，100）处了，所以如果继续平移，这个再基于新坐标系继续平移坐标系。那么要怎么去解决呢？很简单，有两个方法。
@@ -178,6 +180,8 @@
 
 [演示 13-3](http://airingursb.github.io/canvas/Canvas/13/13-3.html)
 
+运行结果：
+
 ![状态保存结合图形变换](http://7xkcl8.com1.z0.glb.clouddn.com/edu13-4.png-html.jpg)
 
 因此，**在使用图形变换的时候，要记得结合使用状态保存**。

14.md

@@ -55,6 +55,8 @@
 
 [演示 14-1](http://airingursb.github.io/canvas/Canvas/14/14-1.html)
 
+运行结果：
+
 ![旋转变换](http://7xkcl8.com1.z0.glb.clouddn.com/edu14-1.png-html.jpg)
 
 这里用for循环绘制了14对正方形，其中蓝色是旋转前的正方形，红色是旋转后的正方形。每次旋转都以正方形左上角顶点为原点进行旋转。每次绘制都被`save()`与`restore()`包裹起来，每次旋转前都移动了坐标系。童鞋们可以自己动动手，实践一下，就能体会到旋转变换的奥妙了。
@@ -107,6 +109,8 @@
 
 [演示 14-2](http://airingursb.github.io/canvas/Canvas/14/14-2.html)
 
+运行结果：
+
 ![魔性Logo](http://7xkcl8.com1.z0.glb.clouddn.com/edu14-3.png-html.jpg)
 
 是不是非常的酷？这个图形稍微分析一下发现还是蛮简单的，就是让一个正放形，以屏幕中点（即初始正方形左下角顶点）为圆心进行旋转。

15.md

@@ -45,6 +45,8 @@
 
 [演示 15-1](http://airingursb.github.io/canvas/Canvas/15/15-1.html)
 
+运行结果：
+
 ![缩放变换](http://7xkcl8.com1.z0.glb.clouddn.com/edu15-1.png-html.jpg)
 
 ###缩放变换应注意的问题

16.md

@@ -130,6 +130,8 @@ Math.cos(θ*Math.PI/180)，Math.sin(θ*Math.PI/180)，0，0）`替代。
 
 [演示 16-1](http://airingursb.github.io/canvas/Canvas/16/16-1.html)
 
+运行结果：
+
 ![transform](http://7xkcl8.com1.z0.glb.clouddn.com/edu16-5.png-html.jpg)
 
 ##`setTransform()`方法
@@ -185,6 +187,8 @@ Math.cos(θ*Math.PI/180)，Math.sin(θ*Math.PI/180)，0，0）`替代。
 
 [演示 16-2](http://airingursb.github.io/canvas/Canvas/16/16-2.html)
 
+运行结果：
+
 ![setTransform](http://7xkcl8.com1.z0.glb.clouddn.com/edu16-6.png-html.jpg)
 
 解释一下过程：每当我们调用 `setTransform()` 时，它都会重置前一个变换矩阵然后构建新的矩阵，因此在下面的例子中，不会显示红色矩形，因为它在蓝色矩形下面。