Zei 3d
by PhilQ
SCSS
body { margin: 0; }
canvas { display: block; }
JavaScript
function deg2rad(deg) { return deg * (Math.PI/180); }
function rad2deg(rad) { return rad * (180/Math.PI); }
function getCirclePoints(angle_f, angle_t, steps, offset, radius) {
var a = [],
angle = 0,
diff = angle_t - angle_f;
for (var s = 0; s <= steps; s++) {
angle = angle_f + (s / steps) * diff;
a.push([
offset[0] + radius * Math.cos(deg2rad(angle)),
offset[1] + radius * Math.sin(deg2rad(angle)),
]);
}
return a;
}
import * as THREE from 'https://threejs.org/build/three.module.js';
import { OrbitControls } from 'https://threejs.org/examples/jsm/controls/OrbitControls.js';
var container,
renderer,
scene,
camera,
controls;
var geometry,
material;
function init() {
container = document.createElement( 'div' );
document.body.appendChild( container );
// Renderer
renderer = new THREE.WebGLRenderer({ antialias: true });
renderer.shadowMap.enabled = true;
renderer.shadowMap.type = THREE.PCFSoftShadowMap; // default THREE.PCFShadowMap
renderer.setPixelRatio( window.devicePixelRatio );
renderer.setSize( window.innerWidth, window.innerHeight );
container.appendChild( renderer.domElement );
// Scene
scene = new THREE.Scene();
// Lights
scene.add( new THREE.AmbientLight( 0x666666 ) );
var light = new THREE.DirectionalLight( 0xdfebff, 1 );
light.position.set( 50, 100, 1 );
light.position.multiplyScalar( 1.3 );
//light.castShadow = true;
//scene.add( light );
var lights = [];
lights[ 0 ] = new THREE.PointLight( 0xffffff, 1, 0 );
lights[ 1 ] = new THREE.PointLight( 0xffffff, 1, 0 );
lights[ 2 ] = new THREE.PointLight( 0xffffff, 1, 0 );
lights[ 0 ].position.set( 0, 200, 0 );
lights[ 1 ].position.set( 100, 200, 100 );
lights[ 2 ].position.set( - 100, - 200, - 100 );
scene.add( lights[ 0 ] );
scene.add( lights[ 1 ] );
scene.add( lights[ 2 ] );
// Camera
camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 1, 10000 );
// Controls
controls = new OrbitControls( camera,...