2017-01-26 16 views
0

私はThree-jsを使って地球シーンを作り、地球オブジェクトの表面に存在する巨大な不快な反射ディスク以外はかなりうまく動作します。反射を取り除くか、少なくともそれを大きく落とすことについてのアイデアはありますか?光反射ディスクオンオブジェクトThree-js

Image of Reflection Anomaly-

照明へ

//renderer 
    renderer = new THREE.WebGLRenderer({ canvas : spaceCanvas}); 
    renderer.setSize(672, 472); 
    renderer.shadowMap.enabled = true; 
    renderer.shadowMap.renderReverseSided = false; 
//mainScene 
    mainScene = new THREE.Scene(); 
    mainCamera = new THREE.PerspectiveCamera(45, window.innerWidth /window.innerHeight, 0.01, 2000); 
    mainCamera.position.z = 2.25; 
//Lighting 
    var ambLight = new THREE.AmbientLight(0x222222); 
    var light = new THREE.DirectionalLight(0xffffff, 1); 
    light.position.set(5,3,5); 
    light.castShadow = true; 
    light.shadow.camera.near = 0.01; 
    light.shadow.camera.far = 15; 
    light.shadow.camera.fov = 45; 
    light.shadow.camera.left = -1; 
    light.shadow.camera.right = 1; 
    light.shadow.camera.top = 1; 
    light.shadow.camera.bottom = -1; 
    /*light.shadowCameraVisible = true;*/ 
    light.shadow.bias = 0.001; 
    light.shadow.mapSize.width = 672; 
    light.shadow.mapSize.height = 472; 
    mainScene.add(light, ambLight); 

地球オブジェクト -

function CreateEarth(){ 
earth = new THREE.Object3D(); 
THREE.crossOrigin = ""; 
    var loader = new THREE.TextureLoader(); 
    var colorMap = loader.load("img/bodies/earth/colorMap.jpg"); 
    var bumpMap = loader.load("img/bodies/earth/bump.jpg"); 
    var specMap = loader.load("img/bodies/earth/specular.jpg"); 
    var earthGeometry = new THREE.SphereGeometry(0.5, 32, 32); 
    var earthMaterial = new THREE.MeshPhongMaterial({ 
     map : colorMap, 
     bumpMap : bumpMap, 
     bumpScale : 0.05, 
     specularMap : specMap, 
     specular : new THREE.Color("grey"), 
     shininess: 25 
    }); 
    earthMesh = new THREE.Mesh(earthGeometry, earthMaterial); 
    earth.add(earthMesh); 

function CreateEarthAtmosphere(){ 
    var loader = new THREE.TextureLoader(); 
    var cloudTexColorMap = loader.load("img/bodies/earth/cloudTexture.png"); 

    var atmosphereGeometry = new THREE.SphereGeometry(0.51, 32, 32); 
    var atmosphereMaterial = new THREE.MeshPhongMaterial({ 
      map : cloudTexColorMap, 
      /*alphaMap : cloudTexTransMap,*/ 
      side : THREE.DoubleSide, 
      opacity : 0.5, 
      transparent : true, 
      depthWrite : false 
    }); 
    atmosphereMesh = new THREE.Mesh(atmosphereGeometry, atmosphereMaterial); 
    earthMesh.add(atmosphereMesh) 
} 

答えて

0

あなたshininess: 25値は、地球の材料のオブジェクトを作成するとき、それは輝きだ影響を与えることができます。

var earthMaterial = new THREE.MeshPhongMaterial({ 
     map : colorMap, 
     bumpMap : bumpMap, 
     bumpScale : 0.05, 
     specularMap : specMap, 
     specular : new THREE.Color("grey"), 
     shininess: 25 // lower this? 

}); 
+0

私は正直にそれを見落としました。私は前にそれを変更して誓ったことができ、それはうまくいかなかった。しかし、それを調整し、それは望ましい効果があります。 –