zoukankan      html  css  js  c++  java
  • shader之渐变长方体实现(cesium)

    shader之渐变长方体实现(cesium)

    前置内容博客:

     shader之cesium应用(https://www.cnblogs.com/s313139232/p/14316829.html

    shader之渐变长方体实现(threejs)(https://www.cnblogs.com/s313139232/p/14316836.html

    效果:

     原理:

    1.position获取:

      1.1 在cesium中,可通过vec4 p = czm_computePosition();获取 模型坐标中相对于眼睛的位置矩阵 

      1.2 vec4 eyePosition = czm_modelViewRelativeToEye * p;       // position in eye coordinates    获取eyePosition

      1.3 v_positionEC =  czm_inverseModelView * eyePosition;      // 将eyePosition转换为模型坐标    注意:模型坐标系的原点为地心,不等于模型的东北上坐标系

    2.法线获取:

           v_normalEC = czm_normal * normal;                         // normal in eye coordinates    获取eyeNormal 
    3.片元着色器计算:
      3.1由于获取道德是模型坐标,并不是东北上坐标,所以不能直接使用坐标y值表示模型高度。
      3.2模型高度计算: 通过矢量长度计算公式算出点模型坐标内点到地心原点的距离
        float l = sqrt(pow(v_positionEC.x,2.0) + pow(v_positionEC.y,2.0) + pow(v_positionEC.z,2.0));
      3.3拉伸后取小数部分得到0到1的渐变值。矩形高:100000
        float cy = fract((abs(l - 50000.0))/100000.0); 
      3.4应用渐变的一部分:
        float cy = fract((abs(l - 100000.0))/200000.0); 
      得到最终效果:
        gl_FragColor = vec4(0.0, 0.0, cy3, 1.0);
     

    完成着色器代码:

    vertexShaderSource: `
                    attribute vec3 position3DHigh;
                    attribute vec3 position3DLow;
                    attribute vec3 normal;
                    attribute vec2 st;
                    attribute float batchId;
    
                    varying vec4 v_positionEC;
                    varying vec3 v_normalEC;
                    varying vec2 v_st;
    
                    void main()
                    {
                        vec4 p = czm_computePosition();
                        vec4 eyePosition = czm_modelViewRelativeToEye * p;
                        v_positionEC =  czm_inverseModelView * eyePosition;      // position in eye coordinates
                        v_normalEC = czm_normal * normal;                         // normal in eye coordinates
                        v_st = st;
    
                        gl_Position = czm_modelViewProjectionRelativeToEye * p;
                    }
                        `,
                    fragmentShaderSource: `         
                            varying vec4 v_positionEC;
                              varying vec3 v_normalEC;
                            void main() {
                                float l = sqrt(pow(v_positionEC.x,2.0) + pow(v_positionEC.y,2.0) + pow(v_positionEC.z,2.0));
                                float cy = fract((abs(l - 100000.0))/200000.0); 
    
                                gl_FragColor = vec4(0.0, 0.0, cy, 1.0);
                            }
                    `,

    合作:@浩

    钻研不易,转载请注明出处。。。。。。

  • 相关阅读:
    MySQL数据库导入方法(最佳方案--cmd命令行方式导入,不会导致数据结构或表丢失)
    MySQL:互联网公司常用分库分表方案汇总!
    主流的消息中间件有哪些?
    Java实现进制之间转换的工具类
    python查找文件夹下所有指定后缀名的文件
    Visual Studio检查内存泄露方法
    Linux重要文件被删恢复问题
    docker 安装与相关操作
    C++ 替换路径中斜杠 并获取完整路径的文件名
    catch2:一个好用的C++单元测试框架
  • 原文地址:https://www.cnblogs.com/s313139232/p/14316841.html
Copyright © 2011-2022 走看看