Type de caméra :
1. Caméra en perspective (PerspectiveCamera) : La caméra en perspective simule l'effet des yeux humains observant des objets et a pour effet une profondeur de champ lointaine et petite. Pour créer une caméra en perspective, vous devez définir des paramètres tels que le champ de vision, le rapport d'aspect de la toile, la distance du plan proche et du plan lointain.
2 Caméra orthogonale (OrthographicCamera): La caméra orthogonale élimine l'effet de perspective et fait apparaître l'objet de la même taille sur l'écran. La création d'une caméra orthographique nécessite de définir les positions des plans de détourage gauche et droit, haut et bas, avant et arrière.
3 Caméra cubique (CubeCamera) : une caméra cubique est une caméra spéciale qui capture l'environnement environnant, génère une carte cubique et l'applique au matériau. Il est couramment utilisé pour les effets de réflexion et de réfraction tels que les réflexions spéculaires et la réfraction sur les surfaces en verre. Constructeur
Perspective Camera (PerspectiveCamera) PerspectiveCamera (camera view frustum vertical field of view angle, camera view frustum aspect ratio, camera view frustum face proximal, camera view frustum far end face) property.aspect : Float camera view Le rapport d'aspect du cône, en utilisant généralement la largeur de la toile/hauteur de la toile. La valeur par défaut est 1 (toile carrée). .far : Float ●La face éloignée de la caméra, la valeur par défaut est 2000. Cette valeur doit être supérieure à la valeur du plan proche (la face proche du tronc de caméra). .filmGauge : Float ●Taille du film, la valeur par défaut est 35 (mm). Ce paramètre n'affecte pas la matrice de projection de la caméra à moins que .filmOffset ne soit défini sur une valeur non nulle. .filmOffset : Float ●Le décalage horizontal à partir du centre, la même unité que .filmGauge. La valeur par défaut est 0. .focus : Flottant
● Distance des objets pour la stéréopsie et les effets de profondeur de champ. Ce paramètre n'affecte pas la matrice de projection de la caméra à moins qu'une StereoCamera ne soit utilisée. La valeur par défaut est 10.
.fov : Float
●L'angle de vue vertical du tronc de la caméra, exprimé en angles du bas vers le haut de la vue. La valeur par défaut est 50.
.isPerspectiveCamera : booléen
● Drapeau en lecture seule pour vérifier si l'objet donné est de type caméra en perspective.
.near : Float
● La face de près de la caméra, la valeur par défaut est 0,1.
●La plage de valeurs effectives est comprise entre 0 et la valeur du plan lointain actuel de la caméra (plan lointain). Notez que, contrairement à OrthographicCamera, 0 n'est pas une valeur valide pour la face proche de PerspectiveCamera.
.view : Objet
●Afficher les spécifications de la fenêtre tronconique. Cette valeur est définie à l'aide de la méthode .setViewOffset et effacée à l'aide de la méthode .clearViewOffset.
.zoom : nombre
●Obtenir ou définir le facteur de zoom de la caméra, la valeur par défaut est 1.
Méthode
.clearViewOffset() : undefined
●Efface tout décalage défini par .setViewOffset.
.getEffectiveFOV () : Float
● Combiné avec .zoom (facteur de zoom), renvoie le champ de vision vertical actuel angle par angle.
.getFilmHeight() : Flottant
●Renvoie la hauteur de l'image sur le film en cours, si .aspect est inférieur ou égal à 1 (format portrait, composition portrait), le résultat est égal à .filmGauge.
.getFilmWidth() : Float
●Renvoie la largeur de l'image sur le film en cours.Si .aspect est supérieur ou égal à 1 (format paysage, composition paysage), le résultat est égal à .filmGauge.
.getFocalLength() : Float
● Renvoie la distance focale du .fov actuel (angle de vue) par rapport à .filmGauge (taille du film).
.setFocalLength ( focalLength : Float ) : indéfini
● Définit le FOV par la distance focale par rapport au .filmGauge actuel.
●Par défaut, la distance focale est spécifiée pour un appareil photo 35 mm (plein format). Constructeur
de caméra orthographique (OrthographicCamera) OrthographicCamera (côté gauche du tronc de la caméra, côté droit du tronc de la caméra, côté supérieur du tronc de la caméra, côté inférieur du tronc de la caméra, près de l'extrémité du tronc de la caméra, vue de la caméra de l'extrémité éloignée du tronc) property.bottom : Float ● La partie inférieure du tronc de cône de visualisation de la caméra. .far : Float ● Face éloignée du tronc de la caméra, la valeur par défaut est 2000. Cette valeur doit être supérieure à la valeur du plan proche (la face proche du tronc de caméra). .isOrthographicCamera : booléen ● Drapeau en lecture seule utilisé pour vérifier si un objet donné est un type de caméra orthographique. .left : Flottant
●Le côté gauche de l'appareil photo visualise le tronc de cône.
.near : Float
●La face d'extrémité proche du cône de visualisation de la caméra. Sa valeur par défaut est 0,1.
● La plage valide de sa valeur est comprise entre 0 et far (camera frustum far face).
●Veuillez noter que contrairement à PerspectiveCamera, 0 est une valeur valide pour la face proche d'OrthographicCamera.
.right : Float
●Le côté droit du tronc de la caméra.
.top : Flottant
●Le côté supérieur du cône de visualisation de la caméra.
.view : Objet
●Cette valeur est définie par setViewOffset et sa valeur par défaut est null.
.zoom : nombre
●Obtenir ou définir le facteur de zoom de la caméra, la valeur par défaut est 1.
Method.setViewOffset
( fullWidth : Float, fullHeight : Float, x : Float, y : Float, width : Float, height : Float ) : undefined fullWidth
— Paramètre pleine largeur de la vue multiple
fullHeight — Paramètre pleine hauteur de la vue multiple
x — Caméra secondaire Décalage horizontal
y — le décalage vertical de la caméra secondaire
width — la largeur de la caméra secondaire
height — la hauteur de la caméra secondaire
clearViewOffset () : undefined
● Efface tout décalage défini par .setViewOffset.
.updateProjectionMatrix () : indéfini
●Met à jour la matrice de projection de la caméra. Doit être appelé après que des paramètres ont été modifiés.
.toJSON (meta : Object) : Object
meta -- un objet contenant des métadonnées, telles que des textures ou des images dans les descendants d'objets
Convertissez la caméra au format d'objet/scène JSON three.js (format d'objet/scène JSON three.js).
CubeCamera (CubeCamera)
Constructeur
CubeCamera (la distance du plan de détourage proche, la distance du plan de détourage éloigné, la cible de rendu du cube cible.)
property.renderTarget
:
cible de rendu du cube cible WebGLCubeRenderTarget. (La cible que vous souhaitez afficher)
method.update
( renderer : WebGLRenderer, scene : Scene ) : undefined
renderer -- la
scène actuelle du moteur de rendu WebGL -- la scène actuelle La position de la caméra et la position
vers la caméra peuvent être définies par camera.position.set
(x, y, z) à définir, où x, y, z représentent respectivement la position de la caméra sur les trois axes de coordonnées. L'orientation de la caméra peut être définie par la méthode camera.lookAt(target), où target est un objet Vector3 représentant le point cible vers lequel la caméra est dirigée.
Exemple de code :
const camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
// 设置相机位置
camera.position.set(0, 0, 10);
// 设置相机朝向
const target = new THREE.Vector3(0, 0, 0);
camera.lookAt(target);Le code ci-dessus créera une caméra en perspective, définira sa position sur (0, 0, 10), puis définira son orientation sur l'origine (0, 0, 0).
Contrôleur d'objectif
1OrbitControls : utilisé pour faire pivoter l'objectif, zoomer et faire un panoramique de la scène.
2FlyControls : pour la simulation de vol, vous pouvez contrôler la position et la direction de la caméra.
3PointerLockControls : utilisé pour verrouiller le pointeur de la souris et contrôler la caméra dans la scène.
4Contrôles à la première personne : utilisés pour la perspective à la première personne, le déplacement et la rotation de la caméra dans la scène.
Voici le code pour utiliser le contrôleur d'objectif OrbitControls :
exemple de code
// 实例化 OrbitControlsconst
controls = new THREE.OrbitControls(camera, renderer.domElement);
// 设置控制器参数
controls.enableDamping = true; // 启用阻尼效果
controls.dampingFactor = 0.05; // 阻尼系数
controls.rotateSpeed = 0.1; // 旋转速度
controls.zoomSpeed = 0.5; // 缩放速度
controls.panSpeed = 0.2; // 平移速度
// 渲染循环中更新控制器状态
function animate() {
requestAnimationFrame(animate);
controls.update(); // 更新控制器状态
renderer.render(scene, camera);
}
animate();Cela vous permet d'utiliser le contrôleur de caméra OrbitControls pour contrôler la caméra dans la scène