日志

Blend4Web 17.04 发布

2017-04-26

我们很高兴地介绍一个新的Blend4Web版本,这是一个用于创建交互式在线3D体验的商业级开源框架。 对于17.04,我们努力提供了许多有用的功能,例如支持HTC Vive控制器(展示新演示),改进的光晕效果,更平滑的LOD切换算法,Cycles背景节点,升级的法线编辑器,物理引擎的WebAssembly 和gzip压缩,这显着加快了加载时间。

HTC Vive 控制器

这是将VR功能带入Blend4Web的一个重要里程碑。现在支持流行的HTC Vive头盔控制器!我们准备了一个简约而令人兴奋的例子,您可以尝试在3D场景中拾取,移动和投掷物体。

WebVR仍然是一项非常年轻的技术,只能在实验浏览器构建中工作。 您可以在这里找到详细说明。会议还将有一个虚拟现实摊位(见下文)。

WebAssembly

WebAssembly (又名wasm)是允许执行二进制代码的尖端技术在接近原生速度的浏览器。例如,可以将C / C ++程序编译为wasm格式,然后在网络应用程序中加载并运行它。最近在最新版本的Chrome和Firefox中启用了WebAssembly。

WebAssembly商标。

WebAssembly旨在最终取代 Emscripten(asm.js),一个C / C ++到JavaScript编译器,由于更紧凑的格式和更好的性能。Blend4Web目前正在使用Emscripten在浏览器中运行uranium.js物理引擎(forked Bullet引擎,最初用C ++编写)。

今天,我们介绍一个实验WebAssembly构建Blend4Web的物理引擎(635 kb和1 Mb asm.js)。目前,默认情况下禁用,但您可以将physics_use_wasm设置为true使用 config API

Cycles的世界材质

我们继续致力于在Blend4Web中提供使用Blender的非实时渲染器Cycles的功能。对于此版本,我们专注于支持用于设置天空渲染的Background节点。

Cycles的世界材质。

您还可以使用Environment Texture节点为背景提供颜色数据; 支持EquirectangularMirror Ball投影类型。

用于背景的等角图。Suzanne模型具有适用于其表面的简单光面BSDF材料。图片由texturify.com提供。

最后,世界材料可以照常使用 Value RGB 节点(也可以通过NLA编辑器)进行动画。请记住,打开World选项卡下的使用节点选项开始使用所有这些功能。

法线编辑器

得益于Blend4Web用户的反馈,已经流行的法线编辑器获得了更多功能。首先,以前不断请求的现在能在多个选定的面上运行 Face 操作符。已经添加了一个新的按钮 Scale ,用于沿轴缩放法线。为此,请按键盘上的X,Y或Z。另外,按数字以指定比例值。例如零平坦法线。

升级法线编辑器

正如你可以在屏幕截图中看到的,一些旧的对齐按钮被删除,添加一些新的。 这反映了新的功能:旧的Tree按钮已经成为3D Cursor,因为它现在可以将法线远离和朝向一个点对齐。 旧的Foliage按钮只能向上旋转法线 - 现在称为Axis,可以在X,Y和Z方向上工作。 我们还引入了Factor和其他设置,使这些操作员更加灵活。

Factor和其他选项现在可用于对齐操作。

顺便说一下,我们已经添加了 API 来渲染物体的法线, show_normals() hide_normals(),这可能有助于引擎中的调试目的。

gzip压缩

使用gzip格式的数据压缩是加速通过所有主要网络浏览器支持的网络加载数据的流行方法。 配置一个网络服务器来提供gzip压缩的内容,可以在Blend4Web应用程序代码和在线部署的资产上自动执行压缩。

Google Chrome的开发人员工具(由F12调用)可以概述压缩文件的内容,以及什么不是压缩文件的内容。

以下是我们如何使用gzip与Nginx Web服务器处理blend4web.com的示例。在 nginx.conf 中,我们放了以下几行:

gzip on;
gzip_types text/css application/javascript application/json model/b4w-bin image/dds image/pvr;

