之前做了几个项目，使用需要使用到3d场景。但是有很多2d元素游戏说明、按钮、得分和结果，如果都用three.js做的话，屏幕适配和点击、超出屏幕高度的文本滚动条操作等就很棘手。
所以就简单的想了一个使用2个cavas，通过全局变量来通信的方式。
首先，建立两个canvas.
<div id="annieEngine" class="annie"></div>
<div id="threecanvas" class="three"></div>
各自指定样式：
.annie{
line-height:0;
font-size:0;
position:absolute;
background-color: rgba(255,255,255,0)/*背景颜色白色，0%透明度*/;
z-index: 10;
}
.three{
line-height:0;
font-size:0;
position: absolute;
width: 100%;
height: 100%;
left:0px;
top:0px;
z-index: 1;
}
2.通信问题
新建一个全局变量
window.dispatcher = new annie.Sprite();
然后通过dispatcher来派遣和侦听自定义事件。
达到three.js和annie2x之间互相调用方法的目的。
感谢 @小可 ：https://github.com/flash2x/annieJS/
