[ ECMAScript ] javascript - 원의 n분점을 연결하는 직선 그리기
페이지 정보
작성자 웹지기 댓글 0건 조회 1,832회 작성일 21-01-14 23:47본문
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>원의 n분점을 연결하는 직선 그리기</title>
<script>
function diamond(c,n,x,y,r,color) {
c.strokeStyle = color;
c.beginPath();
for(var i=0; i<n; i++){
var t=i*2*Math.PI/n;
for(var j=i+1; j<n; j++) {
var s=j*2*Math.PI/n;
c.moveTo(x+r*Math.cos(t), y+r*Math.sin(t));
c.lineTo(x+r*Math.cos(s), y+r*Math.sin(s));
}
}
c.stroke();
}
window.onload = function(){
var canvas = document.getElementById("mycanvas");
var ctx = canvas.getContext("2d");
diamond(ctx, 6, 170 , 170 , 150,'darkblue');
diamond(ctx, 12, 490 , 170 , 150,'darkblue');
diamond(ctx,18, 810 , 170 , 150,'darkblue');
};
</script>
</head>
<body>
<canvas id="mycanvas" width="1000" height="400"></canvas>
</body>
</html>
댓글목록
등록된 댓글이 없습니다.