У меня есть основная сцена с шаром и другим подстрочным окном (в правом нижнем углу), где я нарисовал ось (x, y, z) основной сцены.
В этом подпоследовательности я хотел бы нарисовать метки "X" "Y" и "Z" на каждой оси (точнее, расположенные на конце каждого AxisHelper). Я знаю, как использовать TextGeometry, но проблема в том, что я не могу заставить вращать эти ярлыки, чтобы они всегда отображались на лице пользователя.
Вы можете увидеть проблему на [следующая ссылка] [1]: метка "X" фиксирована относительно оси и вращается с камерой, поэтому она не всегда находится лицом к лицу.
Из этих двух ссылок link1 и link2 я попытался добавить (в моем примере я попробовал с меткой "X" ):
function addLabelAxes() {
// Axes label
var loader = new THREE.FontLoader();
loader.load( 'js/helvetiker_regular.typeface.js', function ( font ) {
var textGeo1 = new THREE.TextGeometry( 'X', {
font: font,
size: 5,
height: 0.1,
bevelThickness: 0.1,
bevelSize: 0.1,
bevelEnabled: true,
} );
var color = new THREE.Color();
color.setRGB(255, 255, 255);
textMaterial = new THREE.MeshBasicMaterial({ color: color });
var meshText1 = new THREE.Mesh(textGeo1, textMaterial);
// Position of axes extremities
var positionEndAxes = axes2.geometry.attributes.position;
var label1X = positionEndAxes.getX(0);
meshText1.position.x = label1X + axisLength;
meshText1.position.y = 0;
meshText1.position.z = 0;
// Rotation of "X" label
//meshText1.rotation = zoomCamera.rotation;
meshText1.lookAt(zoomCamera.position);
// Add meshText to zoomScene
zoomScene.add(meshText1);
});
}
zoomCamera
представляет a PerspectiveCamera
, который является камерой subwindow (i.e zoomScene
), добавляю TextGeometry к zoomScene
, делая:
zoomScene.add(meshText1);
Может ли кто-нибудь увидеть, что не так в моем коде? Интересно, могу ли я повернуть метку "X" на себя, т.е. Метка "X" вращается как ось, но ориентация на себя (локальная) применяется в зависимости от угла поворота тэта, поэтому ярлык всегда находится на грани пользователя во время вращения камеры?
Спасибо за вашу помощь.