I want to build sky scene in forge viewer,I learn the way How can you add text to the Forge Viewer with three.js?So I use threejs-full-es6 to import Sky,and then new sky,but when I add sky object in scene.It report errors: (THREE.Object3D.add: object not an instance of THREE.Object3D). I found new sky by this way the object is different from commen three.js. Through import sky from threejs-full-es6,the obj is only mesh message.But commen three.js sky obj include mesh and uniforms.forge error:
three.js:
import { Sky,SphereBufferGeometry} from './Three.es.min';
initSky() {
var sky, sunSphere;
var scene = viewer.impl.scene;
sky = new Sky();
scene.add( sky );
// Add Sun Helper
sunSphere = new THREE.Mesh(
new SphereBufferGeometry( 20000, 16, 8 ),
new THREE.MeshBasicMaterial( { color: 0xffffff } )
);
sunSphere.position.y = - 700000;
sunSphere.visible = false;
scene.add( sunSphere );
/// GUI
var effectController = {
turbidity: 10,
rayleigh: 2,
mieCoefficient: 0.005,
mieDirectionalG: 0.8,
luminance: 1,
inclination: 0.49, // elevation / inclination
azimuth: 0.25, // Facing front,
sun: ! true
};
var distance = 400000;
function guiChanged() {
var uniforms = sky.uniforms;
uniforms.turbidity.value = effectController.turbidity;
uniforms.rayleigh.value = effectController.rayleigh;
uniforms.luminance.value = effectController.luminance;
uniforms.mieCoefficient.value = effectController.mieCoefficient;
uniforms.mieDirectionalG.value = effectController.mieDirectionalG;
var theta = Math.PI * ( effectController.inclination - 0.5 );
var phi = 2 * Math.PI * ( effectController.azimuth - 0.5 );
sunSphere.position.x = distance * Math.cos( phi );
sunSphere.position.y = distance * Math.sin( phi ) * Math.sin( theta );
sunSphere.position.z = distance * Math.sin( phi ) * Math.cos( theta );
sunSphere.visible = effectController.sun;
sky.uniforms.sunPosition.value.copy( sunSphere.position );
renderer.render( scene, camera );
}
guiChanged();
}