import * as THREE from 'three'; import { FontLoader } from 'three/addons/loaders/FontLoader.js'; import { TextGeometry } from 'three/addons/geometries/TextGeometry.js'; const calculateSpiralGeometry = (spiralHeight) => { let pointsOfCurve = []; const number = 1000; for (let i = 1; i < number; i++) { let p = i / number; 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)); } let curve = new THREE.CatmullRomCurve3(pointsOfCurve); return new THREE.TubeGeometry(curve, 200, 0.1, 200, false); }; const loader = new FontLoader(); const loadFont = () => { let resolve, reject; let promise = new Promise((res, rej) => { resolve = res; reject = rej; }); loader.load('fonts/helvetiker_regular.typeface.json', (font) => { resolve(font); }, () => {}, (error) => {reject(error)}) return promise; }; const font = await loadFont(); const calculateTextGeometry = (string) => { return new TextGeometry(string, { font, size: 0.5, height: 0.2, curveSegments: 6, bevelEnabled: true, bevelThickness: 0.03, bevelSize: 0.02, bevelOffset: 0, bevelSegments: 4 }); }; const spiralGeometry = calculateSpiralGeometry(2) // spiralGeometry.setAttribute('position', new THREE.BufferAttribute( linePositions, 3 )); export class SpiralSegment { constructor(year, height, material) { this.year = year; this.segment = new THREE.Mesh(spiralGeometry, material); this.text = new THREE.Mesh(calculateTextGeometry(`${this.year}`), material); } getSegment() { return this.segment; } getText() { return this.text; } };