Adjust RendererService to use dynamic container height and update OrbitControls limits

This commit is contained in:
Teriuihi 2025-06-22 19:27:55 +02:00
parent ecd9b3d824
commit fea1a98cea

View File

@ -1,6 +1,6 @@
import { ElementRef, Injectable } from '@angular/core';
import {ElementRef, Injectable} from '@angular/core';
import * as THREE from 'three';
import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls.js';
import {OrbitControls} from 'three/examples/jsm/controls/OrbitControls.js';
/**
* Service responsible for managing the Three.js rendering environment
@ -24,7 +24,7 @@ export class RendererService {
// Get container dimensions
const containerWidth = container.nativeElement.clientWidth;
const containerHeight = 400; // Fixed height as defined in CSS
const containerHeight = container.nativeElement.clientHeight;
// Create camera
this.camera = new THREE.PerspectiveCamera(75, containerWidth / containerHeight, 0.1, 1000);
@ -45,8 +45,8 @@ export class RendererService {
this.controls = new OrbitControls(this.camera, this.renderer.domElement);
this.controls.enableDamping = true;
this.controls.dampingFactor = 0.05;
this.controls.minDistance = 2;
this.controls.maxDistance = 10;
this.controls.minDistance = 0.5;
this.controls.maxDistance = 4;
this.controls.target.set(0, 1, 0);
this.controls.update();