threejs加载图片需创站与 如何写出字体

前一阵在做ThreeJs的图表，现在整理一下当时的笔记。

今天准备解决的有threejs中贴图跨域问题   如何添加文字

首先是threejs加图片时的跨域错误

原因是    没有放到网站，本地测试需要加上 跨域 解除

解决办法有两个 一个是临时解决，一个是长期解决

临时解决办法是把浏览器设置一下：

在chrome快捷方式，目标里如下设置
"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" 后面加           

        --disable-web-security   或者加

        --allow-file-access-from-files 

长久的解决办法是开一个服务器 

需要部署在一个http sever上 错误是不允许读file 路径 因为相当于客户机本机

步骤在threejs-master/utils/servers的readme里面有写哦

而我采取的方法是，装了一个Python

下载Python，然后更改path路径

装了python需要服务器的话直接在命令提示行进入当前目录然后输入python -m SimpleHTTPServer就是一个新的服务器了

要运行localhost：8080

---

下面是怎么显示文字的方法：

总体思想是，将ttf（字体的格式）变成js格式

注意的内容有：记得字体名字一定是英文全小写 而且 默认字体只有英文，如果生成的字体js的文字名字里有中文需要改成英文   怎么可以转换字体为中文呢？

1、首先网上去下一个体积小一点的ttf（字体格式）然后丢进“facetype.js-gh-pages”（这是一个zip，长相如下图）就会给你转换好

 http://pan.baidu.com/s/1kTCMTUn （facetype.js-gh-pages下载的百度云链接）

然后选择下载的ttf文件，之后你的浏览器就会自动下载出来一个js字体文件

2、下面就是如何使用“facetype.js-gh-pages生成字体的js:

首先将生成的文字的JavaScript打开，将他的name改为英文的。

然后将js引用在HTML里面

<script type="text/javascript" src="js/helvetiker_regular.typeface.js"></script>

再在script里写入字体的属性：

var options = {
                    size: 10,
                    height: 0,
                    weight: 'normal',
                    font: 'helvetiker',这个字体要用英文名字哦，是中文字体也要用英文名字
                    style: 'normal',
                    bevelThickness: 1,
                    bevelSize: 1,
                    bevelSegments: 1,
                    curveSegments: 50,
                    steps: 1
               };
               scene.add(new THREE.Mesh(
                    new THREE.TextGeometry("hello",options),
                    new THREE.MeshBasicMaterial({color:0xcccccc})
               ))