How can I customize the border width and color of a polygon/polyhedron created with three.js? The example code below shows a figure, but I'm unsure how to set borders. Are there alternative methods for creating polygons?
<html>
<head>
<title>Моё</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style>
body { margin: 0; }
canvas { width: 100%; height: 100% }
</style>
</head>
<body>
<script src="../build/three.min.js"></script>
<script src="http://stemkoski.github.io/Three.js/js/OrbitControls.js"></script>
<script>
var phi = 0;
var scene = new THREE.Scene();
var camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 3000 );
//var camera = new THREE.OrthographicCamera( window.innerWidth / - 200, window.innerWidth / 200, window.innerHeight / 200, window.innerHeight / - 200, 0.1, 1000 );
var renderer = new THREE.WebGLRenderer();
renderer.setSize( window.innerWidth, window.innerHeight );
document.body.appendChild( renderer.domElement );
var polyhedronShape, polyhedronPts = [], cube, mesh;
var container, scene, camera, renderer, controls, stats;
// CONTROLS
controls = new THREE.OrbitControls( camera, renderer.domElement );
polyhedronPts.push( new THREE.Vector2 ( 0, 60) );
polyhedronPts.push( new THREE.Vector2 ( 60, 60) );
polyhedronPts.push( new THREE.Vector2 ( 60, 0) );
polyhedronShape = new THREE.Shape( polyhedronPts );
var extrudeSettings = {amount: 20}; // bevelSegments: 2, steps: 2 , bevelSegments: 5, bevelSize: 8, bevelThickness:5
var geometry = new THREE.ExtrudeGeometry( polyhedronShape, extrudeSettings );
mesh = new THREE.Mesh( geometry, new THREE.MeshBasicMaterial( { color: 0x00cc00 } ) );
//mesh.position.set( 0, 0, 0 );
//mesh.rotation.set( 0, 0, 100 );
//mesh.scale.set( 1, 1, 1 );
scene.add( mesh );
camera.position.z = 111;
//cube.position.x += 2;
var cam_z = 0.1, cam_max = 9, cam_min = 2;
function render() {
requestAnimationFrame( render );
controls.update();
if (Math.random() > 0.2) {
renderer.render( scene, camera );
//camera.position.z += cam_z;
}
}
render();
</script>
</body>
</html>