three.js实现3D字体
·
第一步:找个.ttf字体利用下面的网站转换成json文件
https://gero3.github.io/facetype.js/
import * as THREE from 'three';
const scene = new THREE.Scene();
function add3DFont() {
new THREE.FontLoader().load('font/FZYaoTi_Regular.json', function(font) {
//加入立体文字
var text = new THREE.TextGeometry("左本的博客,Three.js3D文字", {
// 设定文字字体
font: font,
//尺寸
size: 24,
//厚度
height: 5
});
text.computeBoundingBox();
// 设置偏移
text.translate(-0, 0, 0);
//3D文字材质
var m = new THREE.MeshStandardMaterial({
color: "#FFFFFF",
});
let fontMesh = new THREE.Mesh(text, m);
fontMesh.position.y = 1;
scene.add(fontMesh);
});
}
将字体文件上传即可
更多推荐
所有评论(0)