Фрактал — различия между версиями

  1 window.addEventListener('load',main,false);
  2 function main () {
  3 	var x; var y;
  4 	var ctx = cnv.getContext('2d');
  5 	var h = cnv.height;
  6 	var w = cnv.width;
  7 	var scale = 1000;
  8 	var a_11; var a_12; var a_21; var a_22;
  9 	var numb1; var numb2; var decim;
 10 	var interv;
 11 	a_11 = 1;
 12 	a_12 = 1;
 13 	a_21 = 1;
 14 	a_22 = 1;
 15 	const N = 200000;
 16 	var angle = 0;
 17 	var way;
 18 	var clear;
 19 	var butt = document.getElementById("addButton"); 
 20 	
 21 	butt.onclick = function () { 
 22 	ctx.strokeStyle = "rgb("+
 23             Math.floor(Math.random()*256)+","+
 24             Math.floor(Math.random()*256)+","+
 25             Math.floor(Math.random()*256)+")";
 26 	}
 27 
 28 	a11.onchange = function () {
 29 		a_11 = parseFloat(document.getElementById('a11').value);
 30 	}
 31 	a12.onchange = function() {
 32 		a_12 = parseFloat(document.getElementById('a12').value);
 33 	}
 34 	a21.onchange = function () {
 35 		a_21 = parseFloat(document.getElementById('a21').value);
 36 	}
 37 	a22.onchange = function () {
 38 		a_22 = parseFloat(document.getElementById('a22').value);
 39 	}
 40 	
 41 	angle_rad.onchange = function() {
 42 		angle = parseFloat(document.getElementById('angle_rad').value);
 43 	}
 44 		
 45 	cnv.onmousedown = function () {
 46 		var rect = cnv.getBoundingClientRect();
 47 		x = (event.clientX - rect.left)/scale;
 48 		y = (event.clientY - rect.top)/scale;
 49 		clear = document.getElementsByName('clear_rect');
 50 		if (clear[1].checked == true) {
 51 		ctx.strokeStyle = "rgb("+
 52             Math.floor(Math.random()*256)+","+
 53             Math.floor(Math.random()*256)+","+
 54             Math.floor(Math.random()*256)+")";
 55 		} else {
 56 		ctx.clearRect(0,0,w,h);
 57 		ctx.beginPath();
 58 		ctx.arc(x*scale,y*scale,3,0,2*Math.PI);
 59 		ctx.fillStyle = 'blue';
 60 		ctx.fill();
 61 		}
 62 		
 63 		if (angle != 0) {
 64 			a_11 = Math.cos(angle);
 65 			a_22 = a_11;
 66 			a_12 = Math.sin(angle);
 67 			a_21 = -a_12;
 68 			document.getElementById('a11').value = a_11;
 69 			document.getElementById('a12').value = a_12;
 70 			document.getElementById('a21').value = a_21;
 71 			document.getElementById('a22').value = a_22;
 72 		}
 73 		
 74 		control();
 75 	
 76 	}
 77 
 78 	function Func (numb) {
 79 		decim = parseFloat(numb) - Math.floor(numb);
 80 		return(decim);
 81 	}
 82 	
 83 	function coord() {
 84 		way = document.getElementsByName('ways');
 85 		if (way[0].checked == true) { 
 86 			numb1 = a_11*x+a_12*y;
 87 			numb2 = a_21*x+a_22*y;
 88 			x = Func(numb1);
 89 			y = Func(numb2);
 90 		}
 91 		if (way[1].checked == true) {
 92 			numb1 = a_11*x+a_12*y;
 93 			x = Func(numb1);
 94 			numb2 = a_21*x+a_22*y;
 95 			y = Func(numb2);
 96 		}
 97 	}
 98 	function draw() { 
 99 		ctx.beginPath();
100 		ctx.rect(x*scale,y*scale,1,1);
101 		ctx.stroke();
102 	}
103 	
104 	function control () {
105 		for (j = 0;j<=N; j++){
106 		coord();
107 		draw();
108 		}
109 	}
110 
111 }