其中绿色底色的代表Demo中表现出的能力比较成熟,可以直接应用。
脑图地址:http://naotu.baidu.com/file/3392a895a903972520b2f65fda12ee3c?token=55695cff60c6e275
Web AR的兼容性,可以认为是其用到两大核心技术的兼容性:
WebRTC:
WebGL:
公司的王者荣耀貂蝉AR广告, 《Web前端也能做的AR互动》
实际上就是一个基于Three.js渲染模型,并自行基于Three.js实现空间定位的一个AR应用。效果类似的是awe.js的空间定位功能,下面的Demo中有提供。
其开发模式为:
UI开发
开发or导出貂蝉游戏人物模型
开发人物皮肤贴图纹理
开发模型动画
使用3D软件导出Three.js支持的模型格式(这里看似简单,实际有大坑,不同的模型、骨骼、贴图、动画,导出时会有不同问题,还要控制模型资源大小,不能过大)
前端开发
· WebGL全景场景(不支持WebRTC设备柔性降级)
· 空间定位开发
· 模型渲染
· 交互与动画控制
· 终端适配
整理了部分Demo:https://artoolkittest.sparta.html5.qq.com/
Artoolkit的js版本,支持pat marker和nft marker的识别与跟踪,配合threejs可渲染模型,目前的问题是nft marker跟踪的帧率不高。
JsArtoolkit的项目地址为:https:/