<pc-gsplat>
<pc-gsplat> 添加高斯泼溅组件，以数百万个柔软彩色小椭球表示捕获的三维场景。
为获得良好性能，建议在 <pc-app> 设置 antialias 为 false、max-pixel-ratio 为 1。
用法
- 必须直接位于
<pc-entity>、<pc-model>或<pc-node>下。
属性
| 属性 | 类型 | 默认值 | 说明 |
|---|---|---|---|
asset | 资源 ID | - | 必须引用 gsplat 资源 |
cast-shadows | Boolean（布尔） | "false" | 是否投射阴影 |
enabled | Boolean（布尔） | "true" | 组件启用状态 |
lod-base-distance | Number（数字） | "5" | LOD 0 到 1 的首次切换距离，近于此值使用最细层级。单位为世界单位，并按视野角补偿，最低 0.1，仅多 LOD 资源生效 |
lod-multiplier | Number（数字） | "3" | 相邻 LOD 切换距离倍率，较粗层从前一层起始距离乘此值处开始。越大可在远处保留细节，但更占内存，最低 1.2，仅多 LOD 资源生效 |
lod-range-max | Number（数字） | "99" | 允许的最大 LOD 索引，含边界，不会使用更粗层。默认 99 相当于不限制，仅多 LOD 资源生效 |
lod-range-min | Number（数字） | "0" | 允许的最小 LOD 索引，含边界，不会使用更细层。增大可避免下载最高质量的大文件，仅多 LOD 资源生效 |
细节层级
流式资源导出时包含 LOD，pc-asset 的 src 指向 lod-meta.json，先下载元数据，再按需获取数据。因为是 JSON，应显式设 type="gsplat"。细节按距离降低，先到 lod-base-distance，再按 lod-multiplier 扩大后续距离。引擎还有场景级高斯点预算，在全部 pc-gsplat 间分配，位于 <pc-scene>；本标签决定各资源如何随距离衰减：
| 属性 | 所属标签 | 控制内容 |
|---|---|---|
gsplat-splat-budget | <pc-scene> | 场景渲染点数，默认一百万，0 或更小表示无预算 |
gsplat-splat-budget-mode | <pc-scene> | 默认 target 提高细节直至用满预算，距离只控制分布与衰减；limit 按距离决定细节，仅在超预算时降低，因此远处资源只使用必要点数 |
lod-base-distance, lod-multiplier | <pc-gsplat> | 本资源细节降低的距离，增大可在远处保留细节 |
lod-range-min, lod-range-max | <pc-gsplat> | 无论距离和预算如何决定，都限制最终索引；提高最小值可避免下载最大文件 |
<pc-asset id="capture" src="capture/lod-meta.json" type="gsplat"></pc-asset>
<!-- ... -->
<pc-scene gsplat-splat-budget="1500000" gsplat-splat-budget-mode="limit">
<pc-entity name="capture">
<pc-gsplat asset="capture" lod-base-distance="8" lod-range-min="1"></pc-gsplat>
</pc-entity>
</pc-scene>
无预算时，target 对所有内容使用最细层，limit 仅根据距离。没有 LOD 的普通 PLY 或 SOG 始终完整渲染，但占用预算，减少流式资源可用额度。
流式高斯泼溅示例先将 lod-range-min 固定到最粗层，快速显示全场景，再移除限制，逐步加载精细层，展示预算作用。
随机渲染
通常每帧排序后进行 Alpha 混合。WebGPU 上，pc-scene 的 gsplat-stochastic 可不排序，改用抖动覆盖率和深度写入，省去排序但产生细噪声，可由时间抗锯齿平滑。gsplat-dither 选择图案。WebGL 忽略两者。
<pc-scene gsplat-stochastic gsplat-dither="bayer4">
示例
真实玩具扫描得到的高斯场景，可拖动环绕、滚轮缩放，并注意上述 pc-app 推荐设置：
<pc-app antialias="false" max-pixel-ratio="1">
<pc-asset src="https://cdn.jsdelivr.net/npm/[email protected]/scripts/esm/camera-controls.mjs"></pc-asset>
<pc-asset id="toy" src="https://developer.playcanvas.com/assets/toy-cat.sog"></pc-asset>
<pc-scene>
<pc-entity name="camera" position="0 0 2.5">
<pc-camera clear-color="#1d1f2b"></pc-camera>
<pc-script>
<pc-script-instance name="cameraControls" enable-pan="false" zoom-range="1 5"></pc-script-instance>
</pc-script>
</pc-entity>
<pc-entity name="toy" position="0 -0.7 0" rotation="0 0 180">
<pc-gsplat asset="toy"></pc-gsplat>
</pc-entity>
</pc-scene>
</pc-app>
JavaScript 接口
可以通过 GSplatComponentElement API创建和操作元素。
component 是底层 GSplatComponent，就绪前为 null，其余功能可通过它访问。
另请参阅
<pc-asset>：声明 gsplat 文件。<pc-app>：推荐图形设备设置。- 使用 Web Components：逐步创建第一个应用。