Home

Index

How to use the FogExp2 function from three

Find comprehensive JavaScript three.FogExp2 code examples handpicked from public code repositorys.

demo.js

28
29
30
31
32
33
34
35
36
37
camera.position.set(0, 45, 240);
controls = new OrbitControls(camera, renderer.domElement);
controls.maxDistance = 500;

scene = new THREE.Scene();
scene.fog = new THREE.FogExp2( 0, 0.00255 );

var SIZE = {x: Math.max(window.innerHeight, window.innerWidth) / 2, y: 30}

function createLines() {

163

chemview.js

GitHub: gabrielelanaro/chemview

47
48
49
50
51
52
53
54
55

var background = 0x000000;
this.renderer.setClearColor(background, 1);

this.scene = new THREE.Scene();
this.scene.fog = new THREE.FogExp2(background);

var directionalLight1 = new THREE.DirectionalLight(0xFFFFFF, 1.2);
directionalLight1.position.set(0.2, 0.2, -1).normalize();

+ 20 other calls in file

util.js

GitHub: shinseed/BIMServer-NodeJs

176
177
178
179
180
181
182
183
184
185
this.camera = new THREE.PerspectiveCamera(this.cameraDefaults.fov, this.aspectRatio, this.cameraDefaults.near, this.cameraDefaults.far);
this.resetCamera();
// world
this.scene = new THREE.Scene();
this.scene.background = new THREE.Color(0xffffff);
// this.scene.fog = new THREE.FogExp2( 0xcccccc, 0.002 );

//坐标轴辅助
var helper = new THREE.GridHelper(1200, 10, 0xFF4444, 0x404040);
this.scene.add(helper);

README.md?plain=1

GitHub: haosong/3D-Online-FPS

65
66
67
68
69
70
71
72
73
74
```javascript
var scene = new THREE.Scene();
```
定义完Scene后，我们可以设置Scene的Fog属性，来营造烟雾效果。即离得越远的物品可见度越低。
```javascript
scene.fog = new THREE.FogExp2(0x000000, 0.0025);
```
之后所有的物件都会被Add到Scene之上：
```
scene.add(someObject);

scenes.js

GitHub: gracexu94/FinalProject

450
451
452
453
454
455
456
457
458
459
460
    allScenes.push(icosahedronScene);
}


function initializeStarField(framework) {
    var scene = new THREE.Scene();
    scene.fog = new THREE.FogExp2( 0x000000, 0.0007 );
    var camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 2000);
    camera.position.set(1, 1, -100);
    camera.lookAt(new THREE.Vector3(0,0,0));
    var controls = new OrbitControls(camera, framework.renderer.domElement);

+ 5 other calls in file

game.js

GitHub: avocadojesus/hackaholics

43
44
45
46
47
48
49
50
51
52

camera = new THREE.PerspectiveCamera( 25, SCREEN_WIDTH / SCREEN_HEIGHT, 50, 1e7 );
camera.position.z = radius * 5;

scene = new THREE.Scene();
scene.fog = new THREE.FogExp2( 0x000000, 0.00000025 );

controls = new THREE.FlyControls( camera );

controls.movementSpeed = 1000;

hero.js

GitHub: angeal185/animated-agency-webapp-using-GSAP-threejs-json-jquery

29
30
31
32
33
34
35
36
37
38
document.body.appendChild( container );
camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 1, 2000 );
camera.position.z = 1200;
scene = new THREE.Scene();

scene.fog = new THREE.FogExp2( 0x000000, 0.0008 );
geometry = new THREE.Geometry();

var textureLoader = new THREE.TextureLoader();
sprite1 = textureLoader.load( "/images/sprite1.png" );

index.js

GitHub: PSkinnerTech/obscurus

72
73
74
75
76
77
78
79
80
81
_renderer.shadowMap.type = THREE.PCFSoftShadowMap;
_renderer.shadowMap.enabled = true;
document.body.appendChild(_renderer.domElement);

_scene = new THREE.Scene();
_scene.fog = new THREE.FogExp2( settings.bgColor, 0.001 );

_camera = new THREE.PerspectiveCamera( 45, 1, 10, 3000);
_camera.position.set(300, 60, 300).normalize().multiplyScalar(1000);
settings.camera = _camera;

+ 2 other calls in file

sceneModule.js

GitHub: ShishirModi/WebGL-Portfolio

153
154
155
156
157
158
159
160
161
162
renderer.setClearColor('#0a0a0a', 1);
renderer.setSize(width * resolution, height * resolution);
$viewport.append(renderer.domElement);

scene = new THREE.Scene();
scene.fog = new THREE.FogExp2(parameters.fogColor, 0.01);

light = new THREE.DirectionalLight('#ffffff', 0.5);
light.position.set(0.2, 1, 0.5);
scene.add(light);

model.js

GitHub: Neticon/webgl-tests

38
39
40
41
42
43
44
45
46
47
renderer.setSize(WIDTH, HEIGHT)
renderer.shadowMap.enabled = true
renderer.shadowMap.type = THREE.PCFSoftShadowMap
document.body.appendChild(renderer.domElement)

scene.fog = new THREE.FogExp2(0xffffff, 0)

const plane = getPlane(40, 40)
plane.rotation.x = radiants(-90)
plane.receiveShadow = true

+ 2 other calls in file

Editor.js

GitHub: COS301-SE-2020/Plushie-Designer

124
125
126
127
128
129
130
131
132
133
     var hhtemp = null;
     var btemp;

     var scene = new THREE.Scene();
     scene.background = new THREE.Color(0x6c768d);
     scene.fog = new THREE.FogExp2(0x6c768d, 0.012);

     var renderer = new THREE.WebGLRenderer({ antialias: true });
     renderer.setPixelRatio(window.devicePixelRatio);
     renderer.setSize(window.innerWidth, window.innerHeight);

+ 12 other calls in file

main.js

GitHub: dunkelstern/3dmap

104
105
106
107
108
109
110
111
112
113
osmRenderer.prototype.createScene = function () {
    // Scene, grey background, fog
    const scene = new THREE.Scene();

    scene.background = new THREE.Color(0xf0f0f0 );
    scene.fog = new THREE.FogExp2(0xf0f0f0, 0.001);

    // lights
    let light = new THREE.DirectionalLight( 0xffffff );
    light.position.set( 1, 1, 1 );

+ 3 other calls in file

Other functions in three

Sorted by popularity

three.Vector3 is the most popular function in three (22341 examples)

Other popular packages:

Home

About