leca
/
spiral_calendar
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

I don't remember

This commit is contained in:
leca 2024-01-24 20:03:41 +03:00
parent ac05d434fa
commit ce7ae68c84
3 changed files with 23 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
view/controls.js vendored
View File

@ -7,7 +7,7 @@ export class SpiralCamera {
// this.camera = new THREE.PerspectiveCamera(75, canvas.clientWidth / canvas.clientHeight, 0.1, 1000);
this.camera = new THREE.PerspectiveCamera(75, canvas.clientWidth / canvas.clientHeight, 0.1, 1000);
this.angle = 90;
this.distance = 5;
this.distance = 10;
this.canvas = canvas
this.offset = 0;
this.segmentHeight = segmentHeight;
@ -33,6 +33,7 @@ export class SpiralCamera {
if (isMousePressed) {
let horizontal = event.movementX;
let vertical = event.movementY;
Math.abs(horizontal) > Math.abs(vertical)? vertical = 0 : horizontal = 0;
this.updateCameraPosition(horizontal, vertical);
}
});

31
view/graphics.js
View File

@ -7,7 +7,6 @@ import { FontLoader } from 'three/addons/loaders/FontLoader.js';
const segmentHeight = 2;
let spiralMaterial = new THREE.MeshPhongMaterial({ color: 0x0f0f0f });
let distance = 5;
const scene = new THREE.Scene();
@ -28,7 +27,7 @@ scene.add(ambientLight);
let segments = [];
let viewingYear = new Date().getFullYear();
let viewDistance = 5;
let viewDistance = 15;
let verticalOffset = 0;
let switched = true;
@ -42,10 +41,6 @@ let switched = true;
// text.style.left = 200 + 'px'
// document.body.appendChild(text)
for (let i = 0; i < viewDistance * 2 + 1; i++) {
let color = `#${(Math.floor(Math.random() * 16777215)).toString(16)}`;
let material = new THREE.MeshPhongMaterial({ color: color });
@ -54,25 +49,33 @@ for (let i = 0; i < viewDistance * 2 + 1; i++) {
scene.add(segments[i].getText());
}
const colors = ["#ff0000", "#ffa500", "#ffff00", "#00ff00", "#0000ff", "#00ffff", "#800080"]
addEventListener("changedViewYear", (e) => {
let color = `#${(Math.floor(Math.random() * 16777215)).toString(16)}`;
let material = new THREE.MeshPhongMaterial({ color: color });
let newYear = camera.getViewingYear();
if (newYear > viewingYear) { // +
let color = colors[(colors.length - 1) - ((newYear + viewDistance) % colors.length)]
let material = new THREE.MeshBasicMaterial({ color: color });
scene.remove(segments[0].getSegment())
scene.remove(segments[0].getText())
for (let i = 0; i < segments.length; i++) {
if (i < segments.length - 1) segments[i] = segments[i + 1]
else segments[i] = new SpiralSegment(newYear + viewDistance, segmentHeight, material);
}
segments.shift();
segments.push(new SpiralSegment(newYear + viewDistance, segmentHeight, material));
scene.add(segments[segments.length - 1].getSegment());
scene.add(segments[segments.length - 1].getText());
} else {
let color = colors[(colors.length - 1) - ((newYear - viewDistance) % colors.length)]
let material = new THREE.MeshBasicMaterial({ color: color });
scene.remove(segments[segments.length - 1].getSegment())
scene.remove(segments[segments.length - 1].getText())
segments.pop();
segments.unshift(new SpiralSegment(newYear - viewDistance, segmentHeight, material))
scene.add(segments[0].getSegment());
scene.add(segments[0].getText());
}
@ -91,8 +94,8 @@ function animate() {
for (let i = 0; i < segments.length; i++) {
segments[i].getSegment().position.y = ((segments[i].year - camera.getViewingYear()) * segmentHeight + camera.getOffset());
segments[i].getText().position.y = segmentHeight / 2 +(segments[i].year - camera.getViewingYear()) * segmentHeight + camera.getOffset();
segments[i].getText().position.x = Math.cos(THREE.MathUtils.degToRad(camera.getAngle() + 90)) * 3
segments[i].getText().position.z = Math.sin(THREE.MathUtils.degToRad(camera.getAngle() + 90)) * 3
segments[i].getText().position.x = 2.5*Math.cos(THREE.MathUtils.degToRad(camera.getAngle() + 90)) * 3
segments[i].getText().position.z = 2.5*Math.sin(THREE.MathUtils.degToRad(camera.getAngle() + 90)) * 3
segments[i].getText().lookAt(camera.getCamera().position)
}

6
view/spiral.js
View File

@ -8,9 +8,9 @@ const calculateSpiralGeometry = (spiralHeight) => {
for (let i = 0; i <= number; i++) {
let p = i / number;
let x = Math.cos(p * 2 * Math.PI);
let y = p * spiralHeight;
let z = Math.sin(p * 2 * Math.PI);
let x = 5*Math.cos(p * 2 * Math.PI);
let y = 1 * p * spiralHeight;
let z = 5*Math.sin(p * 2 * Math.PI);
pointsOfCurve.push(new THREE.Vector3(x, y, z));
}