企业官网建设流程全解析

移动服务器建设的电影网站,临沂制作网站多少钱,线上培训平台搭建,网络营销应用上一节课#xff0c;我们只在 Material 里写着色器#xff1b;今天把“魔爪”伸到 Appearance——直接重写片元着色器#xff0c;一样能让像素跳舞#xff0c;而且套路更简单、更暴力。一、Appearance 也能“手写着色器”EllipsoidSurfaceAppearance 本质上就是“官方帮你拼…上一节课我们只在Material里写着色器今天把“魔爪”伸到Appearance——直接重写片元着色器一样能让像素跳舞而且套路更简单、更暴力。一、Appearance 也能“手写着色器”EllipsoidSurfaceAppearance本质上就是“官方帮你拼好”的顶点 片元代码。只要你在构造参数里塞入自己的fragmentShaderSourceCesium 会原封不动采用不会再帮你插材质函数。想纯色、想渐变、想动画全由你一句话决定。二、最小 DEMO把 UV 当颜色下面代码里我们把v_st也就是 UV直接画成红绿渐变连材质都不引const ellipsoidAppearance new Cesium.EllipsoidSurfaceAppearance({ // material: rawMaterial, // 注释掉完全不用 fragmentShaderSource: varying vec3 v_positionMC; varying vec3 v_positionEC; varying vec2 v_st; // 官方帮你传进来的 UV void main() { // 把 UV 的 x、y 当颜色再补一个 1.0 给蓝色通道 gl_FragColor vec4(v_st, 1.0, 1.0); } });运行效果矩形瞬间变成“红→绿”色卡证明我们已完全接管像素。三、想动画先解决“怎么传 uniform”在 Material 里写uniforms很顺手可在 Appearance 里写fragmentShaderSource时构造函数里并没有 uniforms 字段。正确姿势先 new 出对象再动态挂uniforms属性外部用 GSAP / requestAnimationFrame 随便改。代码示范/* 1. new 对象 */ const ellipsoidAppearance new Cesium.EllipsoidSurfaceAppearance({ fragmentShaderSource: varying vec2 v_st; uniform float uTime; // 外部传进来的时间 void main() { float strength sin(v_st.x * 10.0 uTime) * 0.5 0.5; // 0~1 呼吸 gl_FragColor vec4(strength, 0.0, 0.0, 1.0); } }); /* 2. 事后挂 uniform 初始值 */ ellipsoidAppearance.uniforms { uTime: 0.0 }; /* 3. GSAP 让它永远动 */ gsap.to(ellipsoidAppearance.uniforms, { uTime: 1.0, // 从 0 跑到 1 duration: 2.0, // 单程两秒 repeat: -1, // 无限循环 ease: linear });运行效果红色条纹左右“呼吸”移动像一条缓慢扫描的激光带。四、两种“写着色器”路线对比路线入口传 uniforms适合场景Material Fabricsource字段直接在 fabric 对象里写需要复用、多材质组合Appearance 手写fragmentShaderSource先 new 再挂 uniforms快速特效、单个 Primitive 即用即扔两条路都能改像素谁方便用谁。五、小结与预告Appearance 可以直接fragmentShaderSource ...完全不用 Material。uniforms 要“事后挂”再用 GSAP 或帧循环去改。顶点着色器传来的v_st、v_positionEC等 varying 变量想怎么用就怎么用。下节课我们在这块“会呼吸的红布”上加圆遮罩、调透明度一条完整的“雷达扫描圈”就成型了。