Реалистичный ландшафт в 130 строчках на JavaScript

Minecraft, Terragen, Skyrim и любой авиасимулятор используют свои генераторы ландшафта. Благодаря фрактальному генератору ландшафтов PlayfulJS каждый может почувствовать себя в роли Бога. [демо] [исходный код]

Ландшафт генерируется в виде карты высот, двухмерной матрицы значений, которые соответствуют высоте каждой точки на плоскости. С такой простой структурой данных можно отображать картинку любым способом: canvas, webgl и т.д. Главное ограничение — невозможность прокладывать туннели, пещеры и тому подобные вещи в ландшафте.

function Terrain(detail) {   this.size = Math.pow(2, detail) + 1;   this.max = this.size - 1;   this.map = new Float32Array(this.size * this.size); }

Алгоритм можно применить на любых размерах карты, но разработчики рекомендуют использовать степень 2 плюс 1.

Сам алгоритм работает по простому шаблону: разделяем территорию на четыре части и изменяем их высоту на случайное число. Далее проделываем ту же операцию с каждой из четырёх частей, каждый раз уменьшая диапазон случайных чисел, так что сначала генератор создаёт наиболее крупные детали, а затем — всё менее заметные. Это алгоритм случайного смещения средней точки на плоскости (midpoint displacement).

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

divide(this.max);  function divide(size) {   var x, y, half = size / 2;   var scale = roughness * size;   if (half < 1) return;    for (y = half; y < self.max; y += size) {     for (x = half; x < self.max; x += size) {       square(x, y, half, Math.random() * scale * 2 - scale);     }   }   for (y = 0; y <= self.max; y += half) {     for (x = (y + half) % size; x <= self.max; x += size) {       diamond(x, y, half, Math.random() * scale * 2 - scale);     }   }   divide(size / 2); }