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

  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 = 1/w;
  8 	var a_11;var a_12;var a_21; var a_22;
  9 	var numb1; var numb2; var decim;
 10 	var on = false;
 11 	var interv;
 12 	a_11 = 1;
 13 	a_12 = 1;
 14 	a_21 = 1;
 15 	a_22 = 1;
 16 	var degrees = 0;
 17 	var sposob;
 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 		clearInterval(interv);
 31 		on = false;
 32 	}
 33 	a12.onchange = function() {
 34 		a_12 = parseFloat(document.getElementById('a12').value);
 35 		clearInterval(interv);
 36 		on = false;
 37 	}
 38 	a21.onchange = function () {
 39 		a_21 = parseFloat(document.getElementById('a21').value);
 40 		clearInterval(interv);
 41 		on = false;
 42 	}
 43 	a22.onchange = function () {
 44 		a_22 = parseFloat(document.getElementById('a22').value);
 45 		clearInterval(interv);
 46 		on = false;
 47 	}
 48 	
 49 	degree.onchange = function() {
 50 		degrees = parseFloat(document.getElementById('degree').value);
 51 		clearInterval(interv);
 52 		on = false;
 53 	}
 54 		
 55 	cnv.onmousedown = function () {
 56 		var rect = cnv.getBoundingClientRect();
 57 		x = (event.clientX - rect.left);
 58 		y = (event.clientY - rect.top);
 59 		clear = document.getElementsByName('clear');
 60 		if (clear[0].checked == true) {
 61 		ctx.clearRect(0,0,w,h);
 62 		ctx.beginPath();
 63 		ctx.arc(x,y,3,0,2*Math.PI);
 64 		ctx.fillStyle = 'blue';
 65 		ctx.fill();
 66 		} else {
 67 		ctx.strokeStyle = "rgb("+
 68             Math.floor(Math.random()*256)+","+
 69             Math.floor(Math.random()*256)+","+
 70             Math.floor(Math.random()*256)+")";
 71 		}
 72 		if (on == false) {
 73 			interv = setInterval(control,0.000001);
 74 			on = true;
 75 		}
 76 		if (degrees != 0) {
 77 		sposob = document.getElementsByName('sposob');
 78 		if (sposob[0].checked == true) {
 79 			a_11 = Math.cos(degrees);
 80 			a_22 = a_11;
 81 			a_12 = Math.sin(degrees);
 82 			a_21 = -a_12;
 83 		}
 84 		if (sposob[1].checked == true) {
 85 			a_11 = Math.cos(degrees*2*Math.PI/360);
 86 			a_12 = Math.sin(degrees*2*Math.PI/360);
 87 			a_21 = -(a_12/a_11);
 88 			a_22 = a_11 - a_21*a_12;
 89 		}
 90 		}
 91 		
 92 	}
 93 	
 94 	function Func (numb) {
 95 		if (numb>=0) { 
 96 		decim = parseFloat(numb) - parseInt(numb);
 97 	    return (decim);
 98 		} else {
 99 		decim = parseFloat(numb) - (parseInt(numb) - 1);
100 		return (decim);
101 		}
102 	}
103 	function coord() {
104 		x = (x)*scale;
105 		y = (y)*scale;
106 		sposob = document.getElementsByName('sposob');
107 		if (sposob[0].checked == true) { 
108 			numb1 = a_11*x+a_12*y;
109 			numb2 = a_21*x+a_22*y;
110 			x = Func(numb1);
111 			y = Func(numb2);
112 		}
113 		if (sposob[1].checked == true) {
114 			numb1 = a_11*x+a_12*y;
115 			x = Func(numb1);
116 			numb2 = a_21*x+a_22*y;
117 			y = Func(numb2);
118 		}
119 		y = y/scale;
120 		x = x/scale;
121 	}
122 	function draw() { 
123 		ctx.beginPath();
124 		ctx.rect(x,y,1,1);
125 		ctx.stroke();
126 	}
127 	
128 	function control () {
129 		coord();
130 		draw();
131 	}
132 	
133 }