cc.Vec2
1: cc.Vec2 二维向量坐标, 表结构{x: 120, y: 120}; cc.v2(x, y) 创建一个二维向量 cc.p() 创建一个二外向量;
2: cc.pSub: 向量相减;
3: cc.pAdd: 向量相加;
4: cc.pLength: 向量长度;

cc.Size/cc.Rect
1: cc.Size: 包含宽度和高度信息的对象 {width: 100, height: 100};
2: new cc.Size(w, h), cc.size(w, h)创建一个 大小对象;
3: cc.Rect: 矩形对象 new cc.Rect(x, y, w, h); cc.rect(x, y, w, h); {x, y, width, height};
4: contains(Point): 点是否在矩形内;
5: intersects : 两个矩形是否相交;

creator坐标系
1: 世界(屏幕)坐标系;
2: 相对(节点)坐标系,两种相对节点原点的方式(1) 左下角为原点, (2) 锚点为原点(AR);
3: 节点坐标和屏幕坐标的相互转换; 我们到底使用哪个?通常情况下带AR;
4: 获取在父亲节点坐标系下(AR为原点)的节点包围盒;
5: 获取在世界坐标系下的节点包围盒;
6: 触摸事件对象世界坐标与节点坐标的转换;

        // 获取节点的包围盒, 相对于父亲节点坐标系下的包围盒
var box = this.node.getBoundingBox();
console.log('box:',box); // 世界坐标系下的包围盒
var w_box = this.node.getBoundingBoxToWorld();
console.log(w_box); this.node.on(cc.Node.EventType.TOUCH_START, function(t) {
var w_pos = t.getLocation();
var pos = this.node.convertToNodeSpaceAR(w_pos);
console.log(pos); pos = this.node.convertTouchToNodeSpaceAR(t);
console.log("====", pos);
}, this); // 我要把当前这个sub移动到世界坐标为 900, 600;
// 把世界坐标转到相对于它的父亲节点的坐标
var node_pos = this.node.parent.convertToNodeSpaceAR(cc.p(500, 600));
this.node.setPosition(node_pos); // 相对于this.node.parent这个为参照物,AR为原点的坐标系
// 获取当前节点的世界坐标;
this.node.convertToWorldSpaceAR(cc.p(0, 0));

常用坐标函数

        var pos = new cc.Vec2(100, 100);
console.log('Vec2 x:%f,y:%f', pos.x, pos.y); pos = cc.v2(200.45, 200.94);
console.log('v2 x:%f,y:%f', pos.x, pos.y); pos = cc.p(300, 300);
console.log('p x:%f,y:%f', pos.x, pos.y); var src = cc.p(50, 11);
var dst = cc.p(100, 100);
var dir = cc.pSub(dst, src); var len = cc.pLength(dir);
console.log('dir.pLength:%f,dir.x:%f,dir.y:%f', len, dir.x,dir.y); var s = new cc.Size(100, 100);
console.log('Size x:%f,y:%f,w:%f,h:%f', s.x, s.y, s.width, s.height); s = cc.size(200, 200);
console.log('Size x:%f,y:%f,w:%f,h:%f', s.x, s.y, s.width, s.height);
var r = new cc.Rect(0, 0, 100,100);
console.log(r); r = cc.rect(0, 0, 200, 200);
console.log(r);
var ret = r.contains(cc.p(300, 300));
console.log(ret);
var rhs = cc.rect(100, 100, 100, 100);
ret = r.intersects(rhs);
console.log(ret); // 节点坐标转到屏幕坐标 cc.p(0, 0)
var pos = this.node.convertToWorldSpace(cc.p(0, 0)); // 左下角为原点的 cc.p(430, 270)
console.log('x:%f,y:%f',pos.x, pos.y);
pos = this.node.convertToWorldSpaceAR(cc.p(0, 0)); // 锚点为原点 cc.p(480, 320)
console.log('x:%f,y:%f', pos.x, pos.y);
// end var pos = cc.p(480, 320); var node_pos = this.node.convertToNodeSpace(pos);
console.log('x:%f,y:%f', node_pos.x, node_pos.y); // cc.p(50, 50) node_pos = this.node.convertToNodeSpaceAR(pos);
console.log('x:%f,y:%f', node_pos.x, node_pos.y);// cc.p(0, 0)

