Light particles blending
HTML
<canvas id="myCanvas"></canvas>
<script src="//cdn.rawgit.com/mrdoob/three.js/master/build/three.min.js"></script>
<script src="https://rawgit.com/mrdoob/three.js/dev/examples/js/controls/OrbitControls.js"></script>
JavaScript
// Most important stuff is in initLightParticles() on line 213
// createStartingMesh() (line 51) builds mesh and curves which are used to position the particles
var canvas = document.getElementById("myCanvas");
var camera0, scene0, renderer, controls, clock, composer, materialDepth, stats;
let myPass;
var textureLoader;
var Textures = {};
var Lights = [];
let shadows = true;
let sun;
let bgColor = 0x909090;
let sunColor = 0xddddff;
let sunDirection = new THREE.Vector3( 0 , 500 , 0 );
let lightParticles, particleCount = 1000, skyCeiling;
let points = [], curves = [], lines = [], solidMesh = [];
function init() {
renderer = new THREE.WebGLRenderer( { canvas: canvas, antialias: true } );
renderer.setSize( window.innerWidth, window.innerHeight );
if(shadows){
renderer.shadowMap.enabled = true;
renderer.shadowMap.type = THREE.PCFSoftShadowMap;
}
scene0 = new THREE.Scene();
scene0.background = new THREE.Color( bgColor );
camera0 = new THREE.PerspectiveCamera( 60, window.innerWidth / window.innerHeight, 0.1, 10000 );
camera0.position.set( 0 , 100 , 30 );
clock = new THREE.Clock();
textureLoader = new THREE.TextureLoader();
window.addEventListener("resize", function(){
renderer.setSize( window.innerWidth, window.innerHeight );
camera0.aspect = window.innerWidth / window.innerHeight;
camera0.updateProjectionMatrix();
}, false);
initControls();
initTextures();
createStartingMesh();
initLights();
// initLightParticles() is in createStartingMesh() for reasons explained there
}
var createStartingMesh = function(){
let sunGeo = new THREE.SphereBufferGeometry( 100 , 16, 16 );
let sunMat = new THREE.MeshBasicMaterial({ color: 0xffffcc });
sun = new THREE.Mesh( sunGeo, sunMat );
// sun.position.set( 0 , 10 , -1100 );
sun.position.set( 0 , 1000 , 0 );
scene0.add( sun );
var darkMaterial = new THREE.MeshLambertMaterial({
color: 0x404040,
});
let defaultMaterial = darkMaterial;
let cubeGeo = new THREE.BoxBufferGeometry(...