Skip to content

Instantly share code, notes, and snippets.

Avatar

Tyler Marshal Murphy marshallmurphy

View GitHub Profile
View final.js
global.THREE = require("three");
require("three/examples/js/controls/OrbitControls");
const canvasSketch = require("canvas-sketch");
const settings = {
animate: true,
context: "webgl",
scaleToView: true
};
View block16.js
//...
// LIGHTING
const light = new THREE.PointLight("white", 1.25);
light.position.set(0, 0, 0);
scene.add(light);
// illuminate the sun
createSpotlights(scene); // call the function and pass in our scene
// HELPERS
View block15.js
//...
// LIGHTING
const light = new THREE.PointLight("white", 1.25);
light.position.set(0, 0, 0);
scene.add(light);
const spotlight = new THREE.SpotLight(0xFFFFFF, 5, 25, Math.PI/7);
spotlight.position.set(25, 0, 0);
scene.add(spotlight);
View block14.js
//...
// TEXTURES
const loader = new THREE.TextureLoader();
const sunTexture = loader.load("assets/sun.jpg");
const mercuryTexture = loader.load("assets/mercury.jpg");
//...
// MATERIALS
const sunMaterial = new THREE.MeshStandardMaterial({ map: sunTexture });
const mercuryMaterial = new THREE.MeshStandardMaterial({ map: mercuryTexture });
View block13.js
// CAMERA
const camera = new THREE.PerspectiveCamera(100, SCREEN_WIDTH / SCREEN_HEIGHT, 1, 1000);
camera.position.set(30, 5, 35);
// ORBIT CONTROLS
const controls = new THREE.OrbitControls(camera, context.canvas);
controls.target.set(30, 0, 0);
View block12.js
global.THREE = require("three");
require("three/examples/js/controls/OrbitControls");
const canvasSketch = require("canvas-sketch");
const settings = {
animate: true,
context: "webgl",
scaleToView: true
};
View block11.js
function createPlanet(scene, mesh, group, x, scale) {
mesh.position.set(x, 0, 0);
mesh.scale.setScalar(scale);
group.add(mesh);
scene.add(group);
}
View block10.js
//...
return {
render({ time }) {
mercuryGroup.rotation.y = time * 0.5; // rotate around the sun
mercuryMesh.rotation.y = time * 0.20; // rotate the planet
controls.update();
renderer.render(scene, camera);
},
//...
View block9.js
const mercuryGroup = new THREE.Group(); // create new Group
const mercuryMesh = new THREE.Mesh(geometry, mercuryMaterial);
mercuryMesh.position.set(25, 0, 0);
mercuryMesh.scale.setScalar(0.8);
mercuryGroup.add(mercuryMesh) // Add mesh to the group
scene.add(mercuryGroup); // Add group to the scene
View block8.js
//...
// SCENE
const scene = new THREE.Scene();
// TEXTURES
// ...
const venusTexture = loader.load("assets/venus.jpg");
const earthTexture = loader.load("assets/earth.jpg");
// MATERIALS