|
|
|
Канал Игры Мечты: «Закат солнца вручную: из GameMaker в JS+HTML5» |
|
|
БулерМэн
420 EGP
   Рейтинг канала: 2(21) Репутация: 68 Сообщения: 1580 Откуда: Гороховец Зарегистрирован: 07.02.2006
 |
|
Демо: http://furnitura.bget.ru/game/game_prototype_3.html
Как вам известно наверное, игровой движок GMS умеет сохранять игры в играбельный JS+HTML5 код.
Мне лень разбираться в тонкостях и особенностях кода GameMaker Studio для портирования из старой в новую версию, и решил преобразовывать свои творения в вожделенный "web-based" при помощи палки, веревки и рук.
Сразу поясню, что задача передо мной стоит следующая: при минимальном изменении кода на GML перенести игры в JS+SVG+HTML5 вид.
Зачем это нужно? Все просто - возможность реализовать сетевое взаимодействие, мультиплеер, играть через браузер и не писать бинарник, который никому не упал не удобен. К тому же, GMS - проприетарное ПО, и как-то вот платить за то, что и сам могу сделать, как-то не камильфо.
Собственно это вызов самому себе, как обычно.
В общем, то что есть на данный момент:
https://yadi.sk/i/_jU1LTzB3Hpu9s
Демонстрация того, как крутятся два кораблика на белом фоне.
В чем фишка? А в том, что все это реализовано через события и объекты, как и в GameMaker.
В данный момент мы видим событие STEP и DRAW.
В событии STEP происходит увеличение счетчика угла поворота, а в событии DRAW - отрисовка "спрайтов" корабликов.
На видео - FPS очень мал, примерно 16 FPS. Свои пять копеек вносит утилита захвата видео. Без нее - 21 FPS.
Этого мало. Основные тормоза в том, через что я рисую SVG - а именно, зачем-то обновляю весь холст каждые 1/30 секунды.
А так как это все-таки изменение DOM - то здравствуй тормоза!
Можно попробовать видоизменять объекты без очистки холста, как собственно и задумывалось изначально в этом самом SVG. Может, это так же ничего не даст и придется довольствоваться 20FPS, как в случае с прожектом "волн в океане".
Спасибо за внимание
добавлено спустя 22 минуты:
Немного вкусноты на тему HTML5 canvas и оптимизаций приложений:
https://habrahabr.ru/post/127014/
2011 год, однако, отстаю.
добавлено спустя 10 минут:
Погуглил и стало понятно, что оптимизировать нечего:
https://habrahabr.ru/company/microsoft/blog/141482/
демонстрационная анимация показывает 24 FPS, не сильно отличается от моего результата. Правда, я использую отрисовку текста, а это изрядно кушает ресурсы, как ни странно.
Последний раз редактировалось: БулерМэн (15:45 17-05-2017), всего редактировалось 4 раз(а) |
|
|
Zachesa
151 EGP
  Рейтинг канала: 4(95) Репутация: 13 Сообщения: 1420 Откуда: Хабаровск Зарегистрирован: 12.11.2007
 |
|
Статьи с Хабра старые. http://jsfiddle.net/nxjSR/1/ Проверил на лисе хроме и в опере. В лисе 50, в других по 60, при чём все три браузера запущены были одновременно. Комп средненький по нынешним меркам. На планшете надо попробовать.
JS+HTML5 последнее время стал интереснее.
_________________ Язык Образов, для ситуационного моделирования, программирования и как язык мысли, думающей машины. |
|
|
БулерМэн
420 EGP
   Рейтинг канала: 2(21) Репутация: 68 Сообщения: 1580 Откуда: Гороховец Зарегистрирован: 07.02.2006
 |
|
Zachesa : |
Проверил на лисе хроме и в опере.
|
Возможно, зависит от версии браузера.
добавлено спустя 6 минут:
хм. в 49 хроме - тест http://jsfiddle.net/nxjSR/1/ показывает 29 fps
Но у меня и компьютер давно уже не средний. Одноядерный, 2ггц
добавлено спустя 4 минуты:
на рабочем компе где двухЪядерный процессор и старая лиса 39 версии - 60 FPS.
Так что зависит напрямую от железа.
добавлено спустя 3 минуты:
Из чего делаю вывод, что нужно ограничивать FPS самой анимации, во избежание непредсказуемого поведения игры.
Последний раз редактировалось: БулерМэн (22:02 09-05-2017), всего редактировалось 3 раз(а) |
|
|
БулерМэн
420 EGP
   Рейтинг канала: 2(21) Репутация: 68 Сообщения: 1580 Откуда: Гороховец Зарегистрирован: 07.02.2006
 |
|
Итак, вот вам результат: игрушка на JS+SVG, со звуками, анимацией кое-какой, картой космоса и радаром
И самое главное - космос бесконечен.
http://furnitura.bget.ru/game/game_prototype_3.html
ЗЫ Кто найдет секретный объект тот молодец Объект недалеко от точки старта
ЗЫЫ Мультиплеер будет позже
Собственно, игра, которую переписывал: https://yadi.sk/i/efpN4kdpnr66H
Последний раз редактировалось: БулерМэн (06:11 17-05-2017), всего редактировалось 3 раз(а) |
|
|
CatSam
318 EGP
   Рейтинг канала: 2(21) Репутация: 35 Сообщения: 1804 Откуда: Краснодар - Москва Зарегистрирован: 20.02.2009
 |
