GregoireHebert/fougere.html

## fougere.html
<!doctype html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="description" content="la fougère de Barnsley">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>Fougère de Barnsley</title>
    </head>
    <body>
    	<canvas id="fougere" width="600" height="600"></canvas>

        <script type="text/javascript">
        	const canvas = document.getElementById('fougere');
			const canvasWidth = canvas.width;
			const canvasHeight = canvas.height;
			const ctx = canvas.getContext("2d");

			let pointX = 0;
			let pointY = 0;
			let x = 0;
			let y = 0;

			Number.prototype.map = function (in_min, in_max, out_min, out_max) {
			  return (this - in_min) * (out_max - out_min) / (in_max - in_min) + out_min;
			}

			function nextPoint() {
				let r = Math.random();
				if ( r < 0.01) {
					pointX =  0;
					pointY =  0.16 * y;
				} else if ( r < 0.86) {
					pointX =  0.85 * x +  0.04 * y;
					pointY = -0.04 * x +  0.85 * y + 1.6;
				} else if ( r < 0.93) {
					pointX =  0.20 * x + -0.26 * y;
					pointY =  0.23 * x +  0.22 * y + 1.6;
				} else {
					pointX = -0.15 * x +  0.28 * y;
					pointY =  0.26 * x +  0.24 * y + 0.44;
				}

				x = pointX;
				y = pointY;
			}

			function drawPoint () {
				let px = x.map(-2.1820, 2.6558, 0, canvasWidth);
				let py = y.map(0, 9.9983, canvasHeight, 0);

			    ctx.fillRect(px,py,1,1);

			    nextPoint();
			}

			let c = 0
   			while (++c < 150000) {
   				drawPoint();
   			}
        </script>
    </body>
</html>
	<!doctype html>
	<html>
	<head>
	<meta charset="utf-8">
	<meta name="description" content="la fougère de Barnsley">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>Fougère de Barnsley</title>
	</head>
	<body>
	<canvas id="fougere" width="600" height="600"></canvas>

	<script type="text/javascript">
	const canvas = document.getElementById('fougere');
	const canvasWidth = canvas.width;
	const canvasHeight = canvas.height;
	const ctx = canvas.getContext("2d");

	let pointX = 0;
	let pointY = 0;
	let x = 0;
	let y = 0;

	Number.prototype.map = function (in_min, in_max, out_min, out_max) {
	return (this - in_min) * (out_max - out_min) / (in_max - in_min) + out_min;
	}

	function nextPoint() {
	let r = Math.random();
	if ( r < 0.01) {
	pointX = 0;
	pointY = 0.16 * y;
	} else if ( r < 0.86) {
	pointX = 0.85 * x + 0.04 * y;
	pointY = -0.04 * x + 0.85 * y + 1.6;
	} else if ( r < 0.93) {
	pointX = 0.20 * x + -0.26 * y;
	pointY = 0.23 * x + 0.22 * y + 1.6;
	} else {
	pointX = -0.15 * x + 0.28 * y;
	pointY = 0.26 * x + 0.24 * y + 0.44;
	}

	x = pointX;
	y = pointY;
	}

	function drawPoint () {
	let px = x.map(-2.1820, 2.6558, 0, canvasWidth);
	let py = y.map(0, 9.9983, canvasHeight, 0);

	ctx.fillRect(px,py,1,1);

	nextPoint();
	}

	let c = 0
	while (++c < 150000) {
	drawPoint();
	}
	</script>
	</body>
	</html>