Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
车家大少爷
three.js
提交
77adaa34
T
three.js
项目概览
车家大少爷
/
three.js
与 Fork 源项目一致
从无法访问的项目Fork
通知
2
Star
0
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
T
three.js
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
未验证
提交
77adaa34
编写于
1月 26, 2019
作者:
M
Mr.doob
提交者:
GitHub
1月 26, 2019
浏览文件
操作
浏览文件
下载
差异文件
Merge pull request #15645 from gogoend/zh_doc
Doc: a little fixes in manual folder in zh doc.
上级
bf062b1c
67d22732
变更
2
隐藏空白更改
内联
并排
Showing
2 changed file
with
8 addition
and
8 deletion
+8
-8
docs/manual/zh/introduction/Creating-a-scene.html
docs/manual/zh/introduction/Creating-a-scene.html
+6
-6
docs/manual/zh/introduction/How-to-run-things-locally.html
docs/manual/zh/introduction/How-to-run-things-locally.html
+2
-2
未找到文件。
docs/manual/zh/introduction/Creating-a-scene.html
浏览文件 @
77adaa34
...
...
@@ -10,11 +10,11 @@
<body>
<h1>
创建一个场景([name])
</h1><br
/>
<p>
这一部分将对three.js来做一个简要的介绍
。在这一部分里,我们将以搭建一个包含有旋转立方体的场景。在
页面下方有一个已经完成的例子,当你遇到麻烦,或者需要帮助的时候,可以看一看。
</p>
<p>
这一部分将对three.js来做一个简要的介绍
;我们将开始搭建一个的场景,其中包含一个正在旋转的立方体。
页面下方有一个已经完成的例子,当你遇到麻烦,或者需要帮助的时候,可以看一看。
</p>
<h2>
开始之前
</h2>
<p>
在
你
开始使用three.js之前,你需要一个地方来显示它。将下列HTML代码保存为你电脑上的一个HTML文件,同时将[link:https://threejs.org/build/three.js three.js]复制到该HTML文件所在的目录下的js/目录下,然后在你的浏览器中打开这个HTML文件。
在开始使用three.js之前,你需要一个地方来显示它。将下列HTML代码保存为你电脑上的一个HTML文件,同时将[link:https://threejs.org/build/three.js three.js]复制到该HTML文件所在的目录下的js/目录下,然后在你的浏览器中打开这个HTML文件。
</p>
<code>
<
!DOCTYPE html
>
...
...
@@ -69,7 +69,7 @@
<p>
最后,我们将
<strong>
renderer
</strong>
(渲染器)这个元素添加到我们的HTML文档中,这也就是渲染器使用
<
canvas
>
元素来将场景展现给我们。
</p>
<p><em>
“嗯,看起来很不错,那你说的那个立方体在哪儿?”
</em>
我们接下来来对它继续进行添加吧
。
</p>
<p><em>
“嗯,看起来很不错,那你说的那个立方体在哪儿?”
</em>
接下来,我们就来对它继续进行添加
。
</p>
<code>
var geometry = new THREE.BoxGeometry( 1, 1, 1 );
...
...
@@ -80,9 +80,9 @@
camera.position.z = 5;
</code>
<p>
要创建一个立方体,我们需要一个
<strong>
BoxGeometry
</strong>
(立方体)对象. 这个对象包含了一个立方体中所有的顶点(
<strong>
vertices
</strong>
)和面
<strong>
faces
</strong>
。未来我们将在这方面进行更多的探索。
</p>
<p>
要创建一个立方体,我们需要一个
<strong>
BoxGeometry
</strong>
(立方体)对象. 这个对象包含了一个立方体中所有的顶点(
<strong>
vertices
</strong>
)和面
(
<strong>
faces
</strong>
)
。未来我们将在这方面进行更多的探索。
</p>
<p>
接下来,对于这个立方体,我们需要给它一个材质,来让它有颜色。Three.js自带了几种材质,
但
在这里我们使用的是
<strong>
MeshBasicMaterial
</strong>
。所有的材质是都一个将会被应用于立方体的属性对象。在这里为了简单起见,我们只设置一个color属性,值为
<strong>
0x00ff00
</strong>
,也就是绿色。这里所做的事情,就相当于是在CSS或者Photoshop中使用十六进制(
<strong>
hex colors
</strong>
)的颜色格式来设置颜色。
</p>
<p>
接下来,对于这个立方体,我们需要给它一个材质,来让它有颜色。Three.js自带了几种材质,在这里我们使用的是
<strong>
MeshBasicMaterial
</strong>
。所有的材质是都一个将会被应用于立方体的属性对象。在这里为了简单起见,我们只设置一个color属性,值为
<strong>
0x00ff00
</strong>
,也就是绿色。这里所做的事情,就相当于是在CSS或者Photoshop中使用十六进制(
<strong>
hex colors
</strong>
)的颜色格式来设置颜色。
</p>
<p>
第三步,我们需要一个
<strong>
Mesh
</strong>
(网格)。 网格是包含有一个几何体以及应用在在此几何体上的材质的对象,我们可以直接将网格对象放入到我们的场景中,并让它在场景中自由移动。
</p>
...
...
@@ -105,7 +105,7 @@
<h2>
使立方体动起来
</h2>
<p>
在开始之前,如果你已经将上面的代码写入到了你所创建的文件中,你应当已经可以看到一个绿色的立方体。让我们来做一些更加有趣的事
——
让它旋转起来。
</p>
在开始之前,如果你已经将上面的代码写入到了你所创建的文件中,你应当已经可以看到一个绿色的立方体。让我们来做一些更加有趣的事
——
让它旋转起来。
</p>
<p>
将下列代码添加到animate()函数中
<strong>
renderer.render
</strong>
调用的上方:
</p>
...
...
docs/manual/zh/introduction/How-to-run-things-locally.html
浏览文件 @
77adaa34
...
...
@@ -25,10 +25,10 @@
<ol>
<li>
在浏览器中改变本地文件的安全策略,这将使你可以通过
<code>
file:///yourFile.html
</code>
来直接运行
*本地文件系统*
中的文件。
在浏览器中改变本地文件的安全策略,这将使你可以通过
<code>
file:///yourFile.html
</code>
来直接运行
本地文件系统
中的文件。
</li>
<li>
从本地的服务器运行文件,这可以让你通过
<code>
http://localhost/yourFile.html
</code>
来访问运行在
*本地服务器*
上的文件。
从本地的服务器运行文件,这可以让你通过
<code>
http://localhost/yourFile.html
</code>
来访问运行在
本地服务器
上的文件。
</li>
</ol>
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录