1、创建一个画布，设置宽度和高度。
2、获取到元素，varcanvas=document.getElementById("canvas")。
3、创建context对象，varctx=canvas.getContext("2d")。
4、设置绘制文本的字体和字体大小，ctx.font="40px微软雅黑"。
5、在画布上绘制实心的文本，其中三个参数含义是：第一个是绘制的文本，第二个是绘制文本横坐标起始坐标，第三个是纵坐标的起始坐标，ctx.fillText("HTML5"，200，200)。
<body><canvas id="ca" width="600" height="300"></canvas>
</body>
<script>
(function(){
var obj=document.getElementById("ca").getContext("2d")
obj.beginPath()
obj.arc(100,50,50,0,Math.PI*2)
obj.stroke()
obj.fillStyle="#ccc"
obj.fill()
obj.beginPath()
obj.arc(100,50,30,0,Math.PI*2)
obj.stroke()
obj.fillStyle="#000"
obj.fill()
})()
</script>
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）