threejs 第二十用 shaderMaterial

自己写shader就得用这个材质

需要vertex fragment先

    <script id="vertex-Shader" type="x-shader/x-vertex">
		
		varying vec2 vUv;
	 
		void main() {
			
			gl_Position = projectionMatrix * modelViewMatrix * position;
			
		}
	</script>
	 
	<script id="fragment-Shader" type="x-shader/x-fragment">
		precision highp float;
		uniform sampler2D texture1;
        uniform int num;
		varying vec2 vUv;
	 
		void main() {			
            vec2 position = vUv;		
			gl_FragColor = texture2D(texture1,position);
		}
	</script>
    var uniforms = {
    texture1 : {value : textureLoader.load('test.png')},
    num:{value:666}
        };
    uniforms.texture1.value.warpS = uniforms.texture1.value.warpT = THREE.RepeatWrapping;
    
    var shaderMaterial = new THREE.ShaderMaterial({
        uniforms : uniforms,
        vertexShader: document.getElementById( 'vertex-Shader' ).textContent,
        fragmentShader: document.getElementById( 'fragment-Shader' ).textContent
    });


    var obj=new THREE.Mesh(geo,shaderMaterial);

uniforms.num.value这就可以改uniform了   默认有一些position mvp矩阵 uv了  没研究过怎么把attribute也自定义

猜你喜欢

转载自blog.csdn.net/qq_35158695/article/details/83304281