我的threejs材料有一些颜色问题

时间:2018-04-28 14:44:30

标签: javascript three.js blender material

我想创建一个黑色和白色的简单平面对象。我有2个灯光添加到场景中(环境和点):

...
    this.ambientLight = new THREE.AmbientLight(0xFFFFFF, 0.1);
    this.light = new THREE.PointLight( 0xFFFFFF, 0.1 );
...

我还创建了然后将我的飞机添加到场景中:

...
    let plane1 = this.create('plane', this.white);
    let plane2 = this.create('plane', this.black);
    plane2.position.x = 3;

    this.scene.add(plane1);
    this.scene.add(plane2);
...

结果如下(参考图片):

enter image description here

这很难说哪一个是白色,哪一个是黑色:(所以我想我做错了。

我认为是因为我在两者上都使用了PhongMaterial。原因是我使用这种类型的材料,因为我希望灯光会受到影响,我想保留它们的阴影。另一方面,我想减少这种使它们都变黑的色彩效果。

我的材料(白色和黑色):

white = new THREE.MeshPhongMaterial(<any>{
    alphaMap: null,
    alphaTest:0,
    aoMap:null,
    aoMapIntensity:1,
    blendDst:205,
    blendDstAlpha:null,
    blendEquation:100,
    blendEquationAlpha:null,
    blendSrc:204,
    blendSrcAlpha:null,
    blending:1,
    bumpMap:null,
    bumpScale:1,
    clipIntersection:false,
    clipShadows:false,
    clippingPlanes:null,
    color:{r: 0.8, g: 0.8, b: 0.8},
    colorWrite:true,
    combine:0,
    depthFunc:3,
    depthTest:true,
    depthWrite:true,
    displacementBias:0,
    displacementMap:null,
    displacementScale:1,
    dithering:false,
    emissive:{r: 0, g: 0, b: 0},
    emissiveIntensity:1,
    emissiveMap:null,
    envMap:null,
    flatShading:false,
    fog:true,
    lightMap:null,
    lightMapIntensity:1,
    lights:true,
    map:null,
    morphNormals:false,
    morphTargets:false,
    name:"Material",
    normalMap:null,
    normalScale:{x: 1, y: 1},
    opacity:1,
    overdraw:0,
    polygonOffset:false,
    polygonOffsetFactor:0,
    polygonOffsetUnits:0,
    precision:null,
    premultipliedAlpha:false,
    reflectivity:1,
    refractionRatio:0.97,
    shininess:50,
    side:2,
    skinning:false,
    specular: {r: 0.5, g: 0.5, b: 0.5},
    specularMap:null,
    transparent:false,
    vertexColors:0,
    visible:true,
    wireframe:false,
    wireframeLinecap:"round",
    wireframeLinejoin:"round",
    wireframeLinewidth:1
  });

  black = new THREE.MeshPhongMaterial(<any>{
    alphaMap:null,
    alphaTest:0,
    aoMap:null,
    aoMapIntensity:1,
    blendDst:205,
    blendDstAlpha:null,
    blendEquation:100,
    blendEquationAlpha:null,
    blendSrc:204,
    blendSrcAlpha:null,
    blending:1,
    bumpMap:null,
    bumpScale:1,
    clipIntersection:false,
    clipShadows:false,
    clippingPlanes:null,
    color: {r: 0, g: 0, b: 0},
    colorWrite:true,
    combine:0,
    depthFunc:3,
    depthTest:true,
    depthWrite:true,
    displacementBias:0,
    displacementMap:null,
    displacementScale:1,
    dithering:false,
    emissive: {r: 0, g: 0, b: 0},
    emissiveIntensity:1,
    emissiveMap:null,
    envMap:null,
    flatShading:false,
    fog:true,
    lightMap:null,
    lightMapIntensity:1,
    lights:true,
    map:null,
    morphNormals:false,
    morphTargets:false,
    name:"Material",
    normalMap:null,
    normalScale: {x: 1, y: 1},
    opacity:1,
    overdraw:0,
    polygonOffset:false,
    polygonOffsetFactor:0,
    polygonOffsetUnits:0,
    precision:null,
    premultipliedAlpha:false,
    reflectivity:1,
    refractionRatio:0.98,
    shininess:50,
    side:2,
    skinning:false,
    specular: {r: 0.4, g: 0.4, b: 0.4},
    specularMap:null,
    transparent:false,
    vertexColors:0,
    visible:true,
    wireframe:false,
    wireframeLinecap:"round",
    wireframeLinejoin:"round",
    wireframeLinewidth:1
  });

有人可以帮我解决这个问题吗? :) 提前感谢您的时间!

1 个答案:

答案 0 :(得分:-1)

PhongMaterial在其构造函数中没有很好地定义对象。颜色属性看起来像这样:

...
new THREE.COlor(r: 0, g: 0, b: 0)
...

而不是:

...
{r: 0, g: 0, b: 0}
...