Etiquetando los vértices en AxisHelper of THREE.js
Considere el siguiente código:
<html>
<head>
<title>My first Three.js app</title>
<style>canvas { width: 100%; height: 100% }</style>
</head>
<body>
<script src="https://rawgithub.com/mrdoob/three.js/master/build/three.js"> </script>
<script>
var scene=new THREE.Scene();
var axis;
var camera = new THREE.PerspectiveCamera( 35, window.innerWidth/window.innerHeight, 0.1, 10000);
camera.position.z = 3;
var renderer = new THREE.WebGLRenderer({antialias: true});
renderer.setSize(document.body.clientWidth,document.body.clientHeight);
document.body.appendChild(renderer.domElement);
renderer.setClearColorHex(0xEEEEEE, 1.0);
renderer.clear();
var cube = new THREE.Mesh( new THREE.CubeGeometry(50,50,50),new THREE.MeshBasicMaterial({color: 0x000000}));
scene.add( cube );
function animate(t) {
camera.position.x = Math.sin(t/1000)*300;
camera.position.y = 150;
camera.position.z = Math.cos(t/1000)*300;
camera.lookAt(scene.position);
renderer.render(scene, camera);
renderer.shadowMapEnabled = true;
window.requestAnimationFrame(animate, renderer.domElement);// auto called - many advantages
};
animate(new Date().getTime());
axis = new THREE.AxisHelper(75);
scene.add(axis);
</script>
</body>
</html>
El código anterior crea los ejes x, y, z en el cubo.
Por favor ayúdame a etiquetar el eje.
El texto etiquetado debe girar junto con el eje.
Necesito un código de ejemplo para personalizar el ayudante de ejes (para crear etiquetas) en THREE.js