<!DOCTYPE html>
<html>
<body>
Исcледование параметров синусоиды
<br>
<canvas id="myCanvas" width="500" height="500" style="border:1px solid #d3d3d3;">
</canvas>
<br>
<input type="button" value="Случайные параметры" style="position:absolute;left:600px;top:0;" onclick="random_param()">
a<input id="para" value="250">
<br>
b<input id="parb" value="50">
<br>
c<input id="parc" value="50">
<br>
d<input id="pard" value="50">
<br>
<input type="button" onclick="set_param()" value="нарисовать синусоиду">
<script>
let canvas = document.getElementById("myCanvas");
let ctx = canvas.getContext("2d");
let a = 250;
let b = 50;
let c = 50;
let d = 50;
create_sin();
function create_sin(){
ctx.clearRect(0,0,500,500);
for (let x = 0; x < 3600;x++){
let y = a + b*Math.sin(c*x+ d);
ctx.fillRect(x,y,1,1);
}
}
function set_param(){
let par_1 = document.getElementById("para");
a = Number(par_1.value);
let par_2 = document.getElementById("parb");
b = Number(par_2.value);
let par_3 = document.getElementById("parc");
c = Number(par_3.value);
let par_4 = document.getElementById("pard");
d = Number(par_4.value);
create_sin();
}
function random_param(){
let par_2 = document.getElementById("parb");
b = Number(Math.floor(Math.random()*150));
par_2.value = b;
let par_3 = document.getElementById("parc");
c = Number(Math.floor(Math.random()*150));
par_3.value = c;
let par_4 = document.getElementById("pard");
d = Number(Math.floor(Math.random()*150));
par_3.value = d;
set_param();
}
</script>
</body>
</html>
| 