camera render texture 游戏里的监控视角

Camera里:

   新建render texture并拖入到target texture里

   新建材质球 拖入render texture      camera里的视角会在材质球上出现

   新建一个plane 将材质球拖入片中,片上会显示出camera里的场景

 

   render texture将camera与material联系起来,将camera的视角播放在material上,plane以这个material为材质,实现监控视角。

 

 

ps:

Normal map 法线效果图   增强凹凸感和光线变化的立体效果

 

图片的效果和材质球的设置(shader)以及图片本身的设置有关

 

坐标系

 屏幕坐标系  右上角(1024, 768)

 视窗坐标系  右上角(1, 1)

 

屏幕坐标转世界坐标 z轴为物体到camera的距离

屏幕坐标转射线     z轴忽略

cube跟随鼠标(cube距cameraz轴距离为9)

cube.transform.position = camera.ScreenToWorldPoint(new Vector3(Input.mousePosition.x, Input.mousePosition.y, 9)) ;

鼠标位置画射线

Ray ray = camera.ScreenPointToRay(Input.mousePosition) ;
Debug.DrawRay(ray.origin, ray.direction, Color.red) ;

 

 

RaycastHit  获取射线碰撞

Ray ray = camera.ScreenPointToRay(Input.mousePosition) ;
RaycastHit hit ;
Debug.DrawRay(ray.origin, ray.direction*100, Color.red) ;
if(Physics.Raycast(ray, out hit)){
  print (hit.transform);
}

hit.transform    碰撞物体名字

hit.transform.position  碰撞物体位置

hit.point  碰撞射线照射位置

转载于:https://www.cnblogs.com/xiaolongchase/p/3276992.html

import React, { useEffect, useRef } from 'react'; import * as THREE from 'three'; // @ts-ignore import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls'; const VRRoom: React.FC = () => { const mountRef = useRef<HTMLDivElement>(null); useEffect(() => { // 场景 const scene = new THREE.Scene(); // 相机 const camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.3, 1000 ); camera.position.set(0, 0, 0.1); // 渲染器 const renderer = new THREE.WebGLRenderer({ antialias: true }); renderer.setSize(window.innerWidth, window.innerHeight); // 控制器 const controls = new OrbitControls(camera, renderer.domElement); controls.enableZoom = false; controls.enablePan = false; controls.rotateSpeed = 0.5; // 球体几何体 const geometry = new THREE.SphereGeometry(500, 60, 40); geometry.scale(-1, 1, 1); // 反转球体,使贴图在内壁 // 贴图 const texture = new THREE.TextureLoader().load('/vr.jpg'); const material = new THREE.MeshBasicMaterial({ map: texture }); const mesh = new THREE.Mesh(geometry, material); scene.add(mesh); // 渲染函数 const animate = () => { requestAnimationFrame(animate); controls.update(); renderer.render(scene, camera); }; // 挂载 if (mountRef.current) { mountRef.current.appendChild(renderer.domElement); } animate(); // 响应式 const handleResize = () => { camera.aspect = window.innerWidth / window.innerHeight; camera.updateProjectionMatrix(); renderer.setSize(window.innerWidth, window.innerHeight); }; window.addEventListener('resize', handleResize); // 清理 return () => { window.removeEventListener('resize', handleResize); if (mountRef.current) { mountRef.current.removeChild(renderer.domElement); } renderer.dispose(); geometry.dispose(); material.dispose(); texture.dispose(); }; }, []); return <div ref={mountRef} style={{ width: '100vw', height: '100vh', overflow: 'hidden' }} />; }; export default VRRoom;帮我找一下为什么效果是全黑
最新发布
06-24
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值