webgl开源三维引擎的选择,想做三维的能交互的应用程序,用OpenGL还是用unity 3D?三维可视化 3D 开发
webgl开源三维引擎的选择,想做三维的能交互的应用程序,用OpenGL还是用unity 3D?三维可视化 3D 开发详细介绍
本文目录一览: WebGL初探—Three.js全景图实战
前段时间公司给了一个新需求就是写一个装修室内3D全景效果图,于是开始我的three.js开发之旅。
作为一个前端小白,突然接触three.js&webgl除了懵逼还是懵逼,不过作为一个技术人对于挑战也许就是软件开发中真正的乐趣,至少不会埋头调试一遍又一遍重复的页面数据,上上下下左左右右BABA......简直枯燥到极点。不过three.js&webgl不得不说给我打开了新的世界,接下来我就简单讲述一下我的学习之旅。
Three.js 是一款运行在浏览器中的 3D 引擎,是JavaScript编写的WebGL第三方库,可以用它创建各种三维场景,包括了摄影机、光影、材质等各种对象,three.js内部也是webgl的封装,封装了大量了webgl API ,让比较繁琐的webgl更加简便。
WebGL(全写Web Graphics Library)是一种3D绘图协议,它让可以让开发进一步去了解图形渲染,Webgl是JavaScript和OpenGL ES 2.0合并出来的升级版,通过webgl可以让前端开发者们脱离开css渲染,可以了解更加底层的渲染,WebGL也可以为HTML5 Canvas提供硬件3D加速渲染,webgl是通过系统显卡来在浏览器里更流畅地展示3D场景和模型,加入shader(着色器)来对图形渲染,学习webgl需要具备相应的图形学算法,属于目前图形渲染开发的高级技术之一。目前webgl也运用在游戏,视频特效,包含untiy3D也是集成webgl。
three.js中主要由摄像机 ,场景 ,渲染器 , 资源加载器,素材组成
webgl中的所有东西都是基于摄像机去展示的,可以利用摄像头的视角形成对3d视图观测视角,比如鱼眼视角,从而就让我们可以在平面图上可以开发出真实场景的3D视图。接下来我们看看怎么用three.js创建一个摄像机:
摄像机有了但是为了让景物可以更好的展现,这时候我们就需要一个展示景物的场景,three.js也为我们封装好了,如下所示可以创建一个场景:
渲染器是webgl的渲染启动开关,他可以调用render方式把场景渲染到摄像机。
three.js加载资源不同我们常见的html一样,直接通过src属性加载,而是通过TextureLoader.load来加载资源。
素材常见的包含网格,灯光等许多元素下面我就举个例子
http://www.sunql.top/webgldemo/index.html
https://github.com/sunql0827/webgldemo.git
https://gitee.com/sunql-hugh/webgldemo.git
通过这次基于three.js的webgl全景图开发之旅为我对视图渲染打开了一道新的大门,不过webgl的厉害之处还有很多很多是我还未涉及到了,以后还需要更加努力了。
想做三维的能交互的应用程序,用OpenGL还是用unity 3D?三维可视化 3D 开发
这个其实还是根据个人对这两个应用的掌握程度 个人觉得unity3d 更加直观 并且操作界面也相对友好 所以你可以根据具体需求去进行选择
跟开发小哥哥要了张层次图,两者的最大区别一目了然!
相比Unity,OpenGL是更为底层的一项技术,这个如何解释呢?OpenGL其实就是webGL的前身,它提供的是几何概念,比如点、线、面,相当于画家脑海中的各种素材,只有经过一双妙手,才能画出一张图像,所以相比较而言,用Unity 3D渲染器的人更多一些,因为Unity提供了更为顶层的3D概念,包括空间变换、材质、环境球等,更容易运用理解。
我们都知道,Unity 3D主要专注于游戏开发、影视动画,底层是c++语言,主要需要安装客户端才能使用,openGL采用前端语言(Unity也有一部分JS代码),所以可以直接在浏览器页面进行可视化开发!
更为顶层的three.js和ThingJS都是基于webGL的3D框架,所以可视化开发成为一种巨大的优势(不过Unity的客户端渲染性能一样好),尤其是ThingJS支持在线开发,扩展了开发自由度。
总而言之,一张图说明一切,Unity是一种渲染引擎,可以提供一系列3D开发概念帮助你快速制作影视项目,OpenGL属于渲染接口层,并不具备任何概念,需要自己组建图形,对于初学者不是特别友好,也没有特定的领域覆盖,更适合技术探索者,而不是项目开发者!
Unity5 WebGL试用手记,网页3D的时代何时来临
Unity5正式版发布已经一个多月,相信有很多人特别关注它的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的运行效率,而目前其他浏览器还未针对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终于支持了Deferred
Shading,之前的只能叫Deferred Lighting。不过在目前的WebGL
1.0上还是不能用,还是只能用Deferred Lighting。我们知道WebGL
1.0对应的是OpenGL ES 2.0,而WebGL 2.0对应的是OpenGL ES
3.0,所以项目适配到WebGL平台,与适配到移动平台基本上是一样的。WebGL
2.0的标准刚刚制定完成,支持的浏览器不知何时能推出,所以目前的适配工作,是以WebGL
1.0为目标平台的。除了不能用MRT之外,我们需要把3D Texture以2D切片拼接的方式实现,还有Depth
Texture要手动Encode到RGBA格式,这些工作太熟悉了,好像10年前就在做,不禁感叹实时3D这些年发展得真慢,除了游戏之外好像真的没有什么太好的应用。
五:材质与全局光照
Unity5新的材质系统,可调的参数并不多,所以还是用我们原来自己的,也是统一材质。新加的Reflection
Probe感觉很初级,就是世界坐标的一个AABB,都不能旋转,其实BPCEM(Box Projected Cubemap
Environment
Mapping)是可以旋转的,不过还是不能处理复杂户型,矩形边界以外的地方反射错得都很离谱。我们的反射方案是在BPCEM的基础上,加了一点点光线跟踪,虽然还存在一些问题,不过效果我已经很满意了,最重要的是,它的帧数比SSR(Screen
Space Reflection)高得多。
?改进后的反射方案
由于样板间都是用户自行创建,我们没办法使用Unity自带的烘焙系统(Enlighten),而且传统的烘焙方法生成的Lightmap容量太大,根本不适合网络应用。我们自己的烘焙系统,是将3D空间划分成128x16x128的方格,然后用一个3D
Texture保存每个方格的光照信息,再通过自定义渲染路径将3D Lightmap加进去。
六:编辑器集成管理后台
管理后台要实现模型的管理和上传功能,于是索性将它做到Unity
Editor中。在这里,我们可以对模型进行减面(CruncherPlugin),材质调整,对模型对应的商品进行命名,分类,定价,最后导出Assetbundle并上传。Unity强大的编辑器API使这一切变得非常容易。
模拟装修平台只是网页3D的一个应用举例,随着WebGL不断的规范和成熟,会有越来越多非游戏类的,有实用价值的应用涌现出来。
常用的BIM引擎有哪些,分别有什么优劣?
关于BIM、CIM相关的技术服务商,我们认为各家都有自身商业逻辑的侧重方面,其简要可以从三个维度来思考场景需求,进而来选定专项专长的技术服务商。
首先,对于未来的数字化系统,尤其在建筑工程、特种应用等不同领域,三维模型将是承载信息数据的重要载体,因此对于模型自身完整数据的体量以及应用程度,便成为第一个选择的标准。请留意,此处我们提及的模型体量,既包含了原文件的体量,更需要考虑模型文件在三维数据引擎转化之后的三角面片数、顶点数等体量。
之所以要对模型体量予以考虑,是由于不同的专业模型格式,其对应的场景和异面结构不同,其转化的三角面片数体量也完全不同。例如在常见的Revit软件中,其RVT格式文件如果超过1个G,由于其更多对应场景的民建场景,因此三角面片数会在8000万-1亿面片左右,而对于Tekla钢结构、PDMS石油化工等格式软件,由于其场景管道等复杂结构众多,因此很可能Tekla 30-60M、PDMS 300-500M上下,其对应的三角面片数便可以达到1.5-2亿三角面片数。
其次,如上提及的超大模型体量,需要在具体的项目系统中,了解客户需要支持的模型数据体量大小,从而对应引擎的技术路径。如在一些大型国企、头部公司的信息化部门中,其为了在未来实现多源数据的深度学习,因此其会对BIM模型的完整数据有较高的要求,因此需要能够适配云计算充足算力的三维数据引擎来进行支撑;而对于项目预算有限,同时对数据要求不算高的项目及客户,则可以通过WebGL进行模型压缩的方式,简单支持部分数据。
如果客户需要的数字化系统承载的模型格式对应的场景复杂结构越多,那么意味着其三角面片数转化之后很可能更加庞大,则更需要有充足算力支持的三维数据引擎来支持。这里,便可理解一种现象,便是国内客户常会提供的“压缩比”的概念,其原因便是有些厂商是基于国外WebGL开源系统进行三维引擎应用功能的开发,由于WebGL由本地设备进行支持,因此对于Revit等大模型需要进行减化,只保留定制化项目系统需要的数据,而将无关数据进行删减,典型的特征便是原先模型中的圆变成了多边棱形。
最后,则是客户自身的开发需求为参考的维度。我们可以看到大量的尝试提供并非完全独立的三维数据引擎,而是更多以定制化的解决方案作为交付物,通过对客户个性需求的功能开发实现更高的客户黏性,这样的商业模式好处在于项目机会较多、能够实现在数年中有一定稳定的收入,但是缺点在于较难以松耦合结构来标准化功能,实现标准化产品的定量模块出货。
而越来越多部分的中大型客户,由于其对于数字化系统有更高自主可控的需求和技术水平要求,因此基本会成立自己领导的信息化子公司、信息化部门之类的团队,从而直接采用云计算三维数据引擎,调用其中的API来予以系统功能的封装,而这一类公司也往往有着模型数据超巨量、数据应用深化等特征。
综上,对于BIM、CIM等产品,根据客户的不同侧重会有不同的技术支持商,现行的案例分类可大致分为抓住眼球、强调效果的科技风系统,定制紧耦合应用、模型效果优化的场景类应用方案,松耦合集成引擎、深度数据应用的类数字孪生方案。
末尾补充一句,CIM本质是BIM数据于广域环境的集成,因此思维逻辑可沿用其上三维度判断,而国内BIM的最大弱点之一,便来自于作为数据创造的源头“专业建模软件”大多数还把控在国外品牌手中,因此底层基础协议上有很多标准、规则无法根据国情更改,这是未来需要克服、从而实现数据流、信息流真正无边界交互的重要战略方面。
对BIM图形引擎进行选型时,要重点考察以下几个因素:1、是否支持工程建筑行业的主流文件格式;
2、BIM模型中的构件及属性信息是否提取完整;
3、大模型的在线浏览是否流畅;
4、能支持低配置的显示终端;
众多开发者在综合对比后,不约而同选择了BCore图形引擎——一款专业面向工程建筑行业的BIM引擎。
BCore支持工程行业主流文件上传与解析,超大模型在线流畅不卡顿、不闪屏,支持BIM+GIS的场景整合,提供功能丰富的SDK和API接口,还支持私有化部署。
BCore图形引擎是由BCore团队独立开发,拥有完全知识产权的专业建筑图纸模型轻量化引擎。BCore以服务建筑工程行业作为原点,为开发者提供数据解析、图形可视化和几何运算3大核心服务,有效降低BIM应用的图形开发难度,让开发者将精力聚焦在核心业务功能,缩短项目开发周期,提升管理人效。
数据解析
BCore图形引擎支持.rvt、.ifc、.skp、.dwg、.dxf、.osgb等10多种建筑行业主流文件格式的解析,兼容多专业、多软件的成果合并,实现数据格式的统一。
BCore能实现BIM模型和CAD图纸的全量数据提取。
针对BIM模型,BCore支持项目、模型、标高、类型、系统、构件等常规数据的提取,还提供3D轴网、空间、洞口、端口连接关系等特色扩展数据提取,并能导出完整的属性清单。为成本材料算量、模型审查等业务场景提供数据提取能力,让BIM模型不止能“看”,还能真正被用起来。
针对CAD图纸,BCore不仅能实现图元级别的数据解析,还可以导出图纸的布局空间及模型空间,并支持按图层、图块、图框拆分图纸。
图形可视化
BIM应用最担心在线浏览模型、图纸时,频繁出现卡顿和崩溃,如果不能顺畅运行,即使应用的功能再多、效果再炫,也难以用到实际项目中。
BCore图形引擎为开发者提供图形可视化服务,只需调用图形API就可以实现BIM模型、CAD图纸、GIS模型的在线浏览与交互操作。
借助BCore出色的轻量化技术,无论是施工现场的普通电脑,又或者是手机、平板,大部分图纸二次加载时,能在1秒内完成加载,即使是超大型的模型,在线浏览也不会卡顿、闪屏,不用担心应用运行不起来。
BCore图形引擎还提供丰富的视觉特效库,帮助开发者以更生动、直观的形式展示模型及项目数据。
几何算法
相比市面上以文件解析和图形展示为主的BIM轻量引擎,BCore从诞生开始就以服务工程建筑行业为目的,为开发者提供专业的几何算法服务,让BIM与智能建造更紧密的结合,具有更强的落地性和应用价值。
BCore图形引擎的几何算法不仅能满足成本及材料算量输入规范,还提供包括数据轻量化、模拟仿真、模型对比计算、碰撞检查、工序流水段划分等空间几何能力,适配多种智能建造业务场景,帮助开发者快速完成项目开发,并大幅节省专业软件的采购成本。
BIM引擎,分两种服务模式,一种是webgl客户端渲染,一种是SME实时云渲染。
WebGL(客户端渲染)服务模式
用户通过浏览器访问服务器端的模型,浏览器把模型下载缓存到本地,通过WebGL驱动访问本地显卡进行渲染,利用本地的计算资源(显卡,CPU,内存)。WebGL(客户端渲染)具有如下特点:
WebGL客户端渲染相较传统的ActiveX插件方式具有免安装、轻量化、易部署的优点。
WebGL客户端渲染会受到客户端计算资源(显卡,CPU,内存)的约束,在支持模型的规模、平台兼容性等方面受到一定技术约束。
从市场应用情况看,比较适合中小模型可视化场景。
云渲染(服务器实时渲染)服务模式
云渲染(服务端实时渲染)是指渲染计算发生在远程服务器端,客户端只是一个可以交互的显示器,将渲染指令发送到服务器端同时接收渲染结果,对于本地计算资源要求极低。
大象云以云计算赋能实时渲染,通过这种远程实时渲染方式主要解决如下问题:
大规模、超大规模模型互联网可视化协同,如飞机、建筑信息模型
数据安全高,又有协同分享需求的工程、项目协作
工程领域基于模型可视化的多用户并发、协同
如果你们对数据安全有的要求,且模型较大,建议使用SME,由大象云自主研发的,目前国内唯一商用大象专业引擎。很多国家大型项目都在使用的,应该比较放心。
HTML5 和 WebGL 技术可用于三维可视化开发吗?
肯定能得,ThingJS 基于 HTML5 和 WebGL 技术,可方便地在主流浏览器上进行浏览和调试,支持 PC 和移动设备。ThingJS 为可视化应用提供了简单、丰富的功能,只需要具有基本的Javascript 开发经验即可上手。
ThingJS 提供了场景加载、分层级浏览,对象访问、搜索、以及对象的多种控制方式和丰富的效果展示,可以通过绑定事件进行各种交互操作,还提供了摄像机视角控制、点线面效果、温湿度云图、界面数据展示、粒子效果等各种可视化功能。
ThingJS提供如下相关组件和工具供用户使用网页链接
CityBuilder:聚焦城市的 3D 地图搭建工具,打造你的 3D 城市地图。
CamBuilder:简单、好用、免费的 3D 场景搭建工具。
ThingPano:全景图制作工具,轻松制作并开发全景图应用,实现 3D 宏观场景和全景微观场景的无缝融合。
ThingDepot:上万种模型,数十个行业,自主挑选,一次制作多次复用。
配置和部署
系统运行硬件的要求
ThingJS 的 3D 可视化应用是 B/S 架构的,3D 场景是运行在客户端的浏览器中。3D 场景渲染展示对客户端设备要求较高,特别是显卡,一般必须是独立显卡
推荐使用 Chrome 浏览器进行开发和演示。
客户端:
系统:Windows 7 及以上
CPU:双核 CPU2.8GHz及以上
内存:8G 及以上
显卡:最低 GTX650,推荐 GTX960 及以上,显存 2G 及以上
硬盘:300GB 及以上
ThingJS 若是离线部署,需要部署到服务器端,ThingJS 对服务器端的要求并不高
服务器端:
系统:Windows Server 2003 及以上
CPU:双核 CPU2.8GHz 及以上
内存:8G 及以上
硬盘:500GB及以上
软件环境:JDK 1.6 及以上
部署方式
支持项目 托管部署 和 离线部包部署 两种方式。
1、首先答案是肯定的,html5和webgl技术可以用于三维可视化开发。
2、但是你需要考虑到不是所有浏览器都支持h5和webgl技术的。
3、然后你还需要考虑性能方面的消耗。使用体验等。
4、都考虑清楚了就可以动手开发了。希望对你有帮助。
可以呀,html5 和 webgl 技术都可以用于三维可bai视化开发。
Hightopo 提供了一套独特的 WebGL 层抽象,将 Model–View–Presenter (MVP) 的设计模型延伸应用到了 3D 图形领域。
HT是由图扑软件 独立自主研发的,基于HTML5技术标准的前端2D、3D图形开发框架。其提供了从SDK的API组件库到2D 、3D编辑器到矢量图标和三维模型资源库,构成一站式的数据可视化解决方案。
可搜索 图扑软件 申请试用!
更多资料图扑软件(Hightopo)是由厦门图扑软件科技有限公司独立自主研发,基于HTML5标准技术的Web前端2D和3D图形界面开发框架。非常适用于实时监控系统的界面呈现,广泛应用于电信网络拓扑和设备管理,以及电力、燃气等工业自动化 (HMI/SCADA) 领域。
多年来数百个工业互联网可视化项目实施经验形成了一整套实践证明的高效开发流程和生态体系,可快速实现现代化的、高性能的、跨平台桌面Mouse/移动Touch/虚拟现实VR图形展示效果及交互体验。
如何在我的网站上实现三维产品展示,需要些什么技术?最好有案例参考.
如果不借助平台的话 需要用到WEBGL编程技术和3D的技术
如果只有3D的技术的话 可以借助下各大网站平台 目前看到的最好用和功能最多的只有我知道的“动动三维”,他们编辑器里面的动画时间轴,在制作产品交互方面,提供了很大的便利和多种类的交互形式;而且如果没有模型的话,也可以在里面寻找模型,如果需要更改,也可以下载下来再在3D软件里面捣腾一遍再放入编辑器里面调整,或者直接可以在编辑器里面加入许多的交互。
在展示方面可以直接在电脑上打开链接观看,也可以直接下载二维码,然后移动端扫描二维码展示,或者说是您发的作品的iframe码嵌入到您自己的网站中展示 ,非常的便利
望采纳
据我所知,过去,通常的解决办法是采用Flash技术,不过好像过时了,可能是因为HTML5技术发展的比较快的原因。
当然也可以使用一些游戏引擎,如果水平高的话,制作出来的效果是非常有保障的,比如Unity3d就是一个不错的选择,当然场景导出后一般是需要在浏览器端安装一个Unity的插件的才能正常显示。前段时间还测试了一下输出HTML5文档,就因为数据量太大了就没继续深入测试了。有兴趣可以自己试一试。
个人认为就目前来说要在网上进行三维产品展示,通过webgl技术实现是一个比较折中的办法。很多人说webgl技术开发难度比较大,当然我也不否认,但你可以采用一些库呀框架之内的进行开发,比如Three.js blend4web之类的都可以。
至于你所说的参考,国外的有很多,之前了解这门技术的时候看过耐克,三星和保时捷官网的案例,国内的就说一个3dlook,也不知道我说明白没,总之,不懂就百度一下,有条件最好google。
关于WebGL的基本现状?
大部分手机浏览器都支持
WebGL(全写Web Graphics Library)是一种3D绘图协议,这种绘图技术标准允许把JavaScript和OpenGL ES 2.0结合在一起,通过增加OpenGL ES 2.0的一个JavaScript绑定,WebGL可以为HTML5 Canvas提供硬件3D加速渲染,这样Web开发人员就可以借助系统显卡来在浏览器里更流畅地展示3D场景和模型了,还能创建复杂的导航和数据视觉化。
显然,WebGL技术标准免去了开发网页专用渲染插件的麻烦,可被用于创建具有复杂3D结构的网站页面,甚至可以用来设计3D网页游戏等。
WebGL 的最大优势就是能通过网页做到快速传播,用酷炫的图形体验达到营销宣传等目的。
WebGL基本现状
WebGL 1.0 基本有98%的设备支持率,而 WebGL 2.0 有大概49%的设备支持率,并逐步在上升。
其中 WebGL 2.0 的重要特性有
WebAssembly方面:许多 C3D 引擎都开始涉及这块领域。比如 oryol,一个轻量级的 C 框架。其中物理模拟的部分通过 Webassembly 的方式去做,在 web 上做了个布料模拟的 demo。当然 Unity 和 Unreal 也都推出了自己基于 Webassembly 的 demo:
Unity:两个 demo,分别为:tank,webgl_linear。
Unreal:EpicZenGarden。
WebGL 研发中的新特性
英特尔的先进网络科技团队对 WebGL 的生态系统做出了许多贡献,因此新特性部分主要由他们来展示。
WebGL 2.0 Compute
研发描述:在 WebGL 实现 OpenGL ES 3.1 的功能,主要是 Compute Shader!
研发状态:
对于 OpenGL 和 D3D 后端 Compute Shader 都基本完成,通过在 Chrome 中设置 flag enable-webgl2-compute-context 可以使用。
基于 Compute Shader 的 Tensorflow.js 基本可以运行。
研发计划:
在今年末实现所有 Compute Shader 的特性。
在 Emscripten 中支持 WebGL 2.0。
将 Native dEQP ES 3.1 的样例移植到Web端。
根据需求实现 OpenGL ES 3.1的其他特性
常见的Web开发软件
基于 WEBGL 的 3D:three.js , osgjs其中 three.js 最火爆,是纯JS包osg 还有对应的 C++ 跟 .NET 包, OSGJS 并不是 OSG 的重点;专注于 WEB 3D GIS 的 WEBGL:osmstreet、openwebglobe、readymap这个是做 3D 城市规划的;基于 IE ACTIVEX OCX 的 3D:unity3D , 很火, 做WEB游戏,做 anroid 游戏, IE CHORME 都可以google earth 学习成本低;基于 AS3 的 3D:Away3d、FLASH 正在走下坡;
下方
运营:weikashouji
H5开发小游戏用什么引擎好_h5游戏一般是用什么开发的
Turbulenz
Turbulenz是一个开源的HTML5游戏引擎,提供了可以运行在Windows、MacOS、Linux上的SDK,允许开发人员创建高质量和硬件加速的2D、3D游戏。包括以下功能:异步资源加载、进行特效和粒子渲染、支持物理效果、碰撞检测以及动画、3D音效支持、支持网络交互以及社交网络分享、场景和资源的管理。
优点:
1.功能强大,同时支持2D和3D
2.基于MIT协议的开源引擎
Construct2
Construct2是一个运行于Windows平台的游戏制作工具,它可以让没有任何编程基础的用户在短时间内不写一行代码快速开发出一款可运行于所有平台(Windows、Mac、Linux、Android、iOS等)的游戏。版可以将游戏导出成HTML5。收费版本分为个人版(79英镑)和企业版(259英镑),可以导出所有平台的版本,同时提供了更多的特效和音乐。如果使用该工具盈利超过5000美元,需要升级到企业版。
优点:
1.简单易用,可实时运行游戏
2.强大的事件系统,可以不通过写代码来控制游戏逻辑
3.提供了可编程扩展的接口
4.提供了大量特效,支持物理效果
5.支持所有平台
6.完整的文档以及社区支持
缺点:
不如直接写代码灵活
ImpactJS
ImpactJS是一个基于JavaScript的HTML5游戏引擎,同时支持PC和移动平台浏览器。它是目前除了Construct2之外最受欢迎的HTML5游戏引擎,使用需要支付99美元。
优点:
1.提供了灵活的关卡编辑器,可以快速构建游戏地图
2.提供了强大的调试工具
3.提供了Ejecta可以将JavaScript的执行结果通过OpenGL渲染出来,可以在iOS平台上获得与原生应用相近的效率
4.文档齐全,有两本专门介绍ImpactJS开发的书
5.支持物理效果
6.支持自己编写插件来扩展
AppStore游戏
1.BiolabDisaster
2.DropJS
Cocos2d-html5
Cocos2d-html5是一款基于Cocos2d-xAPI的2D开源HTML5游戏引擎。它目前通过canvas进行渲染,将来会支持WebGL。它由国内Cocos2d-x核心团队主导开发和维护,行业领袖、HTML5大力推动者Google为这个项目提供支持。同时,Zynga、Google等大公司的工程师也参与到它的设计工作中。
优点:
1.与Cocos2d的API类似,容易上手
2.中文文档齐全,资料丰富
3.基于MIT协议的开源引擎
H5e教育html5开发解答
想要开发物联网3D应用,用thingjs方便还是threejs方便?
易景室内三维地图引擎(室内3D地图)提供地图浏览、缩放、旋转、图层显隐、室内定位、室内导航、全景等基础功能,支持自定义室内地图显示风格及样式,可自动绘制楼层热力图、散点图等专题地图,快速进行空间大数据分析展示。支持跨楼层精准的点到点之间的最短、最优路径计算,支持对路径结果进行导航和动画,并提供丰富的地图主题资源供二次开发调用,提供室内三维地图编辑器使用。
支持IE11、chrome、firefox、手机微信和H5页面室内定位和室内导航,可以参考下,加载速度快…………
推荐使用thingjs来开发,我们可以对比看一下threejs和thingjs,首先了解一下webGL。
WebGL可以处理3D图像,听起来是非常高兴的一件事,但是WebGL实在是太底层了,WebGl解决是如何再画布上画图的问题,怎么画点,线,面,怎么上色,怎么贴图,怎么处理光线,视角转动之后怎么换算绘制等等。这些对于一个做3D应用的开发者来说要学的东西太多了。Threejs库的出现解决了底层的渲染细节和复杂的数据结构,终于将复杂的底层细节抽象出来,使得大家开发3d应用更容易了一些。和很多开发者交流threejs都是他们首次接触的WebGL 3D库,并能很容易的就能开始做一些实验。但是使用Threejs开发应用还是门槛很高,但就一个加载模型,调光,选择模型弹框的功能,就能干出Threejs上百行代码。同时还有很多复杂的3D概念需要理解。这时就需要ThingJS了。
ThingJS是更为上层的抽象,不用关心,渲染,mesh,光线等复杂概念。它抽象是一个个具体的模型,ThingJS封装了对模型交互事件的各种api,比如单击,左键,鼠标滑过等,ThingJS封装了对模型的操作,例如移动,放大缩小,上色,勾边,甚至开门,ThingJS还封装了模型的层次关系,例如物体是放在某个房间里的,房间又在某个楼层,楼层又是某个大楼的。大楼在园区里。
更多了解可以看一下网页链接