将标签添加到轴助手 - 无法获取四肢顶点

Add labels to AxisHelper - can't get vertices of extremities

本文关键字：获取 顶点 添加 标签      更新时间：2023-09-26

我想在随之旋转的 AxisHelper 上添加标签。从这个链接，我使用了这个代码片段：

  // Axes
  axes2 = new THREE.AxisHelper(70);
  // Axes labels
  addLabelAxes();
   
  // Add axes to zoomScene
  zoomScene.add(axes2);

function addLabelAxes() {
  // Axes label
  var loader = new THREE.FontLoader();
  loader.load( 'js/helvetiker_regular.typeface.js', function ( font ) {
  textGeo = new THREE.TextGeometry( 'Example label', {
    font: font,
    size: 15,
        height: 5,
    curveSegments: 10,
    } );
  
  var  color = new THREE.Color();
  color.setRGB(255, 0, 0);
  textMaterial = new THREE.MeshBasicMaterial({ color: color });
  meshText = new THREE.Mesh(textGeo, textMaterial);
  // Position of first axis
  meshText.position.x = axes2.geometry.vertices[1].x;
  meshText.position.y = axes2.geometry.vertices[1].y;
  meshText.position.z = axes2.geometry.vertices[1].z;
  
  meshText.rotation = zoomCamera.rotation;
  zoomScene.add(meshText);
  
  });

但是我在控制台日志中收到以下错误：

TypeError: axes2.geometry.vertices is undefined
addLabelAxes/<()
 sphere_dev.js:230
THREE.FontLoader.prototype.load/<()
 three.min.js:382
THREE.XHRLoader.prototype.load/<()

这里可能出了什么问题？

AxisHelper的

几何是BufferGeometry型，而不是Geometry型。

您可以像这样访问AxisHelper几何体的位置元素：

var axes = new THREE.AxisHelper( 20 );
var position = axes.geometry.attributes.position;

position是一个BufferAttribute。如果你研究它的内容，结构应该是显而易见的。

然后，您可以使用如下模式访问属性的元素：

var x = position.getX( index ); // or getY, getZ

三.js R.76

相关文章：