O3D 简明入门
来源:互联网 发布:常用网络命令 编辑:程序博客网 时间:2024/05/16 23:53
O3D是google公司开发的一套用于web3D开发的javascript API,是为了创建基于网页的3D图形操作界面和3D游戏而开发。网上经常有人把它拿来和OpenGL作比较,实际上,O3D可以看做是对OpenGL和D3D的封装。O3D的架构如下所示,底层是基于OpengGL和Direct3D接口实现,支持顶点shader和像素shader,支持GPU加速运算,因此,在不考虑带宽限制的条件下,O3D的渲染性能几乎可以媲美很多本地应用(譬如游戏),大家可以在google O3D的官网上找到不少很炫的Demo。
O3D目前主要支持Firefox, Safari, Google Chrome, Internet Explorer,当然,要想体验或者开发基于O3D的应用,必须先给自己的浏览器安装O3D插件。插件的下载地址为:http://tools.google.com/dlpage/o3d/eula.html
O3D的官网地址:http://code.google.com/intl/zh-CN/apis/o3d/,在这里可以找到很多文档。
另外,如果有兴趣,可以在google的svn服务器上找到O3D的所有代码来研究,地址为:http://o3d.googlecode.com/svn
介绍完O3D,下面开始用具体的代码来慢慢深入研究。下面是一个最简单的Demo:
这个Demo还没有添加任何东西,但是却可以让我们了解到基于O3D开发的程序框架。
一个O3D程序需要完成的任务如下:
1 创建一个O3D object
2 给全局变量赋值,并初始化程序库
3 创建pack以管理O3D objects
4 创建render graph
5 建立draw context(远景和视野转换)
6 创建一个效果,载入shader information
7 创建材质和形状,设置材质绘制列表,并且设置其他材质参数
8 将transforms和shapes加入到transform graph
9 创建primitives的绘制单元
10 设置回调函数,在3D场景每次被渲染时执行特殊的任务
下面是HTML代码:
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>Tutorial A1: Loading a scene</title>
</head>
<body>
<h1>Loading a scene.</h1>
This tutorial shows how we load and display a scene in O3D.
<!-- Start of O3D plugin -->
<div id="o3d_elem1" style="width:400px; height:300px" />
<!-- End of O3D plugin -->
</body>
</html>
<!-- Our javascript code -->
<script type="text/javascript" id="o3dscript">
o3djs.require('o3djs.util');
o3djs.require('o3djs.math');
o3djs.require('o3djs.rendergraph');
o3djs.require('o3djs.camera');
o3djs.require('o3djs.pack');
o3djs.require('o3djs.scene');
window.onload = init;
window.onunload = unload;
//全局变量
var g_o3d;
var g_math;
var g_client;
var g_viewInfo;
var g_pack;
var g_finished = false;
function init()
{
o3djs.util.makeClients(initStep2);
}
function unload()
{
if (g_client)
g_client.cleanup();
}
function initStep2(clientElements)
{
var o3dElement = clientElements[0];
g_o3d = o3dElement.o3d;
g_math = o3djs.math;
g_client = o3dElement.client;
g_pack = g_client.createPack();
g_viewInfo = o3djs.rendergraph.createBasicView(g_pack,
g_client.root,
g_client.renderGraphRoot);
[0, 1, 0]); // up
}
</script>
var material = g_pack.createObject('Material');
material.drawList = g_viewInfo.performanceDrawList;
material.effect = effect;
//创建一个球体
var shape = o3djs.primitives.createSphere(g_pack, material, 0.5, 20, 20);
g_cubeTransform = g_pack.createObject('Transform');
g_cubeTransform.addShape(shape);
g_cubeTransform.parent = g_client.root;
g_finished = true;//结束标志
- O3D 简明入门
- O3D简介
- symbian 入门简明教程
- ibatis简明入门
- symbian 入门简明教程
- Perl入门简明教程
- duilib入门简明教程
- DuiLib入门简明教程
- GDI简明入门
- DUILIB入门简明教程
- Rcpp简明入门
- Scrum简明入门
- bower简明入门
- duilib入门简明教程
- Git初步----简明入门
- DUILIB入门简明教程
- DuiLib入门简明教程
- Maven入门简明教程
- Symbian学习笔记(9):数组
- CSS强制不换行(white-space:nowrap)IE使用问题
- FastReport.Net C#程序邦定报表模版
- Class.getResourceAsStream和ClassLoader.getResourceAsStream
- 个人总空间--Welcome
- O3D 简明入门
- C# 判断一个字符串是否都是数字
- DAO---1步骤分析
- struts2.0(70-80)
- 开始
- 2010.5.12asp.net 与jsp页面传送数据的方式
- inner join on, left join on, right join on讲解(转载)
- showModalDialog弹出页面刷新问题
- c++回调函数探索