|
БулерМэн : |
секретный объект
|
Звезду что-ли? При окунании в которую музончик врубается?
Вот только игра должна цель иметь какую-то. Какая у этой?
З.Ы. Управление, кстати, тугое, будто на тракторе, а не на звездолёте. =\
_________________ ψ Корпус - мать, Корпус - отец! ψ |
|
|
БулерМэн
420 EGP
   Рейтинг канала: 2(21) Репутация: 68 Сообщения: 1580 Откуда: Гороховец Зарегистрирован: 07.02.2006
 |
|
CatSam : |
Вот только игра должна цель иметь какую-то. Какая у этой?
|
Глобальная цель - увеличение зоны влияния отдельного игрока либо группы игроков.
Раскрывать всю концепцию игры я конечно же не буду
Сначала нужно реализовать то, что задумано, а по ходу реализации - буду сообщать и давать пробовать поиграть
CatSam : |
Управление, кстати, тугое, будто на тракторе, а не на звездолёте. =\
|
С учетом пожеланий - повороты сделал быстрее
Последний раз редактировалось: БулерМэн (14:55 17-05-2017), всего редактировалось 2 раз(а) |
|
|
Krom
455 EGP
   Рейтинг канала: 1(3) Репутация: 159 Сообщения: 1988 Откуда: Горы Урала Зарегистрирован: 19.07.2005
 |
|
Управление такое от того, что введены не вполне объяснимые условия в манипуляциях скоростью. Вот:
Код: |
if(o_dummy.speed > 0 && abs(player.force_vector - player.image_angle)< 90) |
Скорости так-то всё равно, больше или меньше 90 градусов тот угол, под которым сила приложена. Можно же просто складывать вектора, как в школе, разве нет?
_________________ Не спешите меня. |
|
|
БулерМэн
420 EGP
   Рейтинг канала: 2(21) Репутация: 68 Сообщения: 1580 Откуда: Гороховец Зарегистрирован: 07.02.2006
 |
|
Krom : |
Можно же просто складывать вектора, как в школе, разве нет?
|
поясни, как именно
добавлено спустя 3 минуты:
В управлении есть затык, спасибо, что нашел проблемное место.
Последний раз редактировалось: БулерМэн (15:50 17-05-2017), всего редактировалось 1 раз |
|
|
Krom
455 EGP
   Рейтинг канала: 1(3) Репутация: 159 Сообщения: 1988 Откуда: Горы Урала Зарегистрирован: 19.07.2005
 |
|
БулерМэн : |
между вектором тяги, направлением полета и смещением есть прямая связь через формулу?
|
Код: |
V.x = V.x + a.x*dt, где dt - межкадровый интервал времени, а>0 только когда работают двигатели
V.y = V.y + a.y*dt
if (|V| > top_speed) then V = V * ( top_speed / |V| ) - скорость нормируется на максимальное допустимое значение скорости по модулю
x = x + V.x * dt
y = y + V.y * dt |
_________________ Не спешите меня.
Последний раз редактировалось: Krom (16:08 17-05-2017), всего редактировалось 2 раз(а) |
|
|
БулерМэн
420 EGP
   Рейтинг канала: 2(21) Репутация: 68 Сообщения: 1580 Откуда: Гороховец Зарегистрирован: 07.02.2006
 |
|
Krom : |
V.x = V.x + a.x*dt,
|
Наверное это псевдокод или я язык не распознал...
То есть судя по тому, что есть некое a.x - ускорение, нужно вычислить координаты этого самого (a.x, a.y) исходя из угла поворота, я правильно понимаю?
|
|
|
Krom
455 EGP
   Рейтинг канала: 1(3) Репутация: 159 Сообщения: 1988 Откуда: Горы Урала Зарегистрирован: 19.07.2005
 |
|
Да, это псевдокод. Под .x/.y понимаются декартовы компоненты векторов скорости и ускорения, и да, они вычисляются через угол image_angle:
Цитата: |
a.x = main_acceleration * cos(image_angle) + LR_acceleration * sin(image_angle)
a.y = main_acceleration * sin(image_angle) - LR_acceleration * cos(image_angle)
|
Знаки зависят от системы координат. Считал что положительные направления осей вверх-вправо, и отсчет угла против часовой стрелки от X+, как в учебнике геометрии.
В текущем виде, кстати, тоже интересно, но похоже на самолетную динамику, потому как при развороте на 180 и ускорении в обратную сторону скорость нигде не переходит через ноль.
_________________ Не спешите меня. |
|
|
БулерМэн
420 EGP
   Рейтинг канала: 2(21) Репутация: 68 Сообщения: 1580 Откуда: Гороховец Зарегистрирован: 07.02.2006
 |
|
Добавил столкновения, работает весьма занятно, если не сказать оригинально см. collision_check(), collision_circle().
То что это действительно работает и вроде даже не тормозит игру - можно проверить по все той же ссылке:
http://furnitura.bget.ru/game/game_prototype_3.html
Специально вставил alert() с сообщением, о том что произошло столкновение.
Единственный костыль это то, что приходится задавать радиус столкновения для каждого объекта, т.к. размер спрайта я не определяю сразу при старте игры, а надо бы. (занес в TODO лист, это обязательно)
Krom : |
Да, это псевдокод.
|
Будет очень полезно внести нормальную динамику управления. Думаю это немного потерпит, кораблик уже летает и управляем в принципе. То что это сделаю это точно, а то кораблик разворачивается странно если дать задний ход
Вопрос к запускающим игру - под какими версиями смотрите и что не работает? - пишите тут, а то у меня столько браузеров разных нет
Последний раз редактировалось: БулерМэн (04:42 19-05-2017), всего редактировалось 3 раз(а) |
|
|
|
|
|
Канал Игры Мечты: «Закат солнца вручную: из GameMaker в JS+HTML5» |
|