<!DOCTYPE html>
<html>
<head>
<title>canvas</title>
<style>
canvas{
background:#ccc;
}
</style>
<script>
window.οnlοad=function(){
var canvas = document.getElementById("canvas");
var cobj = canvas.getContext("2d");
cobj.rect(100,100,100,100);
cobj.stroke();
cobj.clip();
cobj.fillRect(0,0,120,120);
/*画圆*/
/*
cobj.arc(100,100,30,0,Math.PI/4,false);
cobj.stroke();
*/
/*切线弧度*/
/*
cobj.moveTo(100,100);
cobj.lineTo(130,100);
cobj.arcTo(180,100,180,140,30);
cobj.lineTo(180,180);
cobj.stroke();
*/
/*画贝塞尔曲线*/
/*
cobj.moveTo(100,100);
//cobj.quadraticCurveTo(200,150,300,100);//贝塞尔曲线
cobj.bezierCurveTo(150,200,250,0,350,100);//二次贝塞尔曲线
cobj.stroke();
*/
/*画贝塞尔曲线*/
/*
canvas.οnmοusedοwn=function(e){
var startx=e.layerX;
var starty=e.layerY;
canvas.οnmοuseup=function(e){
var endx=e.layerX;
var endy=e.layerY;
canvas.οnmοusemοve=function(e){
cobj.clearRect(0,0,400,400);
var conx=e.layerX;
var cony=e.layerY;
cobj.beginPath();
cobj.moveTo(startx,starty);
cobj.quadraticCurveTo(conx,cony,endx,endy);
cobj.stroke();
}
}
}
*/
}
</script>
</head>
<body>
<canvas width="400px" height="400px" id="canvas">
请您升级浏览器
</canvas>
</body>
</html>
406
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
