glsl-atmosphere 11个参数逐个精讲从地球参数到自定义外星天空【免费下载链接】glsl-atmosphereRenders sky colors with Rayleigh and Mie scattering.项目地址: https://gitcode.com/gh_mirrors/gl/glsl-atmosphereglsl-atmosphere 是一个轻量级GLSL 天空渲染着色器基于 Rayleigh瑞利散射与 Mie米氏散射一次函数调用即可在 WebGL 场景中算出真实的蓝天、橙红晚霞与太空视角。本文带你逐个精讲它的11 个参数先照抄地球配置还原真实大气再微调出属于你的外星天空。一、原理速览天空的颜色是算出来的 真实天空的颜色来自两类散射Rayleigh 散射空气分子对短波蓝光散射更强所以白天天空偏蓝日落时阳光穿过更厚的大气蓝光被滤掉只剩橙红色Mie 散射尘埃、水汽等大颗粒造成几乎不分波长且强烈朝太阳方向散射形成太阳周围的白雾感与眩光glsl-atmosphere 的思路很直接从相机沿视线方向步进采样同时沿太阳方向采样累加两段光路的光学深度再按相位函数加权合成最终颜色。核心实现只有一个函数atmosphere见index.glsl采样步数固定在文件顶部主射线 16 步、太阳射线 8 步性能开销很小。二、快速上手安装与调用入口一条命令安装到项目npm install glsl-atmosphere在片元着色器中通过 glslify 引入并调用#pragma glslify: atmosphere require(glsl-atmosphere) vec3 color atmosphere(r, r0, pSun, iSun, rPlanet, rAtmos, kRlh, kMie, shRlh, shMie, g);就是这11 个参数决定了一切。完整可运行示例见example/example.frag与example/example.vertJS 侧驱动逻辑在example/index.js。三、11 个参数逐个精讲1️⃣ 视角三件套r、r0、pSun参数类型作用示例值rvec3归一化视线方向即穿过该像素的射线normalize(vPosition)r0vec3射线起点观察者眼睛位置单位米(0, 6372000, 0)pSunvec3太阳位置函数内部会自动归一化(0, 0.1, -1)使用要点r必须是单位向量通常取像素方向后归一化r0以米为单位、以地心为原点示例中 6372000 米 地表6371000 米上方约 1 千米把pSun摆到不同高度就能从正午蓝天扫到日落橙红——示例正是靠旋转它实现动态日落2️⃣ 尺寸与亮度iSun、rPlanet、rAtmos参数作用示例值iSun太阳强度整体亮度倍率22.0rPlanet行星半径米6371e3rAtmos大气层外边界半径米6471e3iSun是曝光旋钮画面偏暗就调大偏亮就调小rAtmos - rPlanet即大气层厚度地球配置下约 100 千米打造外星天体时这两个参数最先动改半径比例地平线弧线和可见大气量立刻不同3️⃣ 散射系数kRlh、kMie——天空颜色的灵魂参数类型作用示例值kRlhvec3Rayleigh 散射系数R/G/B 三通道独立(5.5e-6, 13e-6, 22.4e-6)kMiefloatMie 散射系数21e-6地球配置中蓝色通道最大22.4e-6 13e-6 5.5e-6蓝光散射最强 → 天空发蓝这里是颜色调参的主战场kMie是标量、不分通道控制灰白雾霾感与太阳眩光范围值越大天越朦胧、太阳越糊想换天空色相只需重排kRlh三通道的比例4️⃣ 高度衰减shRlh、shMie——垂直渐变的秘密参数作用示例值shRlhRayleigh 标高米密度衰减到 1/e 的高度8e3shMieMie 标高米1.2e3大气密度随高度指数衰减标高越大该成分分布得越高地球配置里shRlh 8 km、shMie 1.2 km分子弥漫到高空尘埃却集中在低空——于是天顶清澈、地平线浑浊这两个参数决定天空从上到下的颜色渐变速度是画面立体感的关键5️⃣ 前向散射g——太阳光晕的集中度参数作用示例值gMie 散射的前向偏好0~1越接近 1 光越向太阳方向聚拢0.758g越大阳光越集中成一道刺眼光晕模拟雾中太阳的效果常用区间 0.7~0.8超过 0.9 光晕会变得很窄很锐利想要柔和的奶油感天空把它调到 0.7 左右即可四、地球基准参数速查表 #参数类型地球示例值一句话说明1rvec3normalize(vPosition)视线方向2r0vec3(0, 6372e3, 0)观察点地表上方 1 km3pSunvec3(0, 0.1, -1)太阳方向4iSunfloat22.0整体亮度5rPlanetfloat6371e3行星半径米6rAtmosfloat6471e3大气外边界米7kRlhvec3(5.5e-6, 13e-6, 22.4e-6)天空主色偏蓝8kMiefloat21e-6雾霾/眩光强度9shRlhfloat8e3分子层高度10shMiefloat1.2e3尘埃层高度11gfloat0.758光晕集中度记住这张表你就拥有了真实地球的起点。五、自定义外星天空3 个调参配方 在地球参数基础上做局部修改就能快速得到风格化天体配方 A火星风——稀薄红色尘霾把rAtmos贴近rPlanet大气只剩几千米厚kMie调大到3e-5 ~ 5e-5kRlh改为暖色比例(20e-6, 12e-6, 8e-6)shRlh降到4e3→ 暗粉橙色天空 朦胧地平线配方 B厚雾巨行星——看不见地平线rAtmos - rPlanet拉到 500 km 以上shMie加大到5e3 ~ 1e4g提到0.85整片天空变成奶油色雾带太阳只剩一团柔光配方 C紫色科幻天空——最小改动只把kRlh改成(20e-6, 6e-6, 24e-6)这类红蓝主导的比例其余参数不动 → 立刻获得强科幻感的白昼天空六、使用注意 ✨别忘记曝光函数输出是线性亮度建议像示例一样做压缩color 1.0 - exp(-color)否则画面容易过曝发白观察者高度影响观感r0越贴近地表渐变越戏剧化拉到高空则更接近太空视角的黑边弧线性能友好采样步数固定16×8在单个全屏四边形上渲染对移动端也友好小结11 个参数 视角 3 尺寸亮度 3 散射 2 高度 2 方向 1结构清晰调参口诀颜色改kRlh雾霾改kMie厚度改rAtmos光晕改g亮度改iSun先抄地球速查表跑通再按配方做局部修改几轮迭代就能得到你的专属外星天空【免费下载链接】glsl-atmosphereRenders sky colors with Rayleigh and Mie scattering.项目地址: https://gitcode.com/gh_mirrors/gl/glsl-atmosphere创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考
glsl-atmosphere 11个参数逐个精讲：从地球参数到自定义外星天空
glsl-atmosphere 11个参数逐个精讲从地球参数到自定义外星天空【免费下载链接】glsl-atmosphereRenders sky colors with Rayleigh and Mie scattering.项目地址: https://gitcode.com/gh_mirrors/gl/glsl-atmosphereglsl-atmosphere 是一个轻量级GLSL 天空渲染着色器基于 Rayleigh瑞利散射与 Mie米氏散射一次函数调用即可在 WebGL 场景中算出真实的蓝天、橙红晚霞与太空视角。本文带你逐个精讲它的11 个参数先照抄地球配置还原真实大气再微调出属于你的外星天空。一、原理速览天空的颜色是算出来的 真实天空的颜色来自两类散射Rayleigh 散射空气分子对短波蓝光散射更强所以白天天空偏蓝日落时阳光穿过更厚的大气蓝光被滤掉只剩橙红色Mie 散射尘埃、水汽等大颗粒造成几乎不分波长且强烈朝太阳方向散射形成太阳周围的白雾感与眩光glsl-atmosphere 的思路很直接从相机沿视线方向步进采样同时沿太阳方向采样累加两段光路的光学深度再按相位函数加权合成最终颜色。核心实现只有一个函数atmosphere见index.glsl采样步数固定在文件顶部主射线 16 步、太阳射线 8 步性能开销很小。二、快速上手安装与调用入口一条命令安装到项目npm install glsl-atmosphere在片元着色器中通过 glslify 引入并调用#pragma glslify: atmosphere require(glsl-atmosphere) vec3 color atmosphere(r, r0, pSun, iSun, rPlanet, rAtmos, kRlh, kMie, shRlh, shMie, g);就是这11 个参数决定了一切。完整可运行示例见example/example.frag与example/example.vertJS 侧驱动逻辑在example/index.js。三、11 个参数逐个精讲1️⃣ 视角三件套r、r0、pSun参数类型作用示例值rvec3归一化视线方向即穿过该像素的射线normalize(vPosition)r0vec3射线起点观察者眼睛位置单位米(0, 6372000, 0)pSunvec3太阳位置函数内部会自动归一化(0, 0.1, -1)使用要点r必须是单位向量通常取像素方向后归一化r0以米为单位、以地心为原点示例中 6372000 米 地表6371000 米上方约 1 千米把pSun摆到不同高度就能从正午蓝天扫到日落橙红——示例正是靠旋转它实现动态日落2️⃣ 尺寸与亮度iSun、rPlanet、rAtmos参数作用示例值iSun太阳强度整体亮度倍率22.0rPlanet行星半径米6371e3rAtmos大气层外边界半径米6471e3iSun是曝光旋钮画面偏暗就调大偏亮就调小rAtmos - rPlanet即大气层厚度地球配置下约 100 千米打造外星天体时这两个参数最先动改半径比例地平线弧线和可见大气量立刻不同3️⃣ 散射系数kRlh、kMie——天空颜色的灵魂参数类型作用示例值kRlhvec3Rayleigh 散射系数R/G/B 三通道独立(5.5e-6, 13e-6, 22.4e-6)kMiefloatMie 散射系数21e-6地球配置中蓝色通道最大22.4e-6 13e-6 5.5e-6蓝光散射最强 → 天空发蓝这里是颜色调参的主战场kMie是标量、不分通道控制灰白雾霾感与太阳眩光范围值越大天越朦胧、太阳越糊想换天空色相只需重排kRlh三通道的比例4️⃣ 高度衰减shRlh、shMie——垂直渐变的秘密参数作用示例值shRlhRayleigh 标高米密度衰减到 1/e 的高度8e3shMieMie 标高米1.2e3大气密度随高度指数衰减标高越大该成分分布得越高地球配置里shRlh 8 km、shMie 1.2 km分子弥漫到高空尘埃却集中在低空——于是天顶清澈、地平线浑浊这两个参数决定天空从上到下的颜色渐变速度是画面立体感的关键5️⃣ 前向散射g——太阳光晕的集中度参数作用示例值gMie 散射的前向偏好0~1越接近 1 光越向太阳方向聚拢0.758g越大阳光越集中成一道刺眼光晕模拟雾中太阳的效果常用区间 0.7~0.8超过 0.9 光晕会变得很窄很锐利想要柔和的奶油感天空把它调到 0.7 左右即可四、地球基准参数速查表 #参数类型地球示例值一句话说明1rvec3normalize(vPosition)视线方向2r0vec3(0, 6372e3, 0)观察点地表上方 1 km3pSunvec3(0, 0.1, -1)太阳方向4iSunfloat22.0整体亮度5rPlanetfloat6371e3行星半径米6rAtmosfloat6471e3大气外边界米7kRlhvec3(5.5e-6, 13e-6, 22.4e-6)天空主色偏蓝8kMiefloat21e-6雾霾/眩光强度9shRlhfloat8e3分子层高度10shMiefloat1.2e3尘埃层高度11gfloat0.758光晕集中度记住这张表你就拥有了真实地球的起点。五、自定义外星天空3 个调参配方 在地球参数基础上做局部修改就能快速得到风格化天体配方 A火星风——稀薄红色尘霾把rAtmos贴近rPlanet大气只剩几千米厚kMie调大到3e-5 ~ 5e-5kRlh改为暖色比例(20e-6, 12e-6, 8e-6)shRlh降到4e3→ 暗粉橙色天空 朦胧地平线配方 B厚雾巨行星——看不见地平线rAtmos - rPlanet拉到 500 km 以上shMie加大到5e3 ~ 1e4g提到0.85整片天空变成奶油色雾带太阳只剩一团柔光配方 C紫色科幻天空——最小改动只把kRlh改成(20e-6, 6e-6, 24e-6)这类红蓝主导的比例其余参数不动 → 立刻获得强科幻感的白昼天空六、使用注意 ✨别忘记曝光函数输出是线性亮度建议像示例一样做压缩color 1.0 - exp(-color)否则画面容易过曝发白观察者高度影响观感r0越贴近地表渐变越戏剧化拉到高空则更接近太空视角的黑边弧线性能友好采样步数固定16×8在单个全屏四边形上渲染对移动端也友好小结11 个参数 视角 3 尺寸亮度 3 散射 2 高度 2 方向 1结构清晰调参口诀颜色改kRlh雾霾改kMie厚度改rAtmos光晕改g亮度改iSun先抄地球速查表跑通再按配方做局部修改几轮迭代就能得到你的专属外星天空【免费下载链接】glsl-atmosphereRenders sky colors with Rayleigh and Mie scattering.项目地址: https://gitcode.com/gh_mirrors/gl/glsl-atmosphere创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考