在 Three.js 中，你可以使用 THREE.AxisHelper 来给坐标轴添加标注名称。下面是一个示例代码：
// 创建场景、相机和渲染器
var scene = new THREE.Scene();
var camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
var renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);
// 添加坐标轴辅助器
var axisHelper = new THREE.AxisHelper(5); // 参数为辅助线长度
scene.add(axisHelper);
// 添加坐标轴名称
var fontLoader = new THREE.FontLoader();
fontLoader.load('path/to/font.json', function (font) {
var xLabelGeometry = new THREE.TextGeometry('X', { font: font, size: 0.5 });
var yLabelGeometry = new THREE.TextGeometry('Y', { font: font, size: 0.5 });
var zLabelGeometry = new THREE.TextGeometry('Z', { font: font, size: 0.5 });
var xLabelMaterial = new THREE.MeshBasicMaterial({ color: 0xff0000 });
var yLabelMaterial = new THREE.MeshBasicMaterial({ color: 0x00ff00 });
var zLabelMaterial = new THREE.MeshBasicMaterial({ color: 0x0000ff });
var xLabelMesh = new THREE.Mesh(xLabelGeometry, xLabelMaterial);
var yLabelMesh = new THREE.Mesh(yLabelGeometry, yLabelMaterial);
var zLabelMesh = new THREE.Mesh(zLabelGeometry, zLabelMaterial);
xLabelMesh.position.x += 5; // 标注位置偏移
yLabelMesh.position.y += 5;
zLabelMesh.position.z += 5;
scene.add(xLabelMesh);
scene.add(yLabelMesh);
scene.add(zLabelMesh);
// 渲染场景
function animate() {
requestAnimationFrame(animate);
renderer.render(scene, camera);
}
animate();
});
以上代码创建了一个场景，添加了坐标轴辅助器，并使用字体文件给坐标轴添加了标注名称。你需要将 path/to/font.json 替换为实际的字体文件路径。
内容由零声教学AI助手提供，问题来源于学员提问
res.jsonValue["History"]..." />
res.jsonValue["History"];
..." />
