C3DL教程3,是一个如何使用对象更新完后的回调方法。
教程中的效果是让鸭子左右不停的转动,先转向左边,再转回来。
先将教程一的内容拷贝一份为教程二,
然后修改helloword.js文件,先添加一个函数:
var timesincelastchange=0;
var y=-0.001;
function spinduck(time){
timesincelastchange+=time;
if(timesincelastchange >=3000){
y = -1*y;
duck.setAngularVel(new Array(0.0,y,0.0));
timesincelastchange = 0;
}
}
第二步在scn.startScene();这句之前添加scn.setUpdateCallback(spinduck);
第三步运行就可以了,很简单吧!
下面说说原理吧,
spinduck函数接收一个数字参数,改参数其实就是一个时间搓,急当前时间与上次更新的时间搓
函数体就是简单的换算
做个简单的实验,看看它为什么会来回不同的转动,当然这个转动一次就是更新一次对象,因此会调用spinduck函数
现在HTML中增加一个<span id="test"></span>
跟着在在spinduck函数中增加一句document.getElementById("test").innerHTML=time,(HTML5好像对象没有innerText属性)
跟着注释掉代码中的duck.setAngularVel,此时是不是认为spinduck函数只会被调用一次?
试试看,结果呢?,结果是那只鸭子不会动,但是你看网页中一个数字一直在变化,说明spinduck函数一直都在被调用
如此可以得出,C3DL的图形实在不停的更新,那是怎么回事呢?
看看源码,找到scene.js文件找到startScene函数,看到什么了?没错,启动后它设置了一个定时器没5毫秒调用一下render函数,
再看看render函数做了些啥事情?thisScn.updateObjects这个函数是更新所有对象。。
改函数里面就调用了spinduck函数。是不是这样?
再看看updateObjects函数,看到了什么,一直以为spinduck是在对象更新后被调用,但其实呢?是在之前被调用了。
至此终于揭开了spinduck为什么一直被调用,但为什么要这样一直去更新对象呢?不清楚,哈哈。。。
今天顺便把C3DL的JS LIB导入了MyEclipse里面方便编辑。
首先要安装spket插件,然后依次打开window->Perference->Spket->JavaScript Profiles,点击new,创建一个名字,然后add lib,随便选择一个
然后点击add folder,选择c3dl JS 文件目录,OK。但是你会发现它只会添加当前目录下的文件,不会添加子目录,怎么办?一个个目录添加?一个简单的方法
首先先写个程序遍历c3dl js下的所有文件,
并输出为include 'E://WebGL//canvas3d//c3dl2.1//actors//actor.js';这样的格式,一个文件一行
然后保存好,并把/替换成//
然后打开你的工程目录/.metadata/.plugins/com.spket.js/profiles.xml,打开找到刚刚创建的名字,然后将所有的文件路径添加进去。
好然后保存,重启MyEclipse,然后打开JS文件的时候,用右键选择Spket JavaScript Editor,就可以了。