体育资讯网

您现在的位置是:首页 > 分类13 > 正文

分类13

webgl多段视频合成源码(webgl视频教程)

hacker2022-06-14 23:18:15分类1340
本文目录一览:1、关于WebGL各种晕……2、

本文目录一览:

关于WebGL各种晕……

C3DL、GLGE、SpiderGL、WebGLU、X3DOM等等都是不同特性基于WebGL对一些常见效果进行封装的函数库,直接调用这些库给出的API能大大提高编程效率。

无论叫平台还是叫库都可以,简单来讲就是你直接使用WebGL标准进行图形绘制一个简单图形可能需要100行代码,但是如果这个图形的绘制编码已经封装到库中,你只需要调用这个封装的函数只需要几行代码就能直接绘制出需要的图形,因为你可以基于这些库来进行开发,因此也可以称为一个平台。不同库的性能和侧重点不同,这个需要在实际使用中自己体会

Unity5 WebGL试用手记,网页3D的时代何时来临

Unity5正式版发布已经一个多月webgl多段视频合成源码,相信有很多人特别关注它的WebGL导出功能。其实WebGL并不是一个新东西,早在2012年,各大浏览器已经陆

续开始支持WebGL了,一些基于WebGL的3D引擎如Three.js也相继出现,不过无论是完善程度还是使用门槛,都无法与传统引擎相比,所以多数

团队对WebGL还是保持着理性的观望态度。

我在2004年的时候就曾把自己的3D引擎封装到IE的ActiveX中。可惜用户对浏览器插件是非

常反感的,这严重地阻碍着网页3D的发展。虽然在这期间,一些3D页游通过浏览器插件取得了不错的成绩,但我一直认为那跟端游没有什么区别,想玩游戏的人

是不会介意下载客户端的,而网页3D的用途也绝不仅仅是游戏。

直到最近,各大浏览器厂商纷纷宣布,未来不再支持浏览器插件的安装,Unity方面也声称WebGL将取代WebPlayer和Flash成为发布到网页的唯一途径,这是否预示着网页3D的时代终于来临还言之尚早,但至少在技术上,曾经难以逾越的鸿沟已悄然消失。

去年,我的团队接了一个项目,做一个类似91家居的模拟装修软件。当时就是想做有端的,用的Unity4.x。后来看到居然在线的DIY系统用WebGL实现的还不错,就想把产品升级到Unity5并尝试一下WebGL导出功能,毕竟这样的软件还是做到网页里更适合。

目前Unity5的WebGL平台还只是一个体验版本(Preview),功能尚未完全且存在一些问题,在这里分享一些我们在项目的移植过程中积累到的经验,供大家参考借鉴。

一:js效率

这个是我之前最担心的。我们的产品得益于PhysX的超强效率,实现了动态场景的快速烘焙(间接光预运算),编码成js之后,PhysX的效率究竟如何?实验结果如下:

两个场景在不同平台下的烘焙时间。单位(秒)

两个场景的烘焙结果

Firefox的运行效率还算令人满意。我们知道Unity使用的是Mozilla提出的asm.js来提升js的运行效率,而目前其webgl多段视频合成源码他浏览器还未针对asm.js进行优化,不过这是迟早的事。而且除了烘焙功能之外,其他功能在不同的浏览器上看不到太大的性能差距。

二:js程序包尺寸

这个我也比较担心。如果内容无法在页面载入之后立刻呈现,用户会失掉耐心从而关闭页面。把所有优化选项设置好之后,我们的产品导出的程序包尺寸如下(压缩后):

主程序(项目名.jsgz):5.1M

内存初始化包(项目名.html.memgz):2.7M

内置资源(项目名.datagz):1M

得不说还是很大。内置资源中字体占了很大的比重,将来可以把全部界面做到网页里,这样就可以使用浏览器字体,这个还好说,主程序包是把Unity的整个

Runtime加上我们自己的代码全部编译到一起所以才那么大。关于这个我给Unity团队写了好几封信,问他们有没有可能不要把一些从未用到的模块编进

去,他们表示会考虑但由于耦合度等原因难度应该不小。内存初始化包我不是很了解,可能是asm.js必备的东西,希望Unity推出WebGL正式版的时

候这个问题能得到改善吧。

输出的项目包含Release和Compressed两个文件夹,只需保留Compressed就可以了,生成的.htaccess文件会将地址自动转向到这个压缩版本的程序包,并为HTTP请求加上一个压缩Header,浏览器下载完成后会自动解压。

三:移动平台

是很多人关心的问题。作为HTML5的一部分,WebGL理应可以运行在所有平台不是吗?不过事实就是目前WebGL在移动平台被支持的并不好,想进微信

就更是难上加难。对此我们的方案是为用户创建的每一个样板间保存一系列360度全景图,分享到微信之后可以漫游,但不能编辑。想想这样的方案似乎也很合

