Question

鉴于以下顶点位置，我使用THREE.LineSegments（甚至是简单的THREE.Line）绘制正方形。

顶点：

path.vertices = [
        new THREE.Vector3( 3.4000015258789062, 0, 3.4000015258789062 ), new THREE.Vector3( 10.600006103515625, 0, 3.4000015258789062 ),
        new THREE.Vector3( 10.600006103515625, 0, 3.4000015258789062 ), new THREE.Vector3( 10.600006103515625, 0, 10.600006103515625 ),
        new THREE.Vector3( 10.600006103515625, 0, 10.600006103515625 ), new THREE.Vector3( 3.4000015258789062, 0, 10.600006103515625 ),
        new THREE.Vector3( 3.4000015258789062, 0, 10.600006103515625 ), new THREE.Vector3( 3.4000015258789062, 0, 3.4000015258789062 )
    ];

在方角处添加特定尺寸的孔/中断的最佳方法是什么？ （或方线的任何部分）

预期结果：

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/threejs/r76/three.min.js"></script>

<header>
	<style>
		body canvas{
			width: 100%,
			height: 100%;
			margin:0;
			padding:0;
		}
	</style>
</header>

<body>
</body>

<script>
var renderer, camera, scene, controls;


function initRenderer(){
	renderer = new THREE.WebGLRenderer({antialias:true});
	renderer.setSize( window.innerWidth, window.innerHeight);
	document.body.appendChild(renderer.domElement);
	renderer.setClearColor(0x264d73, 1);
}

function initScene(){
	scene = new THREE.Scene();
}

function initCamera(){
	camera = new THREE.PerspectiveCamera(45, window.innerWidth/window.innerHeight, 1, 10000);
	camera.position.set( 0, 50, 0 );
	camera.lookAt(scene.position);
	scene.add(camera);
}

function initLights(){
	var aLight = new THREE.AmbientLight(0xD0D0D0, 0.5);
	scene.add(aLight);
}

////// Initializers ////////////////////////

function add_path(){
	path = new THREE.Geometry();
	path.vertices = [
		new THREE.Vector3( 3.4000015258789062, 0, 3.4000015258789062 ), new THREE.Vector3( 10.600006103515625, 0, 3.4000015258789062 ),
		new THREE.Vector3( 10.600006103515625, 0, 3.4000015258789062 ), new THREE.Vector3( 10.600006103515625, 0, 10.600006103515625 ),
		new THREE.Vector3( 10.600006103515625, 0, 10.600006103515625 ), new THREE.Vector3( 3.4000015258789062, 0, 10.600006103515625 ),
		new THREE.Vector3( 3.4000015258789062, 0, 10.600006103515625 ), new THREE.Vector3( 3.4000015258789062, 0, 3.4000015258789062 )
	];
	
	
	
	var material = new THREE.LineBasicMaterial({
        color: 0xff00f0,
    });

	var line = new THREE.LineSegments( path, material );
    scene.add(line);
	camera.lookAt(line.position);
	camera.position.x += 7;
	camera.position.y -= 30;
	camera.position.z += 5;
}

///// Mouse events ////////

///// Main /////////
function main(){
	initRenderer(window.innerWidth, window.innerHeight );
	initScene();
	initCamera(window.innerWidth, window.innerHeight );
	initLights();
	add_path();
	animate();
}

function animate(){
	window.requestAnimationFrame( animate );
	render_all();
}

function render_all(){
	renderer.render(scene, camera);
}

main();
</script>

＆＃13;

Answer 1

我建议你创建一个具有相同背景颜色的实心方形对象，用红色勾勒出轮廓。

将此物体放置在目标中后，假设您处于2D世界且相机是静止的，请将其放置在距离较近的位置。到相机。

在给定位置

1 个答案: