canvas是html5新特性,canvas---HTML5新特性

画圆及填充文字

canvas{

background: #ccc;

}

var canvas=document.getElementById('canvas');

var ctx=canvas.getContext('2d');

ctx.strokeStyle='#fff';

ctx.beginPath();

ctx.arc(300,300,50,0,2*Math.PI);

// ctx.closePath();

// ctx.fillStyle='grey';

// ctx.fill();

ctx.stroke();

//

ctx.beginPath();

ctx.strokeStyle='green';

ctx.arc(300,300,50,0.5*Math.PI,1.5*Math.PI);

ctx.stroke();

// ctx.closePath();

ctx.font='bold 19px arial'

ctx.fillStyle='red';

ctx.fillText('50%',285,310)