cc.Node—坐标系统的更多相关文章

  1. cc.Node—场景树

    对于cc.Node我分了四个模块学习: 1.场景树,2.事件响应,3.坐标系统,4.Action的使用:在此记录经验分享给大家. 场景树 1: creator是由一个一个的游戏场景组成,通过代码逻辑来 ...

  2. cc.Node 的坐标空间与ACTION的学习

    1.创建二维的向量坐标 //创建向量坐标方法一 let new_pos1 = new cc.Vec2(100, 100); //创建向量坐标方法二 let new_pos2 = cc.v2(200, ...

  3. Cocos Creator cc.Node.点击事件

    触摸事件 1.触摸事件的类型:START触摸启动,MOVED移动,ENDED弹起来,CANCEL取消; ENDED和CANCEL区别是ENDED物体内弹起来,CANCEL是在物体外范围弹起. 2.监听 ...

  4. <7>Cocos Creator 节点 cc.Node

    1.简介 节点(cc.Node)是渲染的必要组成部分.所有需要在游戏场景中显示的内容都必须是节点或者依附于节点之上.节点负责控制显示内容的位置.大小.旋转.缩放.颜色等信息. 2.节点属性 1: na ...

  5. cc.Node—事件响应

    触摸事件1: 触摸事件类型: START, MOVED, ENDED(物体内), CANCEL(物体外);2: 监听触摸事件: node.on(类型, callback, target(回掉函数的th ...

  6. cc.Node—Action

    1: Action类是动作命令,我们创建Action,然后节点运行action就能够执行Action的动作; 2: Action分为两类: (1) 瞬时就完成的ActionInstant, (2) 要 ...

  7. Cocos2d-JS坐标系统

    标准屏幕坐标系 如果接触过iOS,Android,Windows Phone等系统的应用开发,或使用DOM,CSS开发过Web网页,开发者会非常熟悉所谓的标准屏幕坐标系:左上角为原点,向右为X轴正方向 ...

  8. Cocos2d-x 核心概念 - Node中的重要操作

    作为跟类,Node有很多的重要的函数 local childNode = cc.Node:create() --创建节点 node:addChildNode(childNode,0,123) --创建 ...

  9. cc.Sprite

    Classcc.Sprite Defined in: CCSprite.js Extends cc.NodeRGBA Class Summary Constructor Attributes Cons ...

随机推荐

  1. python3 + selenum 环境搭建

    一.安装python3 打开python3官网https://www.python.org/,选择下载相应平台版本. 下载完成之后,根绝需要安装.注意:在安装时需勾选左下角“add python to ...

  2. MFC绘图

    //20171/121 两点一线 比如鼠标左击和鼠标弹起的两个消息 然后响应从而获取一条线2 添加响应函数方法 类图->右击->addwindowsmessage3 Dview和main中 ...

  3. Mac下Ruby升级与Rails的安装

    也是醉了,网上查了半天一脸懵逼.然后自己动手试试 gem install rails瞬间命令行就没反应了,以为命令行挂了,但是一会儿报错说是没有权限. 好吧,那么来这个 sudo gem instal ...

  4. Canvas 入门案例

    五.  Canvas 入门案例 1.  canvas 圆形绘制 <!DOCTYPE html> <html lang="en"> <head> ...

  5. Logstash读取文本信息并写入到ES

    Logstash读取文本信息并写入到ES 前提是ELK安装没问题 进入到logstash安装目录下的bin目录(我的logstash安装目录:/usr/local/) [root@es1 bin]# ...

  6. 再谈spark部署搭建和企业级项目接轨的入门经验(博主推荐)

    进入我这篇博客的博友们,相信你们具备有一定的spark学习基础和实践了. 先给大家来梳理下.spark的运行模式和常用的standalone.yarn部署.这里不多赘述,自行点击去扩展. 1.Spar ...

  7. 背包DP HDOJ 5410 CRB and His Birthday

    题目传送门 题意:有n个商店,有m金钱,一个商店买x件商品需要x*w[i]的金钱,得到a[i] * x + b[i]件商品(x > 0),问最多能买到多少件商品 01背包+完全背包:首先x == ...

  8. Linux单机环境下HDFS伪分布式集群安装操作步骤v1.0

    公司平台的分布式文件系统基于Hadoop HDFS技术构建,为开发人员学习及后续项目中Hadoop HDFS相关操作提供技术参考特编写此文档.本文档描述了Linux单机环境下Hadoop HDFS伪分 ...

  9. Stamus Networks的产品SELKS(Suricata IDPS、Elasticsearch 、Logstash 、Kibana 和 Scirius )的下载和安装(带桌面版和不带桌面版)(图文详解)

    不多说,直接上干货!  SELKS是什么? SELKS 是Stamus Networks的产品,它是基于Debian的自启动运行发行,面向网络安全管理.它基于自己的图形规则管理器提供一套完整的.易于使 ...

  10. 工作中js和jquery 函数收集

    1. 判断单选框是否选中  $("xxx").is(":checked")       返回类型是 true/false 2. $(this)[0].nextS ...