<pc-sky>
<pc-sky> 用图像提供绘制在其他内容后的天空背景,启用 lighting 时,还提供材质照明与反射环境。
用法
- 必须直接位于
<pc-scene>下。
属性
| 属性 | 类型 | 默认值 | 说明 |
|---|---|---|---|
asset | 资源 ID | - | 必须引用 texture 资源 |
center | Vector3 | "0 0.01 0" | 天空中心 X Y Z,范围 0 到 1,用于 box 和 dome |
enabled | Boolean(布尔) | "true" | 是否绘制背景,不影响 lighting,false 时仍照亮场景 |
intensity | Number(数字) | "1" | 天空及其照明亮度 |
lighting | Boolean(布尔) | "false" | 是否同时提供图像照明和反射,在图像加载时读取 |
mip-level | Number(数字) | "0" | 天空盒 mip,0 最清晰,增大选择更模糊层,无需修改纹理。需要 lighting 生成模糊 mip |
rotation | Vector3 | "0 0 0" | X Y Z 角度制欧拉角 |
scale | Vector3 | "100 100 100" | X Y Z 缩放,用于 box 和 dome |
type | Enum(枚举) | "infinite" | "box" | "dome" | "infinite",隐藏时仍保留类型 |
示例
等距柱状纹理采用 dome 投影并照亮场景。拖动环顾,可改为 infinite、旋转 0 90 0、enabled=false 仅保留光照,或提高 mip-level 柔化:
<pc-app>
<pc-asset src="https://cdn.jsdelivr.net/npm/[email protected]/scripts/esm/camera-controls.mjs"></pc-asset>
<pc-asset id="skybox" src="https://developer.playcanvas.com/assets/sepulchral-chapel-rotunda-4k.webp"></pc-asset>
<pc-scene>
<pc-sky asset="skybox" type="dome" center="0 0.05 0" scale="20 20 20" lighting></pc-sky>
<pc-entity name="camera" position="0 1.5 5">
<pc-camera clear-color="#1d1f2b"></pc-camera>
<pc-script>
<pc-script-instance name="cameraControls" enable-pan="false" pitch-range="-90 0" zoom-range="2 12"></pc-script-instance>
</pc-script>
</pc-entity>
<pc-entity name="sphere" position="0 1 0">
<pc-render type="sphere"></pc-render>
</pc-entity>
</pc-scene>
</pc-app>
JavaScript 接口
可以通过 SkyElement API创建和操作元素。
各 attribute 有对应 property。天空本身位于底层 Scene 的 sky 和环境图集中,可通过 pc-scene.scene 访问。
另请参阅
<pc-asset>:等距柱状纹理。<pc-scene>:曝光及天空状态。<pc-light>:补充直接光照。