天空盒:顶
更新时间：2021-05-27
天空盒/顶
目前百度AR可实现的天空盒制作方式有两种，呈现360°全景观看，天空顶的制作方式一种，仅呈现上空效果显示。
天空盒
实现
- 立方体天空盒：通过百度AR提供的天空盒图片切割工具，可将一张全景图片切割为前后左右上下六张图片，实现天空盒效果（常用于直接切入天空盒内部的需求场景）。
- 模型天空盒
非SLAM类型效果不佳：给一个模型内部贴上贴图，外面套一个透明且相同的模型，通过进入非透明模型内部体验天空盒效果（常用于传送门等需要用户有进入感的需求场景）。
工具及模型下载
六面体天空盒切割工具密码：8mgm
立方体天空盒 实现
天空盒通常仅需显示即可，通过在scene中设置天空盒节点，并对该节点操作显示或隐藏即可。除了节点的设置，天空盒的shader也是不能少的，需通过GitHub获取最新的skybox shader。 <立方体天空盒 sample>
- 首先应该配置skybox类的节点，通过设置visible来控制天空盒项目任意交互中的显示需求。天空盒内部如果要显示其他类型的素材，需要将天空盒调大点，视觉效果上的大取决于天空盒图片，实际的大可以避免手势交互的过程中出现穿透问题。
代码参考如下:
{
"name": "skybox",
"type": "skybox",
"touchable": 0,
"visible": 1,
"position": "0,0,0",
"scale": "512, 512, 512",
"rotation": "0,90,0",
"material": {
"common": {
"defaultShaderName": "skyboxShader",
"textureList": [
{
"textureShaderName": "tCube",
"textureName": "res/texture/park.jpg",
"textureType": "cubeMap"
}
]
}
}
},- 其次应该配置相机的默认朝向及位置，保证相机处于天空盒内部，从而实现天空盒效果。(注意:
如果不配置该节点，在camera节点参数未更改，且天空盒position为0,0,0 的情况下，天空盒会以立方体形态显示在屏幕中，如果开启手势，可交互。)
代码参考如下 :
"cameraDefaultLookAt": {
"eyePos": "0,0,0",
"centerPos": "0,-1,0",
"upDirection": "0,0,-1"
},模型天空盒 实现
模型天空盒本质是在pod模型内部显示贴图，开启SLAM后该球体模型会固定在初始位置，通过移动手机可以实现近大远小的效果。所以模型天空盒不需要特定的skybox shader，用pod shader即可。
本质:将贴图显示在模型内部，通过更改贴图改变内置场景，其它与普通pod没什么区别，按照正常pod的实现方式实现即可。- 直接给模型附加贴图，渲染出来外层也同样显示，根据项目需求，类似
传送门如果外层依旧显示是无法满足需求的，那么需要我们在原有的模型基础上，套上一个完全相同且大一点的透明模型(通过指定透明贴图实现)，且scene中透明的模型需要先于具体模型渲染。
json 代码参考如下:
{
"name": "door_alpha",
"type": "pod",
"visible": 1,
"touchable": 1,
"meshFileName": "res/model/Door_alpha.pod",
"material": {
"common": {
"texturePath": "res/texture/",
"disableLightEffect": 1
}
},
"position": "0,0,0",
"scale": "5.1,5.1,5.1",
"rotation": "90,180,0",
"chirlden": []
},
{
"name": "door",
"type": "pod",
"visible": 1,
"touchable": 1,
"meshFileName": "res/model/Door.pod",
"material": {
"common": {
"texturePath": "res/texture/",
"disableLightEffect": 1
}
},
"position": "0,0,0",
"scale": "5,5,5",
"rotation": "90,180,0",
"chirlden": []
}天空顶
天空顶的实现原理
本质:在球体模型内部上方显示贴图。贴图要求:贴图大小占球体模型的10%，且需要有从圆心到圆边渐变淡化的效果。实现方式:类似于球形天空盒，区别在于从场景开始时camera就处于天空顶效果下方，或者在需要的情景下让天空顶出现在camera上方。- 适用于天空顶球体模型素材
顶部贴图注意
不符合贴图要求示例
符合贴图要求规范示例
天空顶 code
天空顶类似于模型天空盒，将camera至于模型内部，模型内顶部贴一张贴图，从而实现天空顶的效果。因此天空顶也不需要特定的shader，用pod shader即可实现<天空顶 sample>。
代码参考如下:
{
"name": "sky",
"type": "pod",
"visible": 1,
"touchable": 0,
"meshFileName": "res/model/Qiu.pod",
"material": {
"common": {
"texturePath": "res/texture/",
"disableLightEffect": 1
}
},
"position": "0,0,7000",
"scale": "3000, 3000, 3000",
"rotation": "90,0,0",
"chirlden": []
},