Делаю изометрическу браузерку, для работы с canvas использую
https://github.com/batiste/sprite.js/
Вот демка моей игры на старичке HTC HD2 + Opera Mobile. Это без использования ScrollingSurface, поэтому радиус видимости пришлось уменьшить.
http://www.youtube.com/watch?v=l3c-cmWUVrc
На ПК радиус всего в 3 раза больше, но всеравно это нехило грузит систему.
Отрисовка каждого тайла отдельно хавает очень много ресурсов, поэтому в sprite.js есть такая фича как
ScrollingSurface object
Насколько я понял, она сначала размещает все спрайты на что-то типа `buffer.ctx`, а потом просто отрисовывает его. В описании заявлено об автоматической перерисовке только тех частей, которые были изменены. Вроде идея хорошая, да и демка работает шустро даже на мобиле:
http://batiste.dosimple.ch/sprite.js...scrolling.html
Но при попытке добавить туда те самые `изменяющиеся спрайты` - изменения тупо не отображаются, а функция
surface.update()
обновляет только координаты этого самого surface`а, если они были изменены.
Вот моя неудачная попытка - тот же test_scrolling.html, но сначала должны появиться тайлы 5х5, а потом через 5 секунд возле них еще столько же:
https://github.com/Sektoid/sprite.js...scrolling.html
На деле же отображаются только первые спрайты + надо в файле
scrolling.js вместо
this.divider = 2.0
поставить
this.divider = 1.0
, чтоб оно правильно отрисовывало, а не 4 раза подряд.
Форума по sprite.js нету, хотя библиотека довольно шустрая и удобная и на гитхабе много кто за ней следит и использует. Может кто работал с ней или сможет разобраться в чем дело? Просто я учил javascript сам и не в силах пока-что понять, то ли я что-то неправильно делаю, то ли там ошибка
Но вроде все правильно сделал.