请注意,除了通常使用的JavaScript,CSS和JSON类型之外,我们还有一些Blend4Web特定条目,如model/b4w-bin,应在不同的配置文件中进行描述,mime.types

model/b4w-bin    bin;
image/dds        dds;
image/pvr        pvr;

虽然我们认为这是最佳实践方式,大部分的人无法直接存取或操作企业网络服务器或不具备足够的专业去修改配置文件。这就是为什么,从今天开始,Blend4Web提供了一个内置的gzip(解)压缩器,您可以使用它来压缩应用程序中的资源,牺牲一点处理时间。

对于编程应用程序,可以使用 assets_gzip_available 初始化选项来启用gzip压缩。

exports.init = function() {
    m_app.init({
        canvas_container_id: "main_canvas_container",
        callback: init_cb,
        assets_gzip_available: true
    });
}

要压缩资源,只需在项目管理器中运行convert resources。您也可以手动将.json.bin文件保存为.json.gz.bin.gz。顺便说一下,gzip压缩补充了纹理压缩(旨在保存视频内存),以便您的.dds .pvr转换的纹理也可以被调整。

对于非编码的基于网络播放器的应用程序,只需在使用项目管理器创建它们时选择Use gzip compression。或者,您可以在URL中指定compressed_gzip

压缩的结果可以在Farm演示的示例中清楚地看到:.json文件是693 kb,而10.6 Mb未压缩(即15倍!)和.bin文件是13.6 Mb,而37.9 Mb未压缩(几乎3倍)。请记住,您可以通过配置您的网络服务器来利用本机gzip压缩来实现更高的效率!

详细程度

这次我们有更多的LOD系统改进。 现在可以更顺利地执行LOD切换,这是因为丢弃具有距离的像素,这使得转换不太明显。 相应的选项称为LOD Smooth Transitions,可以在Object Clustering & LOD面板的Scene选项卡下进行调整。 请记住,为所有物体启用此功能可以显着降低应用程序性能。

LOD转换算法在行动中。

此外,当相机移动到两个LOD电平之间的边界附近时,添加了一个新选项Max LOD Hysteresis Interval以消除连续的LOD切换。此选项替换了基于每个物体使用的旧的LOD Transition Ratio参数。

新推出的LOD设置。

改进的光晕

已经实现了一种新的光晕算法,其可以与所有灯类型一起使用,并且不依赖于光的方向。该算法在内部使用自适应平均亮度计算来提高精度。

来自BlendSwap的Ryan Haldeman和Christino Malaysianto的人物在Blend4Web中应用。

其他特性

已经实现了用于动态阴影的RGBA打包后降功能,实现在无硬件深度纹理的支持(11%的Internet用户根据WebGL统计)。 另一个后降:如果缺少压缩场景(gzip)或纹理(dds / pvr),引擎将尝试加载非压缩资源。

Blender新开发的 Alpha Anti-Aliasing 混合模式现在也可以在Blend4Web中使用。 这本质上是改进的Alpha Clip技术(它简单地丢弃所有经常用于渲染树叶的alpha <0.5的像素)。 这种效果在运动中和/或当对象本身是动画时尤其明显。

抗锯齿透明度(右侧)与通用Alpha Clip透明度(左侧)相比较。

可以在Material标签下选择Alpha Anti-Aliasing透明度模式。 还需要在Blender用户设置中启用多重采样,使其在视口中可见。

由于需要启用MSAA,此功能仅适用于支持WebGL 2.0的浏览器; 否则会退回到Alpha Clip模式。

最后

请参阅发行说明中的更改和错误修复的完整列表。一如往常,我们欢迎您在论坛上提供有关新功能的反馈或建议。

另外,由于距离Blend4Web会议开幕不到两周,我想提醒那些无法参加的朋友会议串流将在此页面。我们在会议中见,并为网络blending快乐!

评论
03 jul. 2017 03:46
你好!最近对b4w比较感兴趣,因为是跟我公司的产品比较契合,了解了一下后发觉b4w已经开发一段时间了,但一直没有太多的人使用,你是开发者吗?你对b4w的前景有信心吗?
注册登录 后发送信息。