Outline Pass
sghowing outline pass in threejs
HTML
<script src="//cdn.rawgit.com/mrdoob/three.js/master/build/three.min.js"></script>
<script src="https://threejs.org/examples/js/controls/OrbitControls.js"></script>
JavaScript
var camera, scene, renderer;
var geometry, material, mesh, material2, cube1, cube2;
init();
animate();
function init() {
camera = new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight);
camera.position.z = 1;
camera.position.x = 10;
camera.position.y = 10;
var controls = new THREE.OrbitControls(camera);
scene = new THREE.Scene();
renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
var geometry = new THREE.Geometry();
geometry.vertices.push(new THREE.Vector3( -5, 0, 0) );
geometry.vertices.push(new THREE.Vector3( 0, 5, 0) );
geometry.vertices.push(new THREE.Vector3( 5, 0, 0) );
var material = new THREE.LineDashedMaterial( {
color: 0xffffff,
linewidth: 1,
scale: 1,
dashSize: 3,
gapSize: 1,
} );
var line = new THREE.Line( geometry, material );
geometry.computeLineDistances();
scene.add(line);
document.body.appendChild(renderer.domElement);
}
function animate() {
requestAnimationFrame(animate);
renderer.render(scene,camera);
}