使用O3D javascript API构建一个O3D应用

来源：互联网发布：流动人口监测数据编辑：程序博客网时间：2024/06/05 08:56

在HTML中导入所需要的js包。

一个复杂的3D应用包含场景、摄像机、3D几何体、灯管和材质等。

o3djs.require('o3djs.util');o3djs.require('o3djs.rendergraph');o3djs.require('o3djs.primitives');o3djs.require('o3djs.camera');o3djs.require('o3djs.material'); //O3D程序的入口点var g_client;//3D视窗var g_viewInfo;//旋转角度var g_animate_angle=0; window.onload = function(){    o3djs.util.makeClients(initialize);} function initialize(clientElements) {  var o3d = clientElements[0];   //初始化程序入口client  g_client = o3d.client;   // 创建场景容器  var pack = g_client.createPack();   // 创建视窗  g_viewInfo = o3djs.rendergraph.createBasicView(      pack,g_client.root,g_client.renderGraphRoot);   // 创建材质  var material = o3djs.material.createBasicMaterial(      pack,g_viewInfo, [1, 0, 0, 1]);     // 创建一个正方体  var cube = o3djs.primitives.createCube(pack, material, 0.5);   // 创建3D物体的容器  var transform = pack.createObject('Transform');  transform.parent = g_client.root;  transform.addShape(cube);   // 初始化Camera  o3djs.camera.fitContextToScene(g_client.root,                                 g_client.width,                                 g_client.height,                                 g_viewInfo.drawContext); //添加帧循环回调函数  g_client.setRenderCallback(onRender);} /** * 帧循环回调函数 */function onRender(event){    //取得帧间隔时间    var elapsedTime = event.elapsedTime;    g_animate_angle += 0.1 * elapsedTime;     // camera的位置    var eye = [ Math.sin(g_animate_angle) * 1.0,                    1.0,                    Math.cos(g_animate_angle) * 1.0];     // camera的指向    var target = [0, 0, 0];     //告诉camera哪个方向是向上，本例中是y轴指向。    var up = [0, 1, 0];     //更新camera的位置    g_viewInfo.drawContext.view = o3djs.math.matrix4.lookAt(eye, target, up);}