html5怎么在实心圆写文字_随笔

html5在实心圆写文字的方法如下：

1、创建一个画布，设置宽度和高度。

2、获取到元素，varcanvas=document.getElementById("canvas")。

3、创建context对象，varctx=canvas.getContext("2d")。

4、设置绘制文本的字体和字体大小，ctx.font="40px微软雅黑"。

5、在画布上绘制实心的文本，其中三个参数含义是：第一个是绘制的文本，第二个是绘制文本横坐标起始坐标，第三个是纵坐标的起始坐标，ctx.fillText("HTML5"，200，200)。

<body>

</body>

(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>

stroke()是描边，就是空心圆。fill()是填充，就是实心圆

//空心

var canvas = document.getElementById("myCanvas").getContext('2d')

canvas.beginPath()

canvas.arc(圆心x坐标,圆心y坐标,半径,0,2*Math.PI,true)

canvas.closePath()

canvas.strokeStyle='black'

canvas.stroke()

//实心

var canvas = document.getElementById("myCanvas").getContext('2d')

canvas.beginPath()

canvas.arc(圆心x坐标,圆心y坐标,半径,0,2*Math.PI,true)

canvas.closePath()

canvas.fillStyle='black'

canvas.fill()

欢迎分享，转载请注明来源：内存溢出

html5怎么在实心圆写文字