o3d 初级demos

最新推荐文章于 2022-11-08 20:21:49 发布

佐笾已逝

最新推荐文章于 2022-11-08 20:21:49 发布

阅读量238

点赞数

分类专栏： 3D 文章文章标签： UP

本文链接：https://blog.csdn.net/wjlgryx/article/details/83872857

版权

3D 文章专栏收录该内容

45 篇文章 0 订阅

订阅专栏

view plaincopy to clipboardprint?
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>O3D Example</title>

<mce:script type="text/javascript" src="o3djs/base.js" mce_src="o3djs/base.js"></mce:script>
<mce:script type="text/javascript"></mce:script>

</head>
<body>
<h1>O3D Example</h1>

<div id="o3d" style="width: 600px; height: 600px;"></div>

</body>
</html>
一个复杂的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);
}

佐笾已逝

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
o3d 初级demos

view plaincopy to clipboardprint? O3D Example O3D Example 一个复杂的3D应用包含场景、摄像机、3D几何体、灯管和材质等。o3djs.require('o3djs.util'); o3djs.requ...
复制链接

扫一扫