扩展朗伯材料，不透明度不起作用 [英] extending lambert material, opacity not working

问题描述

我想创建一个自定义材质来扩展 Lambert 着色器，但将网格设置为半透明不起作用.

i would like to create a custom material which extends the lambert shader but setting the mesh translucent doesn't work.

var shaders = { lambert : THREE.ShaderLib['lambert'] }

materials.mylambert = function(parameters){

  var vertexShader = shaders.mylambert.vertexShader
   , fragmentShader = shaders.mylambert.fragmentShader
   , uniforms = shaders.mylambert.uniforms
   , attributes = {}

   var material = new THREE.ShaderMaterial( 
    { vertexShader: vertexShader
    , fragmentShader: fragmentShader
    , uniforms: uniforms
    , lights : true
    , fog : true
    } )

    material.setValues( parameters )
    return material  
}
var material = new materials.mylambert({ opacity : 0.4, transparent : true } )
var mesh = new THREE.Mesh(geom, material)

推荐答案

您需要将材质的属性与材质制服分开.你可以让你的具体例子像这样工作:

You need to separate properties of the material from the material uniforms. You can get your specific example to work like so:

var shaders = { mylambert : THREE.ShaderLib[ 'lambert' ] };

var materials = {};

materials.mylambert = function( parameters, myUniforms ) {

    var material = new THREE.ShaderMaterial( {

        vertexShader: shaders.mylambert.vertexShader,
        fragmentShader: shaders.mylambert.fragmentShader,
        uniforms: THREE.UniformsUtils.merge( [ shaders.mylambert.uniforms, myUniforms ] ),
        attributes: {}

    } );

    material.setValues( parameters )

    return material;

};

myProperties = {
    lights: true,
    fog: true,
    transparent: true
};

myUniforms = {
    opacity: { type: "f", value: 0.4 },
};

var material = new materials.mylambert( myProperties, myUniforms );

three.js r.58

three.js r.58

这篇关于扩展朗伯材料，不透明度不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！