随着近年Html5技术的逐渐兴起,Web技术变得越来越强大,能做的事情也越来越多。以前Web技术主要运用在建设网站等方面,现在随着Canvas和WebGL技术的出现,越来越多的开发者开始运用Html5技术来开发游戏。本文运用敏捷开发的思想和Canvas技术提炼了一个2D游戏引擎,开发了一款具备生产、建造、资源采集、战斗、地图迷雾等RTS要素的即时战略游戏。对于2D游戏引擎,本文重点实现了核心类、动画、事件管理、资源加载等框架,提出了工具类和UI类等通用组件。核心类实现了主循环、场景、层和精灵等内容,并向用户提供了钩子方法,增强了引擎的可扩展性。动画框架与TexturePacker工具结合,用户可直接使用该工具创建动画帧数据,并通过动画框架提供的三种方式来生成精灵动画。事件管理框架支持鼠标和键盘事件的监听和管理。资源加载框架支持图片和json文件的加载,资源管理类进行统一调度。对于游戏,本文实现了RTS游戏的核心要素,重点研究了地图滚动、精灵遮挡、精灵移动、战斗这几个方面。在地图滚动的实现中,本文参考了2D游戏中滚动的实现,并加以扩展,应用到了本文的2.5D游戏中,实现了地图边缘的平行滚动。精灵遮挡对于2.5D游戏是一个难点,本文通过提出zOrder属性和对精灵按遮挡排序的方法解决了该问题。精灵移动对于即时战略游戏来说也是一个大问题,本文采用A*和Steer算法解决了精灵静态和动态寻路的问题。在战斗功能的开发中本文提出了攻击点和被攻击点的概念,实现了精灵的近战攻击和远程攻击。