-
Notifications
You must be signed in to change notification settings - Fork 0
/
lesson3.html
81 lines (78 loc) · 2.29 KB
/
lesson3.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
<HTML>
<head>
<style>
body {
background: #323232; /* Цвет фона */
}
</style>
</head>
<BODY>
<canvas id='lab03' width='700' height='400' style="border:1px solid">
</canvas>
<script>
function sign(x0, x1)
{
return (x1-x0)/Math.abs(x1-x0);
}
function need_swap(x0, y0, x1, y1)
{
var angle=Math.asin(Math.abs(y0-y1)/Math.sqrt((x0-x1)*(x0-x1)+(y0-y1)*(y0-y1)))*180/Math.PI;
if (angle>45 && angle<=90)
return true;
}
function draw(x_start, y_start, x_end, y_end, color)
{
ctx.fillStyle=color;
var E=0;
var x=x_start;
var y=y_start;
if (need_swap(x_start, y_start, x_end, y_end))
{
while (y!==y_end)
{
E=E+2*(x_end-x_start);
if (Math.abs(E)<Math.abs((y_end-y_start)))
{
ctx.fillRect(x, y, 1, 1);
}
else
{
x=x+sign(x_start, x_end);
E=E-2*(y_end-y_start)*sign(x_start, x_end)*sign(x_start, y_end);
ctx.fillRect(x, y, 1, 1);
}
y=y+sign(y_start, y_end);
}
return
}
while (x!==x_end)
{
E=E+2*(y_end-y_start);
if (Math.abs(E)<Math.abs((x_end-x_start)))
{
ctx.fillRect(x, y, 1, 1);
}
else
{
y=y+sign(y_start, y_end);
E=E-2*(x_end-x_start)*sign(y_start, y_end)*sign(x_start, x_end);
ctx.fillRect(x, y, 1, 1);
}
x=x+sign(x_start, x_end);
}
}
function clock(x_begin, y_begin, radius)
{
var angle=Math.floor(Date.now()%60000/1000)*6+90;
var y_end=Math.floor(Math.abs(radius*Math.sin(angle*Math.PI/180)-y_begin));
var x_end=Math.floor(Math.abs(radius*Math.cos(angle*Math.PI/180)-x_begin));
draw(x_begin, y_begin, x_end, y_end, '#FCCFFF');
setTimeout(draw, 1000, x_begin, y_begin, x_end, y_end, '#323232')
}
var canvas=document.getElementById('lab03');
var ctx=canvas.getContext('2d');
var radius=150, x_begin=300, y_begin=200;
setInterval(clock, 100, x_begin, y_begin, radius);
</script>
</BODY>
</HTML>