Unity 3D柱状图效果

1.单个柱状效果展示

2.从上到下渐变透明材质Shader

cs 复制代码
Shader "Unlit/NewUnlitShader"
{
    Properties
    {
        _MainTex ("Texture", 2D) = "white" {}
        _Color("Color",Color) = (1,1,1,1)
        _Alpha("Alpha",Range(0,1) ) = 0.2
        _Alpha2("Alpha2",Range(0,1) ) = 0.2
        _Power("Power",range(0,10)) = 1
    }
    SubShader
    {
              Pass
        {
            Tags { "RenderType"="Transparent" }
            Cull Front
            Blend SrcAlpha One
            
            CGPROGRAM
            #pragma vertex vert
            #pragma fragment frag

            #include "UnityCG.cginc"

            struct appdata
            {
                float4 vertex : POSITION;
                float2 uv : TEXCOORD0;
            };

            struct v2f
            {
                float2 uv : TEXCOORD0;
                float4 vertex : SV_POSITION;
            };

            sampler2D _MainTex;
            float4 _MainTex_ST;
            fixed4 _Color;
            float _Alpha2;
            
            v2f vert (appdata v)
            {
                v2f o;
                o.vertex = UnityObjectToClipPos(v.vertex);
                o.uv = TRANSFORM_TEX(v.uv, _MainTex);
                UNITY_TRANSFER_FOG(o,o.vertex);
                return o;
            }

            fixed4 frag (v2f i) : SV_Target
            {
                // sample the texture
                //fixed4 col = tex2D(_MainTex, i.uv);
                float v = i.uv.y;
                //float v = 1 - pow((1 - i.uv.y), 4);
                fixed4 c = fixed4(_Color.xyz ,v * _Alpha2);
                return c;
            }
            ENDCG
        }

        Pass
        {
            Tags { "RenderType"="Transparent" }
             Cull Back
            Blend SrcAlpha One 
            
            CGPROGRAM
            #pragma vertex vert
            #pragma fragment frag
            // make fog work
            #pragma multi_compile_fog

            #include "UnityCG.cginc"

            struct appdata
            {
                float4 vertex : POSITION;
                float2 uv : TEXCOORD0;
            };

            struct v2f
            {
                float2 uv : TEXCOORD0;
                float4 vertex : SV_POSITION;
            };

            sampler2D _MainTex;
            float4 _MainTex_ST;
            fixed4 _Color;
            float _Alpha;


            v2f vert (appdata v)
            {
                v2f o;
                o.vertex = UnityObjectToClipPos(v.vertex);
                o.uv = TRANSFORM_TEX(v.uv, _MainTex);
                UNITY_TRANSFER_FOG(o,o.vertex);
                return o;
            }

            fixed4 frag (v2f i) : SV_Target
            {
                // sample the texture
                //fixed4 col = tex2D(_MainTex, i.uv);
                float y = i.uv.y;
                float v = 1 - pow(1 - (1 - y ), 4);
                fixed4 c = fixed4(_Color.xyz * _Alpha, (1 - v) *_Alpha);
                return c;
            }
            ENDCG
        }

      Pass
        {
            Tags { "RenderType"="Transparent" }
            Blend SrcAlpha One 
            
            CGPROGRAM
            #pragma vertex vert
            #pragma fragment frag
            // make fog work
            #pragma multi_compile_fog

            #include "UnityCG.cginc"

            struct appdata
            {
                float4 vertex : POSITION;
                float3 normal : NORMAL;
                float2 uv : TEXCOORD0;
            };

            struct v2f
            {
                float2 uv : TEXCOORD0;
                float3 viewDir : TEXCOORD1;
                float4 vertex : SV_POSITION;
                float3 normal : normal;
            };

            sampler2D _MainTex;
            float4 _MainTex_ST;
            fixed4 _Color;
            float _Alpha;
            float _Power;

            v2f vert (appdata v)
            {
                v2f o;
                o.vertex = UnityObjectToClipPos(v.vertex);
                o.uv = TRANSFORM_TEX(v.uv, _MainTex);
                o.viewDir = ObjSpaceViewDir(v.vertex);
                o.normal = v.normal;
                UNITY_TRANSFER_FOG(o,o.vertex);
                return o;
            }


            fixed4 frag (v2f i) : SV_Target
            {
                // sample the texture
                float y2 = i.uv.y;
                float v = 1 - pow(1 - (1 - y2 ), 4);
                //float y =  i.uv.y +  _Time.y * _Speed;
                //float sy = (sin(_Time.y) + 1) / 2;
                float fresnel = pow(1 - saturate(dot(normalize(i.viewDir), normalize(i.normal))), _Power);
                for(int m = 0; m <= 10; m++)
                {
                        if(i.uv.y <= (m + 1) / 10  && i.uv.y >= m / 10)
                        {
                            return float4(_Color.rgb *_Alpha * fresnel,_Alpha * ((m + 1) / 10)) ;
                        }
                }
               
                return _Color * fresnel;
                // if(i.uv.y <= sy && i.uv.y >= sy - 0.1)
                // {
                //     return float4(_Color.rgb,_Alpha * 2) ;
                // }
                // else
                // {
                    
                //     fixed4 c = fixed4(_Color.xyz * _Alpha, (1 - v) *_Alpha);
                //     return c;
                // }
                //fixed4 col = tex2D(_MainTex, uv * _Alpha);

               
            }
            ENDCG
        }

    }
}

3.效果用例

unity 新建柱状体,赋予上面材质,调整合适参数。

相关推荐
threelab10 小时前
Three.js 加载 3D Tiles 瓦片数据 | 三维可视化 / AI 提示词
开发语言·前端·javascript·人工智能·3d·着色器
玄米乌龙茶12311 小时前
LLM成长笔记(十三):系统设计与项目实战
笔记·unity·游戏引擎
CG_MAGIC13 小时前
风格化手绘风 3D 渲染出图参数调校技巧
3d·blender·贴图·效果图·渲云渲染
dsyyyyy110114 小时前
CSS 2D 效果、3D 效果 与 Animation 总结
前端·css·3d
_Evan_Yao18 小时前
游戏和编程两不误:用Unity做一个简单小游戏
后端·游戏·unity·游戏引擎
2601_9560028119 小时前
钢铁雄心4/Hearts of Iron IV2026官方正版最新版pc免费下载(看到请立即转存 资源随时失效)手机版通用
大数据·游戏·游戏引擎·动画·游戏策划
kyle~19 小时前
点云处理一---点云宏观认知
数码相机·3d·机器人
EQ-雪梨蛋花汤19 小时前
【Sceneform-EQR】让Android 原生 3D开发更容易
android·3d
冰凌糕20 小时前
Unity3D Shader 渲染状态详解
unity
郝学胜-神的一滴20 小时前
[简化版 GAMES 101] 计算机图形学 10:反走样与深度缓冲核心解析
c++·unity·godot·图形渲染·three.js·unreal engine·opengl