JSFiddle - React, Tailwind, and code Playground
by kdmitriyval
JavaScript
var scene, camera, render;
var w = document.body.clientWidth || window.innerWidth;
var h = document.body.clientHeight || window.innerHeight;
var div = document.createElement('div');
document.body.appendChild(div);
camera = new THREE.PerspectiveCamera(70, w/h, 100, 10000);
camera.position.y = 500;
camera.position.z = 1100;
camera.position.x = -500;
scene = new THREE.Scene();
/*var amb = new THREE.AmbientLight(0x020908);
amb.castShadow = true;
scene.add(amb);*/
var axes = new THREE.AxisHelper(20);
scene.add(axes);
var light = new THREE.SpotLight();
light.position.set(-500,700,0);
light.castShadow = true;
scene.add(light);
var plane = new THREE.Mesh(new THREE.PlaneGeometry(1500,1500,100,100), new THREE.MeshLambertMaterial({color:0x2B8023}));
plane.rotation.x = -Math.PI/2;
plane.position.y = -100;
plane.receiveShadow = true;
scene.add(plane);
var plane1 = new THREE.Mesh(new THREE.PlaneGeometry(1500,1500,100,100), new THREE.MeshLambertMaterial({color:0x2B8023}));
plane1.rotation.x = -Math.PI/2;
plane1.rotation.y = -Math.PI/2;
plane1.position.x = 750;
plane1.position.y = 650;
plane1.receiveShadow = true;
scene.add(plane1);
var cube = new THREE.Mesh(new THREE.CubeGeometry(200,200,200,20,20,20), new THREE.MeshLambertMaterial({color:0xBE2741}));
cube.position.y = 100;
cube.position.x = 150;
cube.position.z = 50;
cube.receiveShadow = true;
cube.castShadow = true;
scene.add(cube);
var sphere = new...