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

问题描述

我想创建一个黑白简单的平面对象。我在场景中添加了 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);
...

结果如下所示（参考图片）：

很难分辨哪个是白色的，哪个是黑色的:(所以我想我做错了。

我认为是因为我在两者上都使用了 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
  });

请问有经验的人可以帮我吗？:) 提前感谢您的时间！

标签： javascriptthree.jsblender

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

问题描述

解决方案

推荐阅读