|
楼主 |
发表于 2022-3-16 12:44:21
|
显示全部楼层
本帖最后由 tzbm123456 于 2022-10-11 07:25 编辑
//二、场景内容
//1、灯光
var light;
function initLight(){
light=new THREE.DirectionalLight(0xFF0000,1.0,0);
light.position.set(100,100,200);
scene.add(light);
}
//2、实体
function initObject(){
//添加坐标实体axesHelper
var axesHelper = new THREE.AxesHelper( 100 );
scene.add( axesHelper );
//添加线实体
var material=new THREE.LineBasicMaterial({
vertexColors:true,
color:new THREE.Color(0xff0000),
linewidth:5
});
var color1=new THREE.Color(0x444444),color2=new THREE.Color(0xFF0000);
var pt1=new THREE.Vector3(-100,-100,0);
var pt2=new THREE.Vector3(100,100,0);
var geometry=new THREE.Geometry();
geometry.vertices.push(pt1);
geometry.vertices.push(pt2);
geometry.colors.push(color1,color2);
var line=new THREE.Line(geometry,material,THREE.LineSegments);
var matrixT=new THREE.Matrix4();
matrixT.makeTranslation(-50,50,50);
var matrixR=new THREE.Matrix4();
matrixR.makeRotationZ(Math.PI/4);
var matrixRT=new THREE.Matrix4();
matrixRT.multiplyMatrices(matrixT,matrixR);
line.applyMatrix(matrixRT)
//line.applyMatrix(matrixT)
//line.rotateZ(Math.PI/4);
scene.add(line);
}
//三、场景渲染
function render1() {
//renderer1.clear();
renderer1.render( scene, camera1 );
}
function render2() {
//renderer1.clear();
renderer2.render( scene, camera2 );
}
//四、相机控制
function controlCamera1(){
//通过controls1相机控制器监听鼠标左中右健事件
controls1.addEventListener('change', function () {
//renderer1.clear();
renderer1.render( scene, camera1 );
});
controls1.screenSpacePanning=true;
//通过DOM监听鼠标左健点击事件
renderer1.domElement.addEventListener('click', function(evt){
console.log("X:"+evt.clientX+"|"+"Y:"+evt.clientY);
var vt=new THREE.Vector3();
camera1.getWorldDirection(vt);
console.log("相机位置点:");
console.log(camera1.position);
console.log("相机目标点:");
console.log(controls1.target);
console.log(vt);
});
}
function controlCamera2(){
controls2.addEventListener('change', render2);//监听鼠标、键盘事件
controls2.screenSpacePanning=true;
/*
renderer2.domElement.addEventListener('click', function(evt){
console.log("X:"+evt.clientX+"|"+"Y:"+evt.clientY);
var vector = new THREE.Vector3(( evt.clientX / width ) * 2 - 1, -( evt.clientY / height ) * 2 + 1,0.5);
console.log(vector);
var vectorP = vector.unproject(camera2);
console.log(vectorP);
});
*/
}
function main(){
//一、总体框架
initScene();
initCamera1();
initCamera2();
initRenderer1();
initRenderer2();
initcontrols1();
initcontrols2();
//二、场景内容
initLight();
initObject();
//三、渲染
render1();
render2();
//四、控制
controlCamera1();
controlCamera2();
console.log("111111");
console.log(controls1.target);
}
</script>
</head>
<body>
<div id="Window1"></div>
<div id="Window2"></div>
</body>
</html>
|
|