cesium中如何修改图层的着色器,使其达到我们想要的图层风格

cesium中如何修改图层的着色器,使其达到我们想要的图层风格

在cesium中我们可以,通过修改图层的着色器源代码使其达到一些酷炫的效果,现在我们
来说说如何做到这一切。

获取图层对应的片源着色器源代码

const baseFragmentShader = viewer.scene.globe._surfaceShaderSet.baseFragmentShaderSource.sources;

好现在 baseFragmentShader里面就是图层的着色器代码
在这里插入图片描述
长成这样
具体修改的代码

for (let i = 0; i < baseFragmentShader.length; i++) {
        // console.log(baseFragmentShader[i])
        let strS = `color = czm_saturation(color, textureSaturation);\n#endif\n`;
        let strT = `color = czm_saturation(color, textureSaturation);\n#endif\n`;
            strT += `
                color.r = 1.0 - color.r;
                color.g = 1.0 - color.g;
                color.b = 1.0 - color.g;
            `
            strT += `
                color.r = color.r*${0}.0/255.0;
                color.g = color.g*${50}.0/255.0;
                color.b = color.b*${100}.0/255.0;
            `
        baseFragmentShader[i] = baseFragmentShader[i].replace(strS, strT);
    }

这里面的字符串是glsl代码,我们使用字符串的replace函数来替换掉我们想替换的代码
这样就做到了,修改glsl代码的效果

在这里插入图片描述
这样就可以达到一些自定义的图层效果

  • 1
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 2
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值