如何在Three.js场景上放置2D文本？
我有一个简单的3D场景，用JavaScript在如何在Three.js场景上放置2D文本？,three.js,Three.js,我有一个简单的3D场景，用JavaScript在标签中编写 我需要在Three.js场景上放置一个文本。这是我的密码： <html> <head> <title>First page.</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <
Three.js<html>
<head>
<title>First page.</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link href="/errordocs/style/general.css" rel="stylesheet" type="text/css">
<script src="https://threejs.org/build/three.js" crossorigin="anonymous"></script>
<style>
body { margin: 0; }
canvas { width: 100%; height: 100% }
</style>
</head>
<body>
<script>
var scene, camera, renderer;
var geometry, material, mesh;
init();
function init() {
scene = new THREE.Scene();
scene.background = new THREE.Color( 0x222222 );
camera = new THREE.PerspectiveCamera( 50, window.innerWidth / window.innerHeight, 0.01, 100 );
camera.position.z = 1;
geometry = new THREE.SphereGeometry( 0.1, 20, 20 );
material = new THREE.MeshNormalMaterial();
mesh = new THREE.Mesh( geometry, material );
scene.add( mesh );
renderer = new THREE.WebGLRenderer( { antialias: true } );
renderer.setSize( window.innerWidth, window.innerHeight );
document.body.appendChild( renderer.domElement );
}
</script>
</body>
</html>
第一页。
正文{页边距：0；}
画布{宽度：100%；高度：100%}
var场景、摄影机、渲染器；
变量几何、材质、网格；
init（）；
函数init（）{
场景=新的三个。场景（）；
scene.background=新的三种颜色（0x2222）；
摄像头=新的三个透视摄像头（50，window.innerWidth/window.innerHeight，0.01100）；
摄像机位置z=1；
几何学=新的三种。球墨法（0.1,20,20）；
材质=新的三个。MeshNormalMaterial（）；
网格=新的三个网格（几何体、材质）；
场景。添加（网格）；
renderer=new THREE.WebGLRenderer（{antialas:true}）；
renderer.setSize（window.innerWidth、window.innerHeight）；
document.body.appendChild（renderer.doElement）；
}
Three.js实现预期结果的方法不止一种
从“@seregpie/three.text sprite”导入TextSprite；
设sprite=new-THREE.TextSprite（{
text:'文本必须在此处呈现…'，
对齐：“中心”
fontFamily：“Arial，Helvetica，无衬线”，
尺寸：28，
颜色：'#ffffff'}）；
场景。添加（精灵）；