linaCharts开发笔记:Three.js导入obj和使用中文
直接进入主题,首先是导入中文字体,Three.js自带只支持显示3D的英文,如果需要使用中文,需要自己导入。
一、选一个你喜欢的字体,也就是ttf文件,尽量选小一点的,不然转换成的js文件也会非常大。
二、下载facetype.js,地址:
https://github.com/gero3/facetype.js
然后运行index.html,界面如下:
直接将ttf文件转换为js文件,比如我生成的 FZYaoTi_Regular.js
三、直接使用代码如下:
var loader = new THREE.FontLoader();loader.load( 'lib/font/FZYaoTi_Regular.js', function ( font ) {var text_style = {font: font,size: 4,height: 1,curveSegments: 12,//曲线上点的数量bevelThickness: 0.1, //文本斜面深度bevelSize: 0.1, //斜面离轮廓的距离bevelEnabled: true //是否打开曲面}var textGeo = new THREE.TextGeometry( "莉娜酱", text_style );var textMaterial = new THREE.MeshPhongMaterial( {color: 0xB3B3B3} ); var mesh = new THREE.Mesh( textGeo, textMaterial );//对于文字,先设置lookat和先设置position是不一样的mesh.lookAt(new THREE.Vector3(100, 0, 150));mesh.position.set( 20, -4, 30 ); scene.add( mesh );});
特别说明,一定要先设置文字的lookAt再设置position,如果反过来的话,文字出现和你想象不一样的结果(比如会自旋转一个角度)
然后,使用obj和mtl:
一、首先用3dmax生成模型的.obj和.mtl文件,我是放在model/下的,后面会设置路径
二、导入相关js
<script type="text/javascript" src="lib/MTLLoader.js"></script><script type="text/javascript" src="lib/OBJLoader.js"></script>
三、代码如下:
var mtlLoader = new THREE.MTLLoader(); mtlLoader.setPath( 'model/' ); mtlLoader.load( 'test8.mtl', function( materials ) { materials.preload(); var objLoader = new THREE.OBJLoader(); objLoader.setMaterials( materials ); objLoader.setPath( 'model/' ); objLoader.load( 'test8.obj', function ( object ) { object.position.set(0,0,0);object.scale.set(2,2,2);scene.add( object ); }); });
需要注意,有时候导入的模型并不在中心,这时候需要在3dmax中将模型的位置调到0,0,0再导出
linaCharts开发笔记:Three.js导入obj和使用中文相关推荐
- 【Three.js】解决使用Three.js导入obj模型不可见问题详细记录
问题描述: 近期在做三维重建项目,需要把最终生成的obj文件导入到web端浏览,这里使用的是three.js(另一个是babylon.js),但博主发现导入meshlab生成的obj时无法显示模型,但 ...
- 使用three.js导入OBJ模型,变更、修改成其他OBJ模型和模型不可见原因说明
最近的一个项目需要在HTML中对OBJ模型进行大量的变更,修改为其他模型.基于这个需求下,这里有一种解决方案. 另外在各大论坛上的相关博客基本都是那几种导入obj例子····并没有对后续操作进行说明. ...
- 67 Three.js 导入OBJ格式的模型
简介 OBJ是一种简单的三维文件格式,由Wavefront Technologies创建.它是使用最广泛的三维文件格式,用来定义对象的几何体.MTL文件常同OBJ文件一起使用. Three.js还有一 ...
- STM32开发笔记108:将STM32CubeIDE设置为中文
文章目录 前言 1.在浏览器中输入下列网站 2.找到具体网址 3.安装软件 4.输入网址 5.搜索等待 6.找到简体中文 7.等待... 8.同意License 9.等待安装完毕 10.重启软件 11 ...
- 嵌入式系统开发笔记0_0:目录
本系列文章将向大家介绍嵌入式系统开发的各方面知识. 本系列文章所介绍的知识和内容,除电路图设计外,其它均采用开源系统,所以你不会在这个系列文章中看到Keil.IAR等软件. 本系列文章涉及C.C++. ...
- 微信小程序开发笔记 进阶篇③——onfire.js事件订阅和发布在微信小程序中的使用
文章目录 一.前言 二.onfire.js介绍 三.API介绍 四.实例应用 五.onfire源码 六.实例源码 一.前言 微信小程序开发笔记--导读 二.onfire.js介绍 一个简单实用的事件订 ...
- Android开发笔记(六十四)网页加载与JS调用
内置浏览器 网页视图WebView 如果一个网站已经有现成的网页及业务逻辑,那么使用WebView将其内嵌到app中,省去了app重画页面与http通信的事情,无疑是更经济的做法.WebView就是A ...
- prototype.js开发笔记(转)
prototype.js开发笔记 Table of Contents 1. Programming Guide 1.1. Prototype是什么? 1.2. 关联文章 1.3. 通用性方法 1.3. ...
- Android开发笔记(一百四十三)任务调度JobScheduler
任务调度 App除了通过屏幕向用户展示可交互的界面元素之外,还经常需要在后台做些背地里做的事情,比如说精密计算.文件下载.统计分析.数据导入.状态监控等等,这些用户看不到的事一般放在Service中处 ...
最新文章
- C++——auto、decltype、返回类型后置、模板别名:using =、nullptr
- Android 代码设置调试等待
- Daily Scrum 10.24
- 微信小程序,实现 watch 属性,监听数据变化
- H5移动页面的touch事件与点击穿透问题
- 讲述一个自学七年Python编程的码农人生
- 错误: 找不到或无法加载主类
- oem718d 基准站设置_诺瓦泰NovAtel OEM718D全系统多频单机测向板卡
- 如此多的深度学习框架,为什么我选择PyTorch?
- ISIS-三类路由器区域路由
- 基于SSM框架搭建的疫情打卡系统 报告+项目源码及数据库文件
- 用WIN PE通过修改系统注册表修复因盘符错乱而导致系统无法启动问题
- java 简体繁体互相转换
- 活动目录备份和灾难恢复之手动备份与非授权还原
- 全球游戏人热评CGDC 09 盛赞中国网游产业
- ROS创建Web代理(Web proxy)给QQ使用HTTP代理
- 解决VMware虚拟机中没有vmnet0的情况
- 电脑常用快捷键【按使用场景分类】-Windows
- Windows10使用浏览器崩溃复现及分析
- 下厨房用过那些 slogan