createjs碰撞检测localToLocal的用法
2016-07-12 21:41
441 查看
<!DOCTYPE html> <html> <head> <title>EaselJS demo: localToLocal</title> <style type="text/css"> body { margin: 0; padding: 7px; 4000 background-color: rgba(255,255,255,0); } canvas { border: solid 1px rgba(0,0,0,0.05); } </style> <script src="http://code.createjs.com/easeljs-0.7.0.min.js"></script> <script> var stage, arm; function init() { stage = new createjs.Stage("demoCanvas"); target = stage.addChild(new createjs.Shape()); target.graphics.beginFill("red").drawCircle(0,0,45) .beginFill("white").drawCircle(0,0,30) .beginFill("red").drawCircle(0,0,15); target.x = 100; target.y = 180; arm = stage.addChild(new createjs.Shape()); arm.graphics .beginFill("black").drawRect(-2,-2,100,4) .beginFill("blue").drawCircle(100,0,30); arm.x = 180; arm.y = 100; createjs.Ticker.on("tick", tick); } function tick(event) { arm.rotation += 1; target.alpha = 0.2; var pt = arm.localToLocal(100, 0, target); // 传递的是红色小球圆心位置 if (target.hitTest(pt.x, pt.y)) { target.alpha = 1; } stage.update(event); } </script> </head> <body onload="init();"> <canvas id="demoCanvas" width="300" height="300"> alternate content </canvas> </body> </html>
我把圆放大了,速度减慢了,可以看到这样的现象:圆球和arm的圆球碰撞的时候,并没有变化,而是要到arm的圆球中心点和圆球碰撞时才变化。
这段代码可以证明一点,createjs中这种方法实现的碰撞检测,其实是在检测物体arm在100,0这个位置,转动起来跟物体target是否碰撞,并非是物体arm整个形状是否和target有碰撞。
相关文章推荐
- STL list链表的用法详解
- 位图的用法
- JavaScript中apply与call的用法意义及区别
- sql中的group by 和 having 用法解析
- C++ typedef用法小结 (※不能不看※)
- 转载_git branch用法总结
- cd和ls的理解与用法
- C++中string的用法详解
- CSS clip:rect用法
- static_final_static final 用法
- 第一行代码阅读笔记----显示隐式Intent的基本用法
- 内核定时器 用法与实法 init_timer timer
- QML中的JavaScript用法详解
- java--Scanner类的用法(next()和nextLine()的区别)
- tf.stack()和tf.unstack()的用法
- xUtils的4个用法
- curl 用法 ubuntu
- rsync基本用法
- Struts2的iterator各种用法
- C语言system函数用法