context.closePath()
从当前笔的位置绘制一条线回到起始路径坐标。
例如，如果您绘制形成两条三角形的两条腿的两条线，closePath将通过从第二条腿的端点向第一条腿的起点绘制三角形的第三条腿来“闭合”该三角形。
误解解释了！
此命令的名称通常会引起误解。
context.closePath不是的结尾定界符context.beginPath。
再次，closePath命令画一条线-它不会“关闭” beginPath。
本示例绘制一个三角形的2条腿，并closePath通过绘制第三条腿来完成（闭合？！）三角形。什么closePath是真正做的是吸引来自第二站的终点回到了首回合的起点线。
<!doctype html>
<html>
<head>
<style>
body{ background-color:white; }
#canvas{border:1px solid red; }
</style>
<script>
window.onload=(function(){
// 获取对canvas元素及其上下文的引用
var canvas=document.getElementById("canvas");
var ctx=canvas.getContext("2d");
// 论点
var topVertexX=50;
var topVertexY=50;
var rightVertexX=75;
var rightVertexY=75;
var leftVertexX=25;
var leftVertexY=75;
// 一组线段绘制为使用
// "moveTo" 和多个 "lineTo" commands
ctx.beginPath();
ctx.moveTo(topVertexX,topVertexY);
ctx.lineTo(rightVertexX,rightVertexY);
ctx.lineTo(leftVertexX,leftVertexY);
// closePath绘制三角形的第三条腿
ctx.closePath()
ctx.stroke();
}); // 结束window.onload
</script>
</head>
<body>
<canvas id="canvas" width=200 height=150></canvas>
</body>
</html>