【教程】Javascript构建45度地图

wungking

来自：http://www.webgamei.com/club/thread-74694-1-1.html

从接触游戏开始，RPG类游戏始终是我最喜欢的游戏类型。所以，决定研究一下用JS如何构建45度视角的游戏地图。先来看一下最终效果



如图所示，我们将构建一个包含15*15=225个区块的地图。如果是平面地图，应该刚好是一个正方型，而因为地图是45读视角，因此看起来却是扁长扁长的。下面来看一下原材料：

地图背景一张：

循环用区块网格图一张：


光标位置显示图一张（线条为白色，估计在网页下看不清楚了）：


工作原理：以屏幕上指定点(x,y)为原点(0,0)创建45度俯视地图

源代码中进行了比较详细的注释，运行demo.html查看运行效果。