threejs-scenes

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese

When to use this skill

何时使用此技能

ALWAYS use this skill when the user mentions:
  • Scene
    as root,
    scene.background
    , environment or skyball setup at scene level
  • Fog
    or
    FogExp2
    parameters (
    near
    ,
    far
    ,
    color
    , density) and interaction with camera far plane
  • Organizing render lists conceptually (children of scene)
IMPORTANT: scenes vs textures vs loaders
ConcernSkill
Scene + fog APIthreejs-scenes
Texture sampling, PMREM generator usagethreejs-textures
Fetching HDR/glTFthreejs-loaders
Trigger phrases include:
  • "Scene", "Fog", "FogExp2", "background", "雾"
  • "场景根节点", "线性雾", "指数雾"
当用户提及以下内容时,务必使用此技能:
  • 作为根节点的
    Scene
    、
    scene.background
    、场景层级的环境或天空球设置
  • Fog
    或
    FogExp2
    的参数(
    near
    、
    far
    、
    color
    、density)以及与相机远平面的交互
  • 从概念上组织渲染列表(场景的子元素)
重要提示:场景、纹理与加载器的区别
涉及内容对应技能
场景+雾效APIthreejs-scenes
纹理采样、PMREM生成器使用threejs-textures
HDR/glTF文件获取threejs-loaders
触发短语包括:
  • "Scene"、"Fog"、"FogExp2"、"background"、"雾"
  • "场景根节点"、"线性雾"、"指数雾"

How to use this skill

如何使用此技能

  1. Instantiate
    Scene
    and add lights/meshes/cameras as children per graph rules (threejs-objects).
  2. Choose fog: linear
    Fog
    vs exponential
    FogExp2
    for outdoor/horizon feel.
  3. Tune fog
    near
    /
    far
    alongside camera
    far
    to avoid clipping artifacts.
  4. Set
    scene.background
    to
    Color
    ,
    Texture
    , or cube map per docs; env lighting still needs matching renderer/material settings.
  5. When user wants IBL from HDR file, point to loaders → textures → materials pipeline explicitly.
  6. Document that fog does not replace frustum culling for performance.
See examples/workflow-fog-background.md.
  1. 实例化
    Scene
    ,并按照场景图规则添加灯光/网格/相机作为子元素(参考threejs-objects技能)。
  2. 选择雾效类型:线性
    Fog
    或指数型
    FogExp2
    ,用于营造户外/地平线效果。
  3. 配合相机的
    far
    参数调整雾效的
    near
    /
    far
    值,避免裁剪伪影。
  4. 按照文档将
    scene.background
    设置为
    Color
    、
    Texture
    或立方体贴图;环境光照仍需匹配渲染器/材质设置。
  5. 当用户需要从HDR文件获取IBL时,明确指引其使用加载器→纹理→材质的工作流。
  6. 说明出于性能考虑,雾效不能替代视锥体剔除。
参见examples/workflow-fog-background.md。

Doc map (official)

文档地图(官方)

Scope

适用范围

  • In scope:
    Scene
    , fog types, background field semantics at API level.
  • Out of scope: HDR / glTF file fetch (threejs-loaders); PMREM and texture sampling (threejs-textures); tone mapping / output color space defaults (threejs-renderers); full-screen fog-only post stack (threejs-postprocessing) unless tying to scene
    Fog
    ; custom atmospheric scattering shaders beyond core fog API.
  • 适用范围:
    Scene
    、雾效类型、API层面的背景字段语义。
  • 不适用范围: HDR/glTF文件获取(threejs-loaders);PMREM与纹理采样(threejs-textures);色调映射/输出颜色空间默认设置(threejs-renderers);仅含全屏雾效的后处理栈(threejs-postprocessing,与场景
    Fog
    关联的情况除外);超出核心雾效API范围的自定义大气散射着色器。

Common pitfalls and best practices

常见陷阱与最佳实践

  • Fog color should harmonize with background to hide the horizon seam.
  • Very large
    far
    on camera with fog still needs scene scale consistency.
  • background
    rotation/intensity features depend on renderer version—cite current docs.
  • 雾效颜色应与背景相协调,以隐藏地平线接缝。
  • 即使使用雾效,相机的
    far
    值过大时仍需保证场景比例一致。
  • background
    的旋转/强度特性取决于渲染器版本——请引用当前版本文档。

Documentation and version

文档与版本

Scene
,
Fog
, and background fields are documented under Scenes in three.js docs. Environment-related visuals often combine this skill with threejs-textures (PMREM) and threejs-loaders (HDR files)—link those pages when the user moves from “fog color” to “HDR sky”.
Scene
、
Fog
和背景字段的相关说明位于three.js 文档的场景(Scenes)板块下。环境相关的视觉效果通常需要将此技能与threejs-textures(PMREM)和threejs-loaders(HDR文件)结合使用——当用户从“雾效颜色”转向“HDR天空”相关问题时,请提供这些页面的链接。

Agent response checklist

Agent响应检查清单

When answering under this skill, prefer responses that:
  1. Link
    Scene
    ,
    Fog
    , or
    FogExp2
    official pages.
  2. Relate fog distances to threejs-camera
    far
    plane and world scale.
  3. Defer PMREM/HDR file steps to threejs-textures / threejs-loaders with one sentence each.
  4. Avoid duplicating full color-management tutorials—point to renderer + textures skills.
在此技能下回答问题时,优先满足以下要求的响应:
  1. 附上
    Scene
    、
    Fog
    或
    FogExp2
    的官方文档链接。
  2. 将雾效距离与threejs-camera的
    far
    平面及世界比例关联起来。
  3. 将PMREM/HDR文件相关步骤引导至threejs-textures/threejs-loaders技能,每个技能用一句话说明即可。
  4. 避免重复完整的色彩管理教程——引导用户参考渲染器+纹理相关技能。

References

参考资料

Keywords

关键词

English: scene, fog, fogexp2, background, environment, three.js
中文: 场景、雾、Fog、背景、环境、three.js
英文: scene, fog, fogexp2, background, environment, three.js
中文: 场景、雾、Fog、背景、环境、three.js