Three.js Vue 如何加载字体,和遇到问题解决: 中加载字体的问题 Uncaught SyntaxError: Unexpected token = in JSON at position 0
Three.js Vue 中加载字体的问题 Uncaught SyntaxError: Unexpected token = in JSON at position 0
一、转换字体文件到 json
要想在 three.js
中使用字体文件,需要将其转换为 .json
文件,再用 Three.FileLoader()
加载
官方提到的转换工具如下:
在线字体转换工具https://gero3.github.io/facetype.js/
如我转换后的字体文件
二、使用 FontLoader
载入字体文件
在 FontLoader
的回调方法内部完成之后的一些操作
// fontnew Three.FontLoader().load('/font/LLPixel_Regular.json', font => {const textGeometry = new Three.TextGeometry('Three.js', {font: font,size: 10, // 字体大小height: 4, // 字体厚度curveSegments: 20,bevelEnabled: false,bevelThickness: 1,bevelSize: 0,bevelOffset: 0,bevelSegments: 15})const textMetiral = new Three.MeshBasicMaterial({color: 0x0090ff})this.text = new Three.Mesh(textGeometry, textMetiral)this.text.position.set(0,0,50)// 添加到 scenethis.scene.add( this.text )this.render() // 添加完成后渲染一下画面}, xhr=>{}, err=>{console.log(err)})
三、字体载入时遇到的错误
在 Vue 中 使用 Three.js
载入字体的时候遇到无法识别的问题
其本质是没有找到对应的 .json
文件路径
这里不应该放到 src 目录,应该放到 public 目录下
new Three.FontLoader().load('/font/LLPixel_Regular.json', font => {})
对应的是 /public/font/LLPixel_Regular.json
四、结果
Three.js Vue 如何加载字体,和遇到问题解决: 中加载字体的问题 Uncaught SyntaxError: Unexpected token = in JSON at position 0相关推荐
- js Uncaught SyntaxError: Unexpected token , in JSON at position xxx at JSON.parse问题解决
问题描述: Uncaught SyntaxError: Unexpected token , in JSON at position 4100 at JSON.parse JSON.Parse()方法 ...
- 解决vue项目build之后部署到服务器访问的时候出现报错:Uncaught SyntaxError: Unexpected token ‘<‘ chunk-vendors:XXXXXX
第一种情况修改下面这个位置 第二种情况修改 如果还是不行就把模式改成hash
- 微信小程序 Unexpected token in JSON at position 0 设置二维码,并且使用js中JSON.parse()函数将二维码返回的值转化为json格式
代码报错: Unexpected token in JSON at position 0 使用二维码生成器, JSON.parse()函数 1.可以随便在网上找一个生成二维码的网站 本人用的是这个 二 ...
- chunk-vendors.fcca6113.js:1 Uncaught SyntaxError: Unexpected token ‘<‘
由于配置了 问题三.因为前端是使用的vue,结果在加载资源的时候碰到浏览器报错:Uncaught SyntaxError: Unexpected token < 具体现象是js文件夹下的所有js ...
- js常见报错之Unexpected token in JSON at position
js常见报错之Unexpected token ] in JSON at position 结合他人出错总结,出现这个报错提示,根本原因只有一个json解析异常,所以json的返回数据注意检查其返回内 ...
- 【shiro】使用shiro搭建的项目,页面引用js,报错:Uncaught SyntaxError: Unexpected token ...
使用shiro搭建项目过程中,总是出现登录页面 登录第一次有效果,登陆第二次出现302状态码,第三次又有效果,第四次又没有效果的局面. 因此,采用ajax提交页面登录的用户名和密码,但是在引用js的过 ...
- Vue Uncaught SyntaxError: Unexpected token ‘<‘ 路由问题
最近在部署vue项目是遇到,Uncaught SyntaxError: Unexpected token '<' 路由问题,项目能够正常访问,但是每次刷新之后,会显示空白页面.最后经过分析,是路 ...
- Uncaught SyntaxError: Unexpected token ‘<‘ (at chunk-vendors.js:1:1) app.js:1 Uncaught SyntaxError:
系统部署完成后,控制套报错: Uncaught SyntaxError: Unexpected token '<' (at chunk-vendors.js:1:1) app.js:1 Unca ...
- chunk-vendors.7142f8da.js:1 Uncaught SyntaxError: Unexpected token ‘<‘
这是我vue 打包后 用 serve -s dist 预览发现的 原因 在vue.config.js 中所配置的参数问题 publicPath: process.env.NODE_ENV === ' ...
最新文章
- [笔记]在ubuntu下使用conky
- [批处理]使用Log.io监控日志变化
- 承载网络开启后显示无法连接到Internet,已解决
- 微信内测新功能:公众号们脖子一凉...
- WIZnet 在 Embedded World 2013展会中的展示
- DataGrid显示字段过长用...代替
- 基于mAppWidget实现手绘地图--索引DEMO
- TASKCTL4.1安装选项详解
- JavaFX桌面应用开发-Scene(场景)
- 项目总结:快餐店POS收银系统
- 我的Windows实用软件清单
- 【BZOJ3470】Freda’s Walk
- 重磅!人工智能会取代科学家? 道翰天琼认知智能机器人API接口平台为您揭秘-1。
- 【力扣】695岛屿的最大面积
- linux 查看 磁盘iops,linux – 磁盘IOPS和sar tps之间的关系
- 李沐动手学深度学习V2-图像增广和代码实现
- 互联网行业应届待遇十一档2014
- 街景房屋号码 (SVHN) 数据集
- 如何用波士顿矩阵法来分析产品的生命周期?
- erp5开源制造业erp服装行业解决方案