# 绘制线条

假设您要绘制直线或圆，而不是线框网格。首先，我们需要设置渲染器，场景和相机（请参阅创建场景页面）。

这是我们将使用的代码：`var renderer = new v3d.WebGLRenderer(); renderer.setSize(window.innerWidth, window.innerHeight); document.body.appendChild(renderer.domElement); var camera = new v3d.PerspectiveCamera(45, window.innerWidth / window.innerHeight, 1, 500); camera.position.set(0, 0, 100); camera.lookAt(0, 0, 0); var scene = new v3d.Scene();`

接下来我们要做的是定义一种材料。对于行，我们必须使用LineBasicMaterial或LineDashedMaterial。`//create a blue LineBasicMaterial var material = new v3d.LineBasicMaterial({ color: 0x0000ff });`

在材质之后，我们需要一个带有一些顶点的Geometry或BufferGeometry（建议使用BufferGeometry，因为它更高效，但为了简单起见，我们将在这里使用Geometry）：`var geometry = new v3d.Geometry(); geometry.vertices.push(new v3d.Vector3(-10, 0, 0)); geometry.vertices.push(new v3d.Vector3(0, 10, 0)); geometry.vertices.push(new v3d.Vector3(10, 0, 0));`

请注意，在每对连续的顶点之间绘制线条，但不在第一个和最后一个顶点之间绘制线条（线条未关闭）。

现在我们有两条线和一条材料的点，我们可以将它们组合在一起形成一条线。`var line = new v3d.Line(geometry, material);`

剩下的就是将它添加到场景中并调用渲染。`scene.add(line); renderer.render(scene, camera);`

你现在应该看到一个向上的箭头，由两条蓝线组成。


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.eightest.com/programmers-guide/drawing-lines.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.