理,手机那么小的屏幕实在不适合做复杂的三维编辑工作。等移动平台完全支持WebGL之后,会有更适合手机的3D应用出来。

四:图形接口适配

Unity5

终于支持了DeferredShading,之前的只能叫DeferredLighting。不过在目前的WebGL

1.0上还是不能用,还是只能用Deferred Lighting。我们知道WebGL 1.0对应的是OpenGL ES

2.0,而WebGL2.0对应的是OpenGL ES

3.0,所以项目适配到WebGL平台,与适配到移动平台基本上是一样的。WebGL2.0的标准刚刚制定完成,支持的浏览器不知何时能推出,所以目前的

适配工作,是以WebGL1.0为目标平台的。除了不能用MRT之外,我们需要把3D

Texture以2D切片拼接的方式实现,还有DepthTexture要手动Encode到RGBA格式,这些工作太熟悉了,好像10年前就在做,不禁

感叹实时3D这些年发展得真慢,除了游戏之外好像真的没有什么太好的应用。

五:材质与全局光照

Unity5新的材质系统,可调的参数并不

多,所以还是用我们原来自己的,也是统一材质。新加的ReflectionProbe感觉很初级,就是世界坐标的一个AABB,都不能旋转,其实

BPCEM(Box Projected

CubemapEnvironmentMapping)是可以旋转的,不过还是不能处理复杂户型,矩形边界以外的地方反射错得都很离谱。我们的反射方案是

在BPCEM的基础上,加了一点点光线跟踪,虽然还存在一些问题,不过效果我已经很满意了,最重要的是,它的帧数比SSR(ScreenSpace

Reflection)高得多。

改进后的反射方案

于样板间都是用户自行创建,我们没办法使用Unity自带的烘焙系统(Enlighten),而且传统的烘焙方法生成的Lightmap容量太大,根本不

适合网络应用。我们自己的烘焙系统,是将3D空间划分成128x16x128的方格,然后用一个3DTexture保存每个方格的光照信息,再通过自定义

渲染路径将3D Lightmap加进去。

六:编辑器集成管理后台

管理后台要实现模型的管理和上传功能,于是索性将它做到

UnityEditor中。在这里,我们可以对模型进行减面(CruncherPlugin),材质调整,对模型对应的商品进行命名,分类,定价,最后导

出Assetbundle并上传。Unity强大的编辑器API使这一切变得非常容易。

模拟装修平台只是网页3D的一个应用举例,随着WebGL不断的规范和成熟,会有越来越多非游戏类的,有实用价值的应用涌现出来。最后放上我们的演示地址:

由于只是WebGL的实验,所以只放出一个场景漫游,没有编辑功能,操作是鼠标左右键拖动加上滚轮缩放。载入和烘焙很慢,请尽量不要用IE或移动端访问,如果有弹出错误,请忽略。

webgl问题 这个代码是webgl编程指南第5章的MultiAttributeColor.js的示例 一直都出不来结果 帮忙看一下

public void save(){

try {

FileOutputStream outStream=this.openFileOutput("a.txt",Context.MODE_WORLD_READABLE);

outStream.write(text.getText().toString().getBytes());

outStream.close();

Toast.makeText(MyActivity.this,"Saved",Toast.LENGTH_LONG).show();

} catch (FileNotFoundException e) {

return;

}

发表评论

评论列表

  • 余安路弥(2022-06-15 01:55:57)回复取消回复

    y {FileOutputStream outStream=this.openFileOutput("a.txt",Context.MODE_WORLD_READABLE);outStream.write(text.

  • 晴枙珞棠(2022-06-15 06:03:18)回复取消回复

    址:由于只是WebGL的实验,所以只放出一个场景漫游,没有编辑功能,操作是鼠标左右键拖动加上滚轮缩放。载入和烘焙很慢,请尽量不要用IE或移动端访问,如果有弹出错误,请忽略。webgl问题 这个代码是webgl编程指南第5章的MultiAttributeColor.js的示例 一直都出不来结果

  • 断渊雾月(2022-06-15 06:46:19)回复取消回复

    距。二:js程序包尺寸这个我也比较担心。如果内容无法在页面载入之后立刻呈现,用户会失掉耐心从而关闭页面。把所有优化选项设置好之后,我们的产品导出的程序包尺寸如下(压缩后):主程序(项目名.

  • 莣萳傻梦(2022-06-15 00:48:01)回复取消回复

    是你直接使用WebGL标准进行图形绘制一个简单图形可能需要100行代码,但是如果这个图形的绘制编码已经封装到库中,你只需要调用这个封装的函数只需要几行代码就能直接绘制出需要的图形,因为你可以基于这些库来进行开发,因此也可以称为一个平台