Egret中使用TiledMap
2024-05-16 01:18:07
一、关于如何制作瓦片底图：http://www.skywind.me/blog/archives/427二、ts中TiledMap类/**** @author **/
'use strict';
module gtm{export class TiledMap {/**网格线 图层*/public lineScene: egret.Sprite = new egret.Sprite();/**障碍点 图层*/public pointScene: egret.Sprite = new egret.Sprite();public static PATH_UNKNOWN: number = -1; //未知数据public static PATH_PASS: number = 0; // 路径中 0 为可以通过public static PATH_BARRIER: number = 1; // 路径中 1 为障碍public static PATH_TRANSLUCENCE: number = 2; // 路径中 2 为半透明public TILE_WIDTH: number = 0; // A*格子宽public TILE_HEIGHT: number = 0; // A*格子高public MAP_WITDTH: number = 0; // 地图的宽public MAP_HEIGHT: number = 0; // 地图的高public MAP_X: number = 0; // X坐标最大public MAP_Y: number = 0; // Y坐标最大/*** 得到的地图数据是从0开始的* */public data: Array<any>; //地图数据/*** object层的数据* */public objectData:any;/*** 清空地图数据* */public dispose() {this.TILE_WIDTH = 0;this.TILE_HEIGHT = 0;this.MAP_WITDTH = 0;this.MAP_HEIGHT = 0;this.data = null;}/** * 判断A*地图从标是否可以通过的路 true 为可以通过 */public isPass(checkX: number,checkY: number): boolean {try{var mapWidth: number = this.MAP_X;var mapHeight: number = this.MAP_Y;if(checkX < 0 || checkX >= mapWidth || checkY < 0 || checkY >= mapHeight) {return false;}return this.data[checkY][checkX] != gtm.TiledMap.PATH_BARRIER ? true : false;}catch(e){console.warn("in IsPass " + e.toString());return false;}//return false;}/** * 判断地图上改点是否是透明点 */public isOpacity(checkX: number,checkY: number): boolean {var mapWidth: number = this.MAP_X;var mapHeight: number = this.MAP_Y;if(checkX < 0 || checkX >= mapWidth || checkY < 0 || checkY >= mapHeight) {return false;}return this.data[checkY][checkX] == gtm.TiledMap.PATH_TRANSLUCENCE;}/*** 像素坐标转换为地图坐标* */public SpaceToTiled(point: egret.Point): egret.Point {var y = Math.floor(point.y * 2 / this.TILE_HEIGHT) * this.TILE_HEIGHT / 2;var x = Math.floor(point.x * 2 / this.TILE_WIDTH) * this.TILE_WIDTH / 2;// var center: egret.Shape = new egret.Shape();
// center.graphics.lineStyle(2,0xff00ff);
// center.graphics.drawCircle(0,0,2);
// center.graphics.endFill();// center.x = x;
// center.y = y;
// this.pointScene.addChild(center);var leftPos: egret.Point = new egret.Point();var rightPos: egret.Point = new egret.Point();//console.log("x = " + Math.floor(point.x * 2 / this.TILE_WIDTH) + " y = " + Math.floor(point.y * 2 / this.TILE_HEIGHT))if((Math.floor(point.y * 2 / this.TILE_HEIGHT) % 2 == 0 && Math.floor(point.x * 2 / this.TILE_WIDTH) % 2 == 0) || (Math.floor(point.y * 2 / this.TILE_HEIGHT) % 2 == 1 && Math.floor(point.x * 2 / this.TILE_WIDTH) % 2 == 1)) {//表示定点在真确的tile中心点，只需要再花一个右下角的点
// var center1: egret.Shape = new egret.Shape();
// center1.graphics.lineStyle(2,0xffffff);
// center1.graphics.drawCircle(0,0,2);
// center1.graphics.endFill();
// center1.x = x + this.TILE_WIDTH / 2;
// center1.y = y + this.TILE_HEIGHT / 2;
// this.pointScene.addChild(center1);leftPos.x = x;leftPos.y = y;rightPos.x = x + this.TILE_WIDTH / 2;rightPos.y = y + this.TILE_HEIGHT / 2;} else {
// var center1: egret.Shape = new egret.Shape();
// center1.graphics.lineStyle(2,0xffffff);
// center1.graphics.drawCircle(0,0,2);
// center1.graphics.endFill();
// center1.x = x;
// center1.y = y + this.TILE_HEIGHT / 2;
// this.pointScene.addChild(center1);// var center2: egret.Shape = new egret.Shape();
// center2.graphics.lineStyle(2,0xffffff);
// center2.graphics.drawCircle(0,0,2);
// center2.graphics.endFill();
// center2.x = x + this.TILE_WIDTH / 2;
// center2.y = y;
// this.pointScene.addChild(center2);leftPos.x = x;leftPos.y = y + this.TILE_HEIGHT / 2;rightPos.x = x + this.TILE_WIDTH / 2;rightPos.y = y;}if(egret.Point.distance(leftPos,point) <= egret.Point.distance(rightPos,point)) {/*if (Global.isRelease == false){var center: egret.Shape = new egret.Shape();center.graphics.lineStyle(2,0xffffff);center.graphics.drawCircle(0,0,2);center.graphics.endFill();center.x = leftPos.x;center.y = leftPos.y;this.pointScene.addChild(center);}*/return new egret.Point(Math.round(leftPos.x / this.TILE_WIDTH) - 1,leftPos.y * 2 / this.TILE_HEIGHT - 1);} else {/*var center: egret.Shape = new egret.Shape();center.graphics.lineStyle(2,0xffffff);center.graphics.drawCircle(0,0,2);center.graphics.endFill();center.x = rightPos.x;center.y = rightPos.y;this.pointScene.addChild(center);*/return new egret.Point(Math.round(rightPos.x / this.TILE_WIDTH) - 1,rightPos.y * 2 / this.TILE_HEIGHT - 1);}}/*** tile坐标转为像素坐标* */public TiledToSpace(point: egret.Point): egret.Point {var y = this.TILE_HEIGHT * (point.y + 1) / 2;var x = (point.x + ((point.y) % 2 / 2.0) + 0.5) * this.TILE_WIDTH;return new egret.Point(x,y);}public drawTile() {var n1: number = this.TILE_HEIGHT / 2;var n2: number = this.TILE_WIDTH / 2;var m1: number = Math.round(this.MAP_HEIGHT / this.TILE_HEIGHT * 2);for(var i: number = 0;i < m1;i++) {this.line_A(n2,0,0,n1);this.line_A(0,this.MAP_HEIGHT - n1,n2,this.MAP_HEIGHT);n1 += this.TILE_HEIGHT;n2 += this.TILE_WIDTH;}}private line_A(a: number,b: number,c: number,d: number): void {var shp: egret.Shape = new egret.Shape();//shp.graphics.lineStyle(1,0x00ff00);//绿色shp.graphics.lineStyle(1,0x00ff00);//白色shp.graphics.moveTo(a,b);shp.graphics.lineTo(c,d);shp.graphics.endFill();this.lineScene.addChild(shp);}public drawPo() {for(var i = 0;i < this.MAP_Y;i++) {for(var j = 0;j < this.MAP_X;j++) {var t = this.data[i][j];if(parseInt(t) != gtm.TiledMap.PATH_PASS) {//画中心点var center: egret.Shape = new egret.Shape();if(parseInt(t) == gtm.TiledMap.PATH_BARRIER) center.graphics.lineStyle(2,0xff0000);if(parseInt(t) == gtm.TiledMap.PATH_TRANSLUCENCE) center.graphics.lineStyle(2,0x0000ff);center.graphics.drawCircle(0,0,6);center.graphics.endFill();var sPos = this.TiledToSpace(new egret.Point(j,i));center.x = sPos.x;center.y = sPos.y;this.pointScene.addChild(center);}}}}public constructor(mapData: any) {//json格式的数据for(var count: number = 0,length: number = mapData.length;count < length;count++) {var lineArr = mapData[count];this.TILE_WIDTH = parseInt(lineArr["TileWidth"]);this.TILE_HEIGHT = parseInt(lineArr["TileHeight"]);this.MAP_WITDTH = parseInt(lineArr["MapWidth"]);this.MAP_HEIGHT = parseInt(lineArr["MapHeight"]);this.MAP_X = parseInt(lineArr["X"]);this.MAP_Y = parseInt(lineArr["Y"]);var scenePoint = lineArr["data"];var sArray = new Array();var msgZu: String[] = scenePoint.split(",");//分割消息var n: number = 0;for(var k = 0;k < this.MAP_Y;k++) { //一维长度为i,i为变量，可以根据实际情况改变sArray[k] = new Array(); //声明二维，每一个一维数组里面的一个元素都是一个数组；for(var j = 0;j < this.MAP_X;j++) { //一维数组里面每个元素数组可以包含的数量p，p也是一个变量；sArray[k][j] = msgZu[n]; //这里将变量初始化，我这边统一初始化为空，后面在用所需的值覆盖里面的值n += 1;}}this.data = sArray;this.objectData = lineArr["object"];
// this.drawTile();
// this.drawPo();}}}
}
Egret中使用TiledMap相关推荐
- Egret中使用P2物理引擎
游戏中的对象按照物理规律移动,体现重力.引力.反作用力.加速度等物体特性,实现自由落体.摇摆运动.抛物线运动,以及物理碰撞现象的模拟.用于模拟物理碰撞.物理运动的引擎称为物理引擎. 来自瑞典斯德哥尔 ...
- Egret中颜色矩阵和滤镜的使用与介绍
一:颜色矩阵 颜色矩阵说明 颜色矩阵数据说明: 实际的颜色值由下面的公式决定: redResult = (a[0] * srcR) + (a[1] * srcG) + (a[2] * srcB) + ...
- egret中loadingUI的自定义
loadingUI中是加载资源,此时如果想自定义loadingUI界面,那么此刻正在加载的图片肯定不能用了. 解决方法就是使用服务器资源 直接加载服务器资源就好了 class LoadingUI ex ...
- 在egret中自制帧动画
egret项目启动后首先展示的是body,项目小资源少网络好的时候body很快闪过,然后呈现游戏场景.但我们项目很大,老板要求在最开始出现body的时候就展示loading动画,此时用不了egret的 ...
- Egret中p2.js用法示例及解析_小球落地
在线运行地址 点我网页看效果 扫描二维码手机看效果 Egret 和 p2.js 坐标对比图 p2.js库的引用 地面被我注释掉了,需要的话将其中两端注释(L50-55,L105)去掉即可.代码里我没有 ...
- 如何在Egret中启动Matchvs联网云服务
目前,Egret已经与游戏服务器引擎Matchvs达成深度合作,后者提供的联网与GS服务端框架服务已全面接入Egret引擎的工作流.以下是Matchvs在Egret引擎中的启用教程. 步骤一: 打开, ...
- egret发布的HTML5项目怎么打开,Egret引擎开发指南之发布项目
在Egret中,使用发布功能也非常的简单.你只需要使用如下命令即可: egret publish HelloWorld 此命令中egret publish为发布命令,HelloWorld是你当前项目的 ...
- egret键盘事件监听
document.addEventListener("keydown", function (event: any) {//alert(event.key);//console.l ...
- TextureMerger1.6.6 一：Egret MovieClip的制作和使用
本随笔记录TextureMerger来制作动画,并在Egret中使用. 参考官网教程:http://bbs.egret.com/forum.php?mod=viewthread&tid=918 ...
最新文章
- 函数功能MATLAB
- jS四种函数的调用方式
- 2019年值得关注的八大DevOps趋势
- 阿里云开启多媒体搜索新时代，发布全域精准图像搜索
- Tyvj P1424 占卜DIY
- 十分钟看懂时序数据库（III）- 压缩
- pyecharts line_base绘图只有坐标轴，数据不再数轴上显示
- Linux复习资料——CentOS7下安装MySQL5.7.22（完整版本）
- MongoDB最简单的入门教程之五-通过Restful API访问MongoDB
- python人脸照片分类_Python OpenCV 人脸识别（一）
- alfred 4 (mac提升效率工具)
- Android TextView和EditText属性详解
- JavaScript小练习2
- 个人电话号码查询系统
- IE浏览器F12无法使用
- TreeMap排序是怎么样的？
- sql 一张表递归_查看我的递归视觉指南（因为一张图片价值1,000字）
- 直线回归和相关------（二）直线回归的假设测验和区间估计以及matlab实现
- 英语发音规则---I字母
- 【Shell】mksh运行分析