var gColorPalette = getColorPalette('kairo');
function drawImage() {
- var canvas = document.getElementById("mbrotImage");
+ let canvas = document.getElementById("mbrotImage");
if (canvas.getContext) {
- var context = canvas.getContext("2d");
+ let context = canvas.getContext("2d");
// example:
// context.fillStyle = "rgb(200,0,0)";
// context.fillStyle = "rgba(0, 0, 200, 0.5)";
// context.fillRect (30, 30, 55, 50);
- var Cr_min = -2.0;
- var Cr_max = 1.0;
- var Cr_scale = Cr_max - Cr_min;
+ let Cr_min = -2.0;
+ let Cr_max = 1.0;
+ let Cr_scale = Cr_max - Cr_min;
- var Ci_min = -1.5;
- var Ci_max = 1.5;
- var Ci_scale = Ci_max - Ci_min;
+ let Ci_min = -1.5;
+ let Ci_max = 1.5;
+ let Ci_scale = Ci_max - Ci_min;
- var iterMax = 500;
+ let iterMax = 500;
- for (var img_x = 0; img_x < canvas.width; img_x++) {
- for (var img_y = 0; img_y < canvas.height; img_y++) {
- var C = new complex(Cr_min + (img_x / canvas.width) * Cr_scale,
+ for (let img_x = 0; img_x < canvas.width; img_x++) {
+ for (let img_y = 0; img_y < canvas.height; img_y++) {
+ let C = new complex(Cr_min + (img_x / canvas.width) * Cr_scale,
Ci_min + (img_y / canvas.height) * Ci_scale);
window.setTimeout(drawPoint, 0, context, img_x, img_y, C, iterMax);
}
}
function getColor(aIterValue, aIterMax) {
- var standardizedValue = Math.round(aIterValue * 1024 / aIterMax);
+ let standardizedValue = Math.round(aIterValue * 1024 / aIterMax);
return gColorPalette[standardizedValue];
if (aIterValue == aIterMax) {
return "rgb(0,0,0)";
var palette = [];
switch (palName) {
case 'bw':
- for (var i = 0; i < 1024; i++) {
+ for (let i = 0; i < 1024; i++) {
palette[i] = 'rgb(255,255,255)';
}
palette[1024] = 'rgb(0,0,0)';
break;
case 'kairo':
// outer areas
- for (var i = 0; i < 32; i++) {
- var cc1 = Math.floor(i * 127 / 31);
- var cc2 = 170 - Math.floor(i * 43 / 31);
+ for (let i = 0; i < 32; i++) {
+ let cc1 = Math.floor(i * 127 / 31);
+ let cc2 = 170 - Math.floor(i * 43 / 31);
palette[i] = 'rgb(' + cc1 + ',' + cc2 + ',' + cc1 + ')';
}
// inner areas
- for (var i = 0; i < 51; i++) {
- var cc = Math.floor(i * 170 / 50);
+ for (let i = 0; i < 51; i++) {
+ let cc = Math.floor(i * 170 / 50);
palette[32 + i] = 'rgb(' + cc + ',0,' + (170 + cc) + ')';
}
// corona
- for (var i = 0; i < 101; i++) {
- var cc = Math.floor(i * 200 / 100);
+ for (let i = 0; i < 101; i++) {
+ let cc = Math.floor(i * 200 / 100);
palette[83 + i] = 'rgb(255,' + cc + ',0)';
}
// inner corona
- for (var i = 0; i < 201; i++) {
- var cc1 = 255 - Math.floor(i * 85 / 200);
- var cc2 = 200 - Math.floor(i * 30 / 200);
- var cc3 = Math.floor(i * 170 / 200);
+ for (let i = 0; i < 201; i++) {
+ let cc1 = 255 - Math.floor(i * 85 / 200);
+ let cc2 = 200 - Math.floor(i * 30 / 200);
+ let cc3 = Math.floor(i * 170 / 200);
palette[184 + i] = 'rgb(' + cc1 + ',' + cc2 + ',' + cc3 + ')';
}
- for (var i = 0; i < 301; i++) {
- var cc1 = 170 - Math.floor(i * 43 / 300);
- var cc2 = 170 + Math.floor(i * 85 / 300);
+ for (let i = 0; i < 301; i++) {
+ let cc1 = 170 - Math.floor(i * 43 / 300);
+ let cc2 = 170 + Math.floor(i * 85 / 300);
palette[385 + i] = 'rgb(' + cc1 + ',' + cc1 + ',' + cc2 + ')';
}
- for (var i = 0; i < 338; i++) {
- var cc = 127 + Math.floor(i * 128 / 337);
+ for (let i = 0; i < 338; i++) {
+ let cc = 127 + Math.floor(i * 128 / 337);
palette[686 + i] = 'rgb(' + cc + ',' + cc + ',255)';
}
palette[1024] = 'rgb(0,0,0)';
break;
case 'rainbow-linear1':
- for (var i = 0; i < 256; i++) {
+ for (let i = 0; i < 256; i++) {
palette[i] = 'rgb(' + i + ',0,0)';
palette[256 + i] = 'rgb(255,' + i + ',0)';
palette[512 + i] = 'rgb(' + (255 - i) + ',255,' + i + ')';
}
function drawPoint(context, img_x, img_y, C, iterMax) {
- var itVal = mandelbrotValue(C, iterMax);
+ let itVal = mandelbrotValue(C, iterMax);
context.fillStyle = getColor(itVal, iterMax);
context.fillRect (img_x, img_y, 1, 1); // x, y, width, height
}