22万个木箱！TWaver 3D极限压榨

打开个门户网站都千呼万唤，我们还能期待网页上的3D技术会有“酣畅淋漓”、“一气呵成”的感受吗？也许现在还差点火候。但是HTML5、WebGL等技术一直在飞速的发展，可能很快你就会惊讶它的能力。现在，我们就试试TWaver的3D能显示多少个木箱子，透明的木箱子。数据量当然要大才行，10万个怎么样？干脆试试20万好了，具体说是60的立方矩阵=60x60x60=216000个。只有压榨到极限才能了解WebGL和TWaver 3D技术适合做什么应用。

下面就Let’s go吧！

首先new一个box和network放在网页上：

var box = new mono.DataBox();

var camera = new mono.PerspectiveCamera(60, 10 / 7, 0.1, 10000);

var network = new mono.Network3D(box, camera, 'canvas');

然后创建箱子对象。定义一个矩阵规模数量，循环new出count*count*count个箱子对象矩阵。为每个箱子设置其矩阵中的空间位置、设置透明贴图，最后add到box中进行显示即可。

暂设箱子间距gap为40，矩阵层数为3，则总计数量为3x3x3=27个：

var gap = 40, count = 3;

for (var k = 0; k < count; k++) {

for (var i = 0; i < count; i++) {

for (var j = 0; j < count; j++) {

var node = new mono.Cube(20, 20, 20, 1, 1, 1);

node.setStyle('m.texture.image', 'box.png');

node.setPosition((i - count * 0.5) * gap, k * gap, (j - count / 2) * gap);

box.add(node);

}

27个箱子实在太少了，就像大象拖鹅毛，实在是没感觉。现在增加count到20，总计=20x20x20=8000个箱子。看看效果：

加载多费了一两秒。操作起来还是快如飞车，刷刷流畅，毫无压力！看来要上大刑伺候才行了，继续增加count到40，总计=40x40x40=64000个箱子。看效果：

加载耗时时间长了许多，不过显示和操作还是相当流畅。看来还不是极限，有继续压榨的空间。出大招：增加count到60，总计=60x60x60=216000。将近21万个箱子，TWaver 3D在浏览器上会表现怎么样呢？

哈，果然加载时间更加长了，浏览器甚至2次出现了“不响应”提示。为了看到结果，果断点击wait选择继续等待。

耗时虽久，不过最终结果还是出来了。21.6万个箱子，一眼望去，基本上是千军万马，茫茫一片。

操作了一下，让人惊讶的是，虽然不算流畅，但还是可以响应鼠标操作的。考虑到这么大的海量数据，还算可以接受。箱海中漫游，竟然无意发现一只可爱的小动物！

不必惊讶，仅仅是因为增加了下面的几行代码就行了：

var billboard = new mono.Billboard();

billboard.s({

'm.texture.image' : 'dog.png',

'm.vertical' : true,

'm.alignment' : mono.BillboardAlignment.bottomCenter,

});

var position = node.getPosition();

billboard.setPosition(position);

box.add(billboard);

接下来你可以做一个“找狗狗”或“找小鸟”的游戏了。

点击观看TWaver显示22万个木箱视频。

那么问题来了：这是TWaver 3D和WebGL的极限吗？不一定。WebGL和TWaver 3D的发展都是日新月异、一日千里，随着标准、产品、硬件、经验的不断提升，基于网页的3D展示能力肯定会有更大的提升和发展。到时候，复杂的3D应用在PC、平板、手机的网页上顺畅的跑，那都不是个事儿！

当然，性能和机器的配置有巨大的关系，尤其是显卡、CPU等关键硬件配置。强大的硬件永远是提升3D应用流畅度的最直接的手段。平板甚至手机的硬件能力比PC会弱很多，在实际应用中，不可能期待手持设备能显示海量的3D数据和复杂的物理场景。在实际3D应用开发中，我们还需要有针对性的对场景进行优化、精简，尽可能的保证用户的交互和视觉体验，然后再尽可能的显示更多的信息。

当然，使用TWaver 3D就会帮您节省更多的时间和成本：因为它已经封装好了绝大部分功能，开发者不需要深入的研究**GL甚至显卡等细节，关注在业务和数据上就好了。如果您对TWaver的3D技术感兴趣，那就马上下载体验吧！

夯下面链接，观看22万个木箱！TWaver 3D极限压榨更多精彩！

http://v.youku.com/v_show/id_XODU3MjczMDgw.html

22万个木箱！TWaver 3D极限压榨相关推荐

阜阳男子拿22万硬币去银行转账，银行员工数钱数到“手抽筋”
载着22万硬币去银行存款,咋一看好像是哪一个客户跟银行在开玩笑,但这可不是玩笑,而是真实发生的一个事情. 事情回顾. 2019年4月2日上午,安徽阜阳阜南农商银行焦陂支行在办理一起业务时,一位客户想转 ...
牛X，试用了下GitHub上22万Star的第一抢票神器，3秒钟抢到！
车栗子发自凹非寺量子位报道 | 公众号 QbitAI 春节抢票正在如火如荼的进行,过年回家那肯定需要抢票,每年的抢票大战,都是一场硬战,没有一个好工具,怎么能上战场死锁呢.今天小编推荐一个Py ...
惊呆了！被公司辞退拿了22万补偿金，原东家称每月涨薪7000，只要退还22万
点击关注公众号,实用技术文章及时了解程序员求职面试(ID:CoderJob)整理内容参考自:脉脉等被公司辞退,领到了22万补偿金,就在楼主准备入职新公司的时候,接到了原东家HR电话,想让他回去继 ...
拿着 22 万美元年薪，混得还不如实习生？
"我曾尝试引入非结构化开发环境的流程:我曾尝试从运行生产服务的后台到为没有生产经验的人运行项目提供支持:我曾尝试改善工作流程和引入可重复的测试......我做了一切尝试,然而全都以失败告终. ...
GitHub 上 22 万star的第一抢票神器，3秒钟抢到！
点击上方"Github中文社区",关注看遍Github好玩的项目来自:量子位春节抢票正在如火如荼的进行,过年回家那肯定需要抢票,每年的抢票大战,都是一场硬战,没有一个好工具,怎 ...
TWaver 3D作品Viewer查看器
为了让开发者更方便的对各类3D模型.设备.物体进行浏览和查看,我们直接封装了mono.Viewer组件.它可以直接根据给定的数据源(json.obj.url等)进行数据加载和浏览展示.对于一般的3D设 ...
厉害了！世界首例AI诈骗案出现：公司高管接老板电话被骗22万欧元
欢迎关注数据猿数据猿官网 | www.datayuan.cn 今日头条丨一点资讯丨腾讯丨搜狐丨网易丨凤凰丨阿里UC大鱼丨新浪微博丨新浪看点丨百度百家丨博客中国丨趣头条丨腾讯云·云+社区人工智能软件 ...
程序员面试：一年内年薪22万涨到60万，你来不来？网友：评论炸锅了！
Python实战社群 Java实战社群长按识别下方二维码,按需求添加扫码关注添加客服进Python社群▲ 扫码关注添加客服进Java社群▲ 程序员求职面试(微信号:CoderJob)整理现如 ...
惊呆了！被公司辞退拿了 22 万补偿金，原东家称每月涨薪 7000，只要退还 22 万...
点击关注公众号,回复"1024"获取2TB学习资源! 被公司辞退,领到了22万补偿金,就在楼主准备入职新公司的时候,接到了原东家HR电话,想让他回去继续工作,并且承诺每月涨薪700 ...

22万个木箱！TWaver 3D极限压榨

22万个木箱！TWaver 3D极限压榨相关推荐

最新文章

热门文章