БлогNot. Математические фракталы

Математические фракталы

Этот фрактал математический потому, что не использует какие-либо контуры или уравнения, а целиком полагается на математику и бога Рандома.

Я не стал как в предыдущем случае делать "плавающий" блок интерфейса, а включил генерацию случайных параметров непосредственно в код, в формулах они выделены цветом.

В цикле по всем пикселям канвы мы вычисляем цвет очередного пикселя (x, y) следующим образом:

let qx = r * (Math.sin(fi * x * y / denom) + mult1_x * Math.sin(mult2_x * fi * y));
let qy = r * (Math.sin(fi * y * x / denom) + mult1_y * Math.sin(mult2_y * fi * x));
let red = Math.round(Math.abs(qy)) % 255;
let green = Math.round((Math.abs(qy + qx)) % 255);
let blue = Math.round(Math.abs(qx)) % 255;
putpixel (x, y, {R:red, G:green, B:blue, A:255});

где

let r = first ? 282 : getRandomInt(-3000, 3000);
let fi = Math.PI / size * 2 + (first ? 0.001 : getRandomDouble(-0.045, 0.045));
fi = fi.toFixed(5);
if (Math.abs(fi) < 1e-6) fi = 0.0005;
let denom = first ? 500 : getRandomInt(-1000, 1000);
let mult1_x = first ? -0.5 : getRandomDouble(-3, 3);
let mult1_y = first ? -1.5 : getRandomDouble(-3, 3);
let mult2_x = first ? 1.95 : getRandomDouble(-3, 3);
let mult2_y = first ? 1.85 : getRandomDouble(-3, 3);

Благодаря сбросу переменной first, только первая картинка всегда одинакова, так как служила отладочной, дальше повторений не будет.

Разумеется, как сами соотношения, так и границы допустимых значений аргументов в вызовах методов getRandomInt, getRandomDouble можно и нужно менять, наверняка есть варианты устойчивей и красивей, но идея делать цвет пикселя зависимым от чудес синуса и косинуса, скорее всего, останется при любом раскладе.

Набросок подобного фрактала ранее встречался в блоге аж вот здесь, но там я просто подобрал несколько вариантов отрисовки вручную.

При клике по канве каждый раз создаётся новый рисунок, а его параметры, размер и дата/время генерации выводятся под ней:

r/fi/denom/mult1_x/mult1_y/mult2_x/mult2_y: 127/0.02138/622/-2/3/-3/-3; 686px; 11.03.2026, 21:16:01
r/fi/denom/mult1_x/mult1_y/mult2_x/mult2_y: 127/0.02138/622/-2/3/-3/-3; 686px; 11.03.2026, 21:16:01

Как часты во Вселенной красивые структуры, а не просто белый шум или резкий разлом?

Исходник можно увидеть и/или скопировать со страницы скрипта. Для этого во вкладке приложения щёлкните правой кнопкой мыши на свободном месте и выберите пункт меню "Исходный код страницы", "Просмотреть исходный код" и т.п., название пункта зависит от браузера. Предполагается, что файл будет сохранён с типом .html в кодировке Юникода UTF-8.

Сохранить полученное изображение можно, щёлкнув на нём правой кнопкой мыши и выбрав пункт меню "Сохранить картинку как...", "Сохранить изображение как..." и т.п. (название пункта зависит от браузера).

 Открыть скрипт MathFractal.html в текущем окне/вкладке (5 Кб)

11.03.2026, 22:10 [176 просмотров]


теги: графика javascript математика random

К этой статье пока нет комментариев, Ваш будет первым