Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
Ablesons
three.js
提交
a885290f
T
three.js
项目概览
Ablesons
/
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,发现更多精彩内容 >>
未验证
提交
a885290f
编写于
1月 21, 2018
作者:
M
Mr.doob
提交者:
GitHub
1月 21, 2018
浏览文件
操作
浏览文件
下载
差异文件
Merge pull request #13146 from DonKarlssonSan/patch-1
Format according to official code style
上级
efe24f89
724901d4
变更
1
隐藏空白更改
内联
并排
Showing
1 changed file
with
12 addition
and
12 deletion
+12
-12
docs/manual/introduction/Drawing-lines.html
docs/manual/introduction/Drawing-lines.html
+12
-12
未找到文件。
docs/manual/introduction/Drawing-lines.html
浏览文件 @
a885290f
...
...
@@ -18,19 +18,19 @@
<p>
Here is the code that we will use:
</p>
<code>
var renderer = new THREE.WebGLRenderer();
renderer.setSize(
window.innerWidth, window.innerHeight
);
document.body.appendChild(
renderer.domElement
);
renderer.setSize(
window.innerWidth, window.innerHeight
);
document.body.appendChild(
renderer.domElement
);
var camera = new THREE.PerspectiveCamera(
45, window.innerWidth / window.innerHeight, 1, 500
);
camera.position.set(
0, 0, 100
);
camera.lookAt(
new THREE.Vector3(0, 0, 0)
);
var camera = new THREE.PerspectiveCamera(
45, window.innerWidth / window.innerHeight, 1, 500
);
camera.position.set(
0, 0, 100
);
camera.lookAt(
new THREE.Vector3( 0, 0, 0 )
);
var scene = new THREE.Scene();
</code>
<p>
Next thing we will do is define a material. For lines we have to use [page:LineBasicMaterial] or [page:LineDashedMaterial].
</p>
<code>
//create a blue LineBasicMaterial
var material = new THREE.LineBasicMaterial(
{ color: 0x0000ff }
);
var material = new THREE.LineBasicMaterial(
{ color: 0x0000ff }
);
</code>
<p>
...
...
@@ -40,22 +40,22 @@ var material = new THREE.LineBasicMaterial({ color: 0x0000ff });
<code>
var geometry = new THREE.Geometry();
geometry.vertices.push(new THREE.Vector3(
-10, 0, 0)
);
geometry.vertices.push(new THREE.Vector3(
0, 10, 0)
);
geometry.vertices.push(new THREE.Vector3(
10, 0, 0)
);
geometry.vertices.push(new THREE.Vector3(
-10, 0, 0)
);
geometry.vertices.push(new THREE.Vector3(
0, 10, 0)
);
geometry.vertices.push(new THREE.Vector3(
10, 0, 0)
);
</code>
<p>
Note that lines are drawn between each consecutive pair of vertices, but not between the first and last (the line is not closed.)
</p>
<p>
Now that we have points for two lines and a material, we can put them together to form a line.
</p>
<code>
var line = new THREE.Line(
geometry, material
);
var line = new THREE.Line(
geometry, material
);
</code>
<p>
All that's left is to add it to the scene and call [page:WebGLRenderer.render render].
</p>
<code>
scene.add(
line
);
renderer.render(
scene, camera
);
scene.add(
line
);
renderer.render(
scene, camera
);
</code>
<p>
You should now be seeing an arrow pointing upwards, made from two blue lines.
</p>
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录