在三维场景加载精灵

function createSpriteText(){
			        //先用画布将文字画出
			        let text = "吃啥";
			        let canvas = document.createElement("canvas");
			        let ctx = canvas.getContext("2d");
			        ctx.fillStyle = "#ffff00";
			        ctx.font = "Bold 100px Arial";
			        ctx.lineWidth = 4;
			        ctx.fillText(text,4,104);
			        let texture = new THREE.Texture(canvas);
			        texture.needsUpdate = true;

			        //使用Sprite显示文字
			        let material = new THREE.SpriteMaterial({map:texture});
			        let textObj = new THREE.Sprite(material);
			         textObj.scale.set(0.5 , 0.25 , 0.75 );
			        textObj.position.set(0,0,1);
			        console.log("加载精灵");
			        scene.add(textObj);
			        //return textObj;
			}

在三维场景中添加精灵,.精灵可以自动根据相机的视角一直朝着相机的方向,不管怎么旋转都可以看见文字

在三维场景加载精灵_第1张图片

在三维场景加载精灵_第2张图片

在哪个视角看都可以的

你可能感兴趣的:(HTML总结,JS函数方法总结)