【Cocos Creator】（二）摄像机旋转——>地图旋转

最新推荐文章于 2025-07-05 12:20:23 发布

SuperWiwi

最新推荐文章于 2025-07-05 12:20:23 发布

阅读量2.2k

点赞数

CC 4.0 BY-SA版权

分类专栏：游戏引擎

本文链接：https://blog.youkuaiyun.com/qq_36622009/article/details/99056279

本文介绍了在Cocos Creator中如何实现摄像机随游戏进程旋转，从而改变地图的观察角度。通过设置地图及其子物体的anchor为(0.5, 0.5)来实现地图绕中心旋转，然后解决地图旋转后的坐标转换问题，确保摄像机能正确对齐地图上的点。文章涉及关键步骤包括确定旋转时机和角度，以及坐标系统的统一。" 102812711,6673634,自动化更新Github代码：Git批处理脚本,"['git', '自动化工具', '版本控制', '代码管理']

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

需求：

希望随着游戏进程，摄像机能够旋转，从别的角度观察地图。

思路：

修改摄像机的node中的rotation对视野没有任何影响，即摄像机旋转无效。改用地图旋转。
地图应该绕着anchor（0.5,0.5）旋转，所以把地图及其子物体/父物体的anchor都改为（0.5,0.5）
地图旋转之后，它的坐标系就发生了变化。对于地图上的点来说，它要和mousePos（世界坐标）相比较，就必须重新进行坐标系转换：要么把坐标都统一到世界坐标下，要么都统一到地图坐标下。
地图旋转之后，摄像机要和地图上的点对齐。这就涉及到摄像机的坐标和地图上的点比较的问题，同样需要统一坐标。

代码：

1.什么时候地图应该旋转？旋转多少度？

////////////////////////////////cameraControl
rotateMap(startPos,nextPos){

        //把startPos和nextPos从mapBox的坐标系转换成世界坐标(convertToNodeSpaceAR()函数的参数必须是世界坐标)
        //再转换到map坐标系（camera所在坐标系）
        var r_start=this.map.convertToNodeSpaceAR(this.mapBox.convertToWorldSpaceAR(startPos));
        var r_next=this.map.convertToNodeSpaceAR(this.mapBox.convertToWorldSpaceAR(nextPos));
 
        //判断start和next在map坐标系下的相对位置，决定是否旋转
        if(r_next.y<r_start.y){
              if(r_next.x>r_start