Бесконечный лес на Javascript

Модель "лесного пожара" используется в прикладной математике как одна из типичных динамических моделей.

Реализуем её на JS, возможно, не совсем канонически задав параметры "леса" (плотность начального заполнения деревьями, скорость роста деревьев, вероятность возгорания, все значения от 0 до 1 включительно). Полученную модель анимируем обычными средствами <canvas> и таймером.

Вот приложение в работе и полный исходник (без обрамляющих тегов HTML).

<canvas id="forestcanvas" width="600" height="600">
Ваш браузер не поддерживает тег Canvas
</canvas>
<script type="text/javascript">
var forest = {
 X: 60, Y: 60, //размеры леса в клетках
 x: 10, y: 10, //размеры клетки - см. на размеры канвы в пикселах!
 propTree: 0.618, //плотность начального заполнения деревьями от 0 до 1
 propTree2:  0.01, //скорость роста деревьев от 0 до 1
 propBurn: 0.0001, //верятность возгорания от 0 до 1
 trees: [],
 colors: ['rgb(255,255,255)', 'rgb(0,255,0)', 'rgb(255,0,0)'],
 timeInterval: 20 //интервал обновления, милиисекунд
};
 
for (var i = 0; i < forest.Y; i++) { //начальное заполнение деревьями
 forest.trees[i] = [];
 for (var j = 0; j < forest.Y; j++) {
  forest.trees[i][j] = Math.random() < forest.propTree ? 1 : 0;
 }
}
 
function drawForest (forest) {
 var canvas = document.getElementById('forestcanvas');
 var c = canvas.getContext('2d');
 for (var i = 0; i < forest.X; i++) {
  for (var j = 0; j < forest.Y; j++) {
   c.fillStyle = forest.colors[forest.trees[i][j]];
   c.fillRect (forest.y*j, forest.x*i, forest.y*(j+1), forest.x*(i+1));
  }
 }
}
 
function setForest (forest) {
 var to = [];
 for(var i = 0; i < forest.Y; i++) {
  to[i] = forest.trees[i].slice(0);
 }
 //новый лес на следующем шаге:
 for (var i = 0; i < forest.Y; i++) {
  for (var j = 0; j < forest.Y; j++) {
   if (to[i][j] == 0) { //пусто
    forest.trees[i][j] = Math.random() < forest.propTree2 ? 1 : 0;
   } 
   else if (to[i][j] == 1) { //растёт
    if (
     ((i>0) && (to[i-1][j] == 2)) ||
     ((i<forest.Y-1) && (to[i+1][j] == 2)) ||
     ((j>0) && (to[i][j-1] == 2)) ||
     ((j<forest.X-1) && (to[i][j+1] == 2))
    ) {
     forest.trees[i][j] = 2;
    } 
    else {
     forest.trees[i][j] = Math.random() < forest.propBurn ? 2 : 1; //вырос новый
    }
   } 
   else if (to[i][j] == 2) { //сгорел...
    forest.trees[i][j] = 0;
   }
  }
 }
}
 
window.setInterval( function() { setForest (forest); drawForest (forest); }, forest.timeInterval);
</script>
<noscript>Извините, Javascript отключён или недоступен в вашем браузере</noscript>

01.10.2017, 14:46 [2289 просмотров]