Случайная генерация ландшафта и рендеринг

PHP/JS+HTML+CSS/Python/др.

Оцените Мою Работу!

Хорошо
3
100%
Не очень
0
0%
Плохо
0
0%
Всего голосов : 3

Сообщение Случайная генерация ландшафта и рендеринг
» 07 янв 2018, 21:35

Всем привет. Ехал я как-то в маршрутке и вот скучно стало; достал я свой Lenovo, открыл HTML Editor и начал программировать:

 скрипт вставьте в браузер и заработает ;)
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>New Miner</title>
</head>
<body>

<canvas style="border: 1px solid" width="345px" height="200px" id="canvas"></canvas>

<h1 align="center">

<br/>

<input type="button" id="up" value="|" onclick="ub()"/><br/>

<input type="button" id="left" value="—" onclick="left()"/>

<input type="button" id="stop" value="+" onclick="stop()"/>

<input type="button" id="right" value="—" onclick="right()"/><br/>

<input type="button" id="down" value="|" onclick="down()"/><br/>

<label id="lab"></label>

</h1>

<script type="text/javascript">

var canvas = document.getElementById('canvas');
var context = canvas.getContext('2d');

var save = new Array ();

var mov = "stop";

var moving = setInterval(function(){
document.getElementById('lab').innerHTML = mov;
if(mov == "up") {
y--;
};
if(mov == "left") {
x--;
};
if(mov == "right") {
x++;
};
if(mov == "down") {
y++;
};
},1000/fps);

function ub() {
mov = "up";
};

function left() {
mov = "left";
};

function stop() {
mov = "stop";
};

function right() {
mov = "right";
};

function down () {
mov = "down";
};

var resFps = 1;

var count = 0;

var grid = 32;

var width = 100;
var height = 50;

var x = 0;
var y = (height/2)*32;

var random;

var up = height/2;

reset();
generation();

function generation() {
for( var i = 0; i < width; i ++) {
random = Math.floor(Math.random()*3);
up += (random -1);
save [ i ] [ up ] = 1;
save [ i ] [ up - 1 ] = 2;
save [ i ] [ up + 1 ] = 1;
save [ i ] [ up + 2 ] = 3;
save [ i ] [ up + 3 ] = 3;
save [ i ] [ up + 4 ] = Math.floor(Math.random()*2) + 3;
save [ i ] [ up + 5 ] = Math.floor(Math.random()*2) + 3;
save [ i ] [ up + 6 ] = Math.floor(Math.random()*2) + 3;
save [ i ] [ up + 7 ] = Math.floor(Math.random()*2) + 3;
};
};

function reset() {
for( var i = 0; i < width; i ++) {
save [ i ] = new Array ();
for( var j = 0; j < height; j ++) {
save [ i ] [ j ] = 0;
};
};
count ++;
};

var fps = 30;

var render = setInterval( function () {
context.clearRect(0, 0, 350, 200);
for( var i = 0; i < width; i ++ ) {
for( var j = 0; j < height; j ++) {
if( save [ i ] [ j ] == 1) {
context.fillStyle = 'orange'
context.fillRect(i*grid-x, j*grid-y, grid, grid);
context.fillStyle = 'brown';
context.fillRect(i*grid+4*grid/32-x, j*grid+4*grid/32-y, grid-(4*2*grid/32), grid-(4*2*grid/32));
};
if( save [ i ] [ j ] == 2) {
context.fillStyle = 'green'
context.fillRect(i*grid-x, j*grid-y, grid, grid);
context.fillStyle = 'brown';
context.fillRect(i*grid+4*grid/32-x, j*grid+4*grid/32-y, grid-(4*2*grid/32), grid-(4*2*grid/32));
};
if( save [ i ] [ j ] == 3) {
context.fillStyle = 'black'
context.fillRect(i*grid-x, j*grid-y, grid, grid);
context.fillStyle = 'gray';
context.fillRect(i*grid+4*grid/32-x, j*grid+4*grid/32-y, grid-(4*2*grid/32), grid-(4*2*grid/32));
};
if( save [ i ] [ j ] == 4) {
context.fillStyle = 'gray'
context.fillRect(i*grid-x, j*grid-y, grid, grid);
context.fillStyle = 'white';
context.fillRect(i*grid+4*grid/32-x, j*grid+4*grid/32-y, grid-(4*2*grid/32), grid-(4*2*grid/32));
};
};
};
}, 1000/fps);


</script>

</body>
</html>


Этот скрипт генерирует рандомный ландшафт по типу 2д майнкрафта и рендерит его в виде квадратиков. Перемещаться можно с помощью кнопок под канвасом. Я сделал кнопки на экране поскольку я делал все на смартфоне. ;)

Можете (если кому-то это надо) пользоваться этим скриптом как фреймворком.

Но вот у меня есть одна проблема: когда я писал скрипт (а это было давно) с кнопками все было нормально, но вот когда недавно открыл кнопки почему-то стоят немного кривой. Это только у меня на моём Лениво или на компах то же самое? Если это так, то как это исправить?
Сколько языков программирования ты знаешь — столько раз ты ПРОГРАММИСТ!

 Мои проекты
Rect JS Engine: viewtopic.php?f=116&t=14949
INI Editor Pro: viewtopic.php?f=14&t=13354
Симулятор Бомжа: viewtopic.php?f=116&t=13457
Mineсraft 2D JS: viewtopic.php?f=116&t=13642
Змейка на JS: viewtopic.php?f=116&t=13990
Project Sinus JS: viewtopic.php?f=116&t=13837

Black Square

Моя Музыка
Аватара пользователя

Участник
Сообщений: 192
Я тут с 03 фев 2017
Откуда: Киев
Двиг: C2, СC, JS
Лицензия: Business
Skype: sviatkoslav@gmail.co
Репутация 11 [ ? ]


Вернуться в Web

Сейчас эту тему просматривают

Зарегистрированные пользователи: нет зарегистрированных пользователей

Наверх