2011년 12월 6일 화요일

[HTML5] 선 긋기

<!DOCTYPE HTML>
<html>
<head>

<script>
window.onload = function(){
// get the canvas DOM element by its ID
var canvas = document.getElementById("myCanvas");
// declare a 2-d context using the getContext() method of the
// canvas object
var context = canvas.getContext("2d");
// set the line width to 10 pixels
context.lineWidth = 20;
// set the line color to blue
context.strokeStyle = "#000000";
// position the drawing cursor
context.moveTo(100, canvas.height - 50);
// draw the line
context.lineTo(canvas.width - 50, 50);
// make the line visible with the stroke color
context.stroke();
}
</script>


</head>
<body>
<canvas id="myCanvas" width="600" height="250" style="border:1px
solid black;">
</canvas>
</body>
</html>

댓글 없음:

댓글 쓰기

팔로어