three.js 文字显示不出来
试了下使用three.js加载文字,首先是报了一个这样的错误:
Cross origin requests are only supported for HTTP.”
当时很懵逼,去网上查了查,发现是因为我直接用浏览器打开了这个html文件,url的协议是file协议,无法使用loader.load的方式加载出字体文件,只能使用http,https等等协议,所以不能直接用浏览器打开这个文件,这里就要使用http-server了。
使用npm install -g http-server下载http-server,
然后再在项目目录下输入http-server,就可以在本地的端口下运行了,eg:localhost:8080/helloworld.html
(原回答地址:https://stackoverflow.com/questions/10752055/cross-origin-requests-are-only-supported-for-http-error-when-loading-a-local)
打开这个地址后,成功的进入到了这个页面,虽然不再报错了,但是仍然没有显示文字。。。这是为什么呢,仔细看了一下代码,发现我把
renderer.render(scene, camera);
这行代码写在了loader.load的外面,loader.load是异步函数,渲染写在loader.load的外面的话,就会变成在字体成功加载出来之前,就进行了渲染,所以当然是渲染不出来的,把渲染写在loader.load里面或者把loader.load用async/await写成同步函数就可以了。
three.js 文字显示不出来的更多相关文章
- avalon.js 文字显示更多与收起
isShowMore: function (content) { if(content && content.length >= 124){ var shortContent = ...
- j-query应用---鼠标悬停不同文字显示不同背景图片banner动画
源代码部分:注意事项:样式表的引用的路径要一致. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ...
- td默认文字超出后显示..,点击tr时td文字显示完整
做项目时,产品提的需求,table表格里面,每一列限制文字超出宽度后显示省略号,等点击td时,文字显示完整,今天整理了一下代码,积累一下 备注:1.邮箱和网址,在td里面不会自动换行,需要增加word ...
- echarts柱状图坐标文字显示不完整解决方式
echarts柱状图坐标文字显示不完整解决方式 本文转载自:https://jingyan.baidu.com/article/ab69b2707a9aeb2ca7189f0c.html echart ...
- php 两段文本对比,不同的文字显示高亮
php 两段文本对比,不同的文字显示高亮[下面这个只能区分错误后面的..] <?php $str1 ="MIIEvQIBADANBgkqhkiG9w0BAQEFAASCBKcwgg ...
- js倒计时显示
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>j ...
- Js控制显示、隐藏文本框中的密码
Js控制显示.隐藏文本框中的密码,也可称为是一款小型的JavaScript星号密码破解器,点击会显示出密码类型的文本框中的真实信息,再次点击则还原,程序 主要是获取HTML元素对象,然后强制更改元素属 ...
- js简单显示和隐藏div,触发超链接,动态更改button值,setInterval()简单使用,jquery easyui弹出框简单使用 .
js简单显示和隐藏div .<!DOCTYPE html> .<html> .<head> .<meta charset="UTF-8"& ...
- 完美解决 向UILable 文字最后插入N张图片,支持向限制行数的UILable 最后一行插入,多余文字显示...
效果: ====直接上代码吧=== // // UILabel+StringFrame.h // QYER // // Created by qyer on 15/3/19. // Copyright ...
随机推荐
- POJ 3190 Stall Reservations贪心
POJ 3190 Stall Reservations贪心 Description Oh those picky N (1 <= N <= 50,000) cows! They are s ...
- 【我的漫漫跨考路】有生之年·调完了BUG--冒泡排序C++版本
正文之前 今天去牛客网试了试一些实战编程题,感觉贼有意思,但是也很难,挑了个成绩排序的算法题我就开始怼! 对我一个编程经验并不是很丰富的人来说,确实算是个挑战了. 所以我满满当当的搞了四个小时多,才算 ...
- CSS禁止用户选择复制
-webkit-user-select:none ;-moz-user-select:none; P.S. -wekit-gg浏览器 -moz -ff浏览器 WebKit 是一个开源的浏览器引擎,与之 ...
- hibernate exception nested transactions not supported 解决方法
开启事务之前先判断事务是否已经打开,方法如下: JdbcTransaction tx=(JdbcTransaction) session.beginTransaction(); 改为JdbcTrans ...
- python之禅 the zen of python
>>> import this The Zen of Python, by Tim Peters Beautiful is better than ugly. Explicit is ...
- Loadrunner常见错误处理方法
1.错误 -26601: 解压缩函数(wgzMemDecompressBuffer)失败,返回代码=-5 (Z_BUF_ERROR).inSize=0.inUse=0.outUse=0 用LR做压力测 ...
- S7-200PLC间的PPI通信
一. PPI通信协议是一种主从式的通信协议,上位机即PC机为主,PLC为从.通信开始由计算机发起,PLC予以响应. 1).计算机按通信任务,用一定格式,向PLC发送通信命令. 2).PLC收到命令后, ...
- StringBulider简单用法
StringBuild的是个动态对象,可直接拼加上字符串:而string对象的步骤:先初始化对象并赋值了,而后在拼加字符串时,先要创建需要拼加的字符串,然后再拼加,所以这就是StirngBuild远比 ...
- Java 编写小程序,下载指定网页上的所有图片
使用Java编写一个小程序,可以根据指定的网页地址,下载网页中的所有图片:使用到网络编程.线程池.IO和UUID的技术.具体代码如下: import java.io.File; import java ...
- 一个基于JRTPLIB的轻量级RTSP客户端(myRTSPClient)——收流篇:(三)RTSP命令解析
一.RTSP命令简述 RTSP是用来控制实时流媒体“播放”.“暂停”.“停止”.“录像”等行为的传输协议.该协议规定了一系列命令以及这些命令的发送格式,RTSP客户端可以通过发送这些指定的命令,从而控 ...