# \#lines

**URL:** https://discourse.threejs.org/tag/lines/383.md

[Latest](https://discourse.threejs.org/latest.md) · [Categories](https://discourse.threejs.org/categories.md) · [Tags](https://discourse.threejs.org/tags.md)

---

## [WebGPU Line2 artifacts when antialias is true](https://discourse.threejs.org/t/webgpu-line2-artifacts-when-antialias-is-true/91645)

<div class="topic-metadata">

**Author:** [@rndmguy-91](https://discourse.threejs.org/u/rndmguy-91)\
**Replies:** 2\
**Last updated:** [May 18, 2026, 9:00am UTC](https://discourse.threejs.org/t/webgpu-line2-artifacts-when-antialias-is-true/91645 "2026-05-18T09:00:26Z")

</div>

Hello guys, i am working on an a migration to webgpu at the moment. I have an issue with the Line2. Using WebGPU with active antialias creates artifacts on the caps of the lines: https://codesandbox.io/p/sandbox/thr…

---

## [CocktailJS \[projected vectors\]](https://discourse.threejs.org/t/cocktailjs-projected-vectors/83479)

<div class="topic-metadata">

**Author:** [@prisoner849](https://discourse.threejs.org/u/prisoner849)\
**Replies:** 1\
**Last updated:** [June 3, 2025, 7:48am UTC](https://discourse.threejs.org/t/cocktailjs-projected-vectors/83479 "2025-06-03T07:48:21Z")

</div>

Hi community! Picture: Demo:https://codepen.io/prisoner849/full/wBaMvMB When you’ve got a screen, a bunch of vertices, and a projection matrix, what would you do with all this stuff? My idea is to draw SDF 2D-line…

---

## [Measuring Distance Between Two Points in R3F/Three.js – Ready-Made Tools or Custom Implementation?](https://discourse.threejs.org/t/measuring-distance-between-two-points-in-r3f-three-js-ready-made-tools-or-custom-implementation/80120)

<div class="topic-metadata">

**Author:** [@Oleksandr-Fedorov](https://discourse.threejs.org/u/Oleksandr-Fedorov)\
**Replies:** 5\
**Last updated:** [March 26, 2025, 12:17am UTC](https://discourse.threejs.org/t/measuring-distance-between-two-points-in-r3f-three-js-ready-made-tools-or-custom-implementation/80120 "2025-03-26T00:17:00Z")

</div>

Hi all, I’ve been researching similar discussions about measuring distances in 3D scenes using Three.js and React Three Fiber (R3F).It’s similar to This question however, my current requirement is a bit more simple. My…

---

## [Line Positioning issue](https://discourse.threejs.org/t/line-positioning-issue/79515)

<div class="topic-metadata">

**Author:** [@Mohmmad\_Ali](https://discourse.threejs.org/u/Mohmmad_Ali)\
**Replies:** 1\
**Last updated:** [March 15, 2025, 11:11am UTC](https://discourse.threejs.org/t/line-positioning-issue/79515 "2025-03-15T11:11:10Z")

</div>

Hey guys, need a little help here! I am using react-three-fiber and react-three-drei to build an undirected graph in a spherical shape. Nodes (Element.tsx) → Represented as circles Clusters (Blob.tsx) → Larger circles…

---

## [Adding shapes to lines](https://discourse.threejs.org/t/adding-shapes-to-lines/74310)

<div class="topic-metadata">

**Author:** [@user123](https://discourse.threejs.org/u/user123)\
**Replies:** 5\
**Last updated:** [November 24, 2024, 11:13am UTC](https://discourse.threejs.org/t/adding-shapes-to-lines/74310 "2024-11-24T11:13:35Z")

</div>

I am looking for some guidance on the best way to create lines which include additional shapes, like this… My end goal is to have a simple function whereby I specify a start and end point and it works out how many ev…

---

## [Line Geometry back then and now](https://discourse.threejs.org/t/line-geometry-back-then-and-now/72625)

<div class="topic-metadata">

**Author:** [@blackInk](https://discourse.threejs.org/u/blackInk)\
**Replies:** 0\
**Last updated:** [October 10, 2024, 10:54am UTC](https://discourse.threejs.org/t/line-geometry-back-then-and-now/72625 "2024-10-10T10:54:11Z")

</div>

Hi, I found a code snippet distributing lines around a sphere. Unlucky me, it is written “so much past” newer versions so → Geometry and line generation is outdated. Can anyone help me to understand and update: var…

---

## [Connecting points with a line on the surface of a model](https://discourse.threejs.org/t/connecting-points-with-a-line-on-the-surface-of-a-model/71221)

<div class="topic-metadata">

**Author:** [@Amit\_Kumar\_kumawat](https://discourse.threejs.org/u/Amit_Kumar_kumawat)\
**Replies:** 0\
**Last updated:** [September 26, 2024, 5:12am UTC](https://discourse.threejs.org/t/connecting-points-with-a-line-on-the-surface-of-a-model/71221 "2024-09-26T05:12:39Z")

</div>

I am working with a mtlLoader to render a model, I wanted to create points on the model’s surface with user selection and I have successfully achieved this. But, when I am trying to join those points on the surface of th…

---

## [Filling the cut section made with Three-mesh-bvh](https://discourse.threejs.org/t/filling-the-cut-section-made-with-three-mesh-bvh/69458)

<div class="topic-metadata">

**Author:** [@Dronius](https://discourse.threejs.org/u/Dronius)\
**Replies:** 0\
**Last updated:** [August 19, 2024, 9:41am UTC](https://discourse.threejs.org/t/filling-the-cut-section-made-with-three-mesh-bvh/69458 "2024-08-19T09:41:16Z")

</div>

Hello, I have a thing I want to create and would appreciate any recommendations on how to go about it, maybe even @gkjohnson would have some input. So basically, I took the code from this example - \[fervent-frost-fb3id …

---

## [Rendering large number of fat lines with segments](https://discourse.threejs.org/t/rendering-large-number-of-fat-lines-with-segments/68997)

<div class="topic-metadata">

**Author:** [@Bhaskar\_Aggarwal](https://discourse.threejs.org/u/Bhaskar_Aggarwal)\
**Replies:** 0\
**Last updated:** [August 6, 2024, 6:35am UTC](https://discourse.threejs.org/t/rendering-large-number-of-fat-lines-with-segments/68997 "2024-08-06T06:35:47Z")

</div>

I need to render a large number of lines with segments and Raycaster should be able to identify the line.

---

## [Create Grouting from GLSL shaders / draw line around the texture image](https://discourse.threejs.org/t/create-grouting-from-glsl-shaders-draw-line-around-the-texture-image/67506)

<div class="topic-metadata">

**Author:** [@Vatsal\_Pandya](https://discourse.threejs.org/u/Vatsal_Pandya)\
**Replies:** 1\
**Last updated:** [June 30, 2024, 6:36pm UTC](https://discourse.threejs.org/t/create-grouting-from-glsl-shaders-draw-line-around-the-texture-image/67506 "2024-06-30T18:36:38Z")

</div>

I am creating the grouts around the image texture before repeating it. in this way if color or thickness needs to changed of grout then also I have to create textures again and repeat them. now trying to find a way by w…

---

## [setDrawRange on THREE.Line2](https://discourse.threejs.org/t/setdrawrange-on-three-line2/2891)

<div class="topic-metadata">

**Author:** [@weiserhei](https://discourse.threejs.org/u/weiserhei)\
**Replies:** 3\
**Last updated:** [June 24, 2024, 8:11pm UTC](https://discourse.threejs.org/t/setdrawrange-on-three-line2/2891 "2024-06-24T20:11:09Z")

</div>

Hello, I am animating a line step by step using the setDrawRange-Solution from West Langley as described here: https://stackoverflow.com/questions/31399856/drawing-a-line-with-three-js-dynamically/31411794#31411794 Now…

---

## [Line glitches when clipping the edges in the y plane](https://discourse.threejs.org/t/line-glitches-when-clipping-the-edges-in-the-y-plane/67058)

<div class="topic-metadata">

**Author:** [@Fizzy](https://discourse.threejs.org/u/Fizzy)\
**Replies:** 2\
**Last updated:** [June 20, 2024, 2:30pm UTC](https://discourse.threejs.org/t/line-glitches-when-clipping-the-edges-in-the-y-plane/67058 "2024-06-20T14:30:55Z")

</div>

Hey guys I have another issue, I am trying to get the lines in the clipping plane to show vividly but it keeps giving me a glitched/dashed lines for the drawing. Here is what it looks like: This is what it is suppose…

---

## [Threejs: Parallel lines](https://discourse.threejs.org/t/threejs-parallel-lines/40509)

<div class="topic-metadata">

**Author:** [@ennemli](https://discourse.threejs.org/u/ennemli)\
**Replies:** 8\
**Last updated:** [April 1, 2024, 6:10am UTC](https://discourse.threejs.org/t/threejs-parallel-lines/40509 "2024-04-01T06:10:19Z")

</div>

How can I create vertical parallel lines in Threejs?

---

## [Three MeshLine Clipping Support](https://discourse.threejs.org/t/three-meshline-clipping-support/63095)

<div class="topic-metadata">

**Author:** [@Generallee](https://discourse.threejs.org/u/Generallee)\
**Replies:** 3\
**Last updated:** [March 22, 2024, 1:54pm UTC](https://discourse.threejs.org/t/three-meshline-clipping-support/63095 "2024-03-22T13:54:36Z")

</div>

I am using the three.meshline package I’m trying to set clipping planes on the MeshLineMaterial. There is an open ticket here: Support for clipping planes · Issue #33 · spite/THREE.MeshLine · GitHub. I tried adding that…

---

## [Turning GLTF Model into Dashed Line](https://discourse.threejs.org/t/turning-gltf-model-into-dashed-line/30870)

<div class="topic-metadata">

**Author:** [@zaryavtre](https://discourse.threejs.org/u/zaryavtre)\
**Replies:** 4\
**Last updated:** [March 5, 2024, 2:56pm UTC](https://discourse.threejs.org/t/turning-gltf-model-into-dashed-line/30870 "2024-03-05T14:56:45Z")

</div>

Hey guys, I have done a simple model in blender and exported on the GLTF format for easy import. It loads flawlessly, Now I was wondering what is the best way (or if its possible in any way) to turn that model into s…

---

## [How do you express it with connected lines?](https://discourse.threejs.org/t/how-do-you-express-it-with-connected-lines/62273)

<div class="topic-metadata">

**Author:** [@light.respect](https://discourse.threejs.org/u/light.respect)\
**Replies:** 0\
**Last updated:** [March 5, 2024, 12:58am UTC](https://discourse.threejs.org/t/how-do-you-express-it-with-connected-lines/62273 "2024-03-05T00:58:05Z")

</div>

\<!DOCTYPE html\> \<html lang="en"\> \<head\> \<title\>three.js webgl - animation - groups\</title\> \<meta charset="utf-8"\> \<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-sca…

---

## [How do I draw straight lines that look good on camera?](https://discourse.threejs.org/t/how-do-i-draw-straight-lines-that-look-good-on-camera/61960)

<div class="topic-metadata">

**Author:** [@light.respect](https://discourse.threejs.org/u/light.respect)\
**Replies:** 3\
**Last updated:** [February 29, 2024, 4:05am UTC](https://discourse.threejs.org/t/how-do-i-draw-straight-lines-that-look-good-on-camera/61960 "2024-02-29T04:05:58Z")

</div>

\<!DOCTYPE html\> \<html lang="en"\> \<head\> \<title\>three.js webgl - animation - groups\</title\> \<meta charset="utf-8"\> \<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-sca…

---

## [WireframeGeometry2 & LineMaterial - Remove diagonal lines on box](https://discourse.threejs.org/t/wireframegeometry2-linematerial-remove-diagonal-lines-on-box/61746)

<div class="topic-metadata">

**Author:** [@FuzzyWobble](https://discourse.threejs.org/u/FuzzyWobble)\
**Replies:** 2\
**Last updated:** [February 22, 2024, 4:24pm UTC](https://discourse.threejs.org/t/wireframegeometry2-linematerial-remove-diagonal-lines-on-box/61746 "2024-02-22T16:24:18Z")

</div>

How do I remove these ugly diagonal lines? I need the lines to have thickness so I can’t use edgegeometry. Here is my code: var geo3 = new THREE.BoxGeometry( 1,1,1 ); var geometry3 = new WireframeGeometry2( geo3…

---

## [Lines and MeshLines Jitter in big scene however CylinderGeometry does not, why?](https://discourse.threejs.org/t/lines-and-meshlines-jitter-in-big-scene-however-cylindergeometry-does-not-why/59901)

<div class="topic-metadata">

**Author:** [@BrentBuffham](https://discourse.threejs.org/u/BrentBuffham)\
**Replies:** 5\
**Last updated:** [January 4, 2024, 1:48pm UTC](https://discourse.threejs.org/t/lines-and-meshlines-jitter-in-big-scene-however-cylindergeometry-does-not-why/59901 "2024-01-04T13:48:00Z")

</div>

Hello, Threejs community, I have a blast design CAD like application that I am migrating to three.js, the original intent was to draw the blast holes as varying symbols (Cross, Circle, Diamond, etc.) however when the sc…

---

## [Dash pattern on disconnected fat lines](https://discourse.threejs.org/t/dash-pattern-on-disconnected-fat-lines/57394)

<div class="topic-metadata">

**Author:** [@StreXiX](https://discourse.threejs.org/u/StreXiX)\
**Replies:** 2\
**Last updated:** [October 26, 2023, 8:26am UTC](https://discourse.threejs.org/t/dash-pattern-on-disconnected-fat-lines/57394 "2023-10-26T08:26:32Z")

</div>

Hello everyone! What I’m trying to do is render multiple dashed disconnected lines from a dataset. The dataset its basically a list of line objects that have different number of x,y,z points, different width and differen…

---

## [Connect all points with lines](https://discourse.threejs.org/t/connect-all-points-with-lines/10188)

<div class="topic-metadata">

**Author:** [@Alain\_Barrios](https://discourse.threejs.org/u/Alain_Barrios)\
**Replies:** 3\
**Last updated:** [October 14, 2019, 8:29am UTC](https://discourse.threejs.org/t/connect-all-points-with-lines/10188 "2019-10-14T08:29:04Z")

</div>

How do I make all the particles have lines connecting like this pen https://codepen.io/AlainBarrios/full/MzKjrO This is what I have at the moment https://codepen.io/AlainBarrios/pen/qzejoJ?editors=0010

---

## [Draw Line always on top of transparent sprites](https://discourse.threejs.org/t/draw-line-always-on-top-of-transparent-sprites/55807)

<div class="topic-metadata">

**Author:** [@mahadi](https://discourse.threejs.org/u/mahadi)\
**Replies:** 3\
**Last updated:** [September 8, 2023, 9:05pm UTC](https://discourse.threejs.org/t/draw-line-always-on-top-of-transparent-sprites/55807 "2023-09-08T21:05:47Z")

</div>

I have two sprite object and one Line object. I want the line always on top of the sprites no matter what. I set render order to sprites 0, and 1 respectively. And renderOrder to Line as 3. I also set depthTest false …

---

## [React-three-drei Overlap \<Line\> component vertice point with Html without affecting the prespective of the scene](https://discourse.threejs.org/t/react-three-drei-overlap-line-component-vertice-point-with-html-without-affecting-the-prespective-of-the-scene/55733)

<div class="topic-metadata">

**Author:** [@SrMarcius](https://discourse.threejs.org/u/SrMarcius)\
**Replies:** 3\
**Last updated:** [September 7, 2023, 9:46am UTC](https://discourse.threejs.org/t/react-three-drei-overlap-line-component-vertice-point-with-html-without-affecting-the-prespective-of-the-scene/55733 "2023-09-07T09:46:31Z")

</div>

Hi, im fairly new to threejs and react-three and im working on a project that consists of various points in a scene conected by a line, these points have the Html react three drei component. My objective is to prevent t…

---

## [Calibrated Scale (fade out)](https://discourse.threejs.org/t/calibrated-scale-fade-out/36898)

<div class="topic-metadata">

**Author:** [@prisoner849](https://discourse.threejs.org/u/prisoner849)\
**Replies:** 10\
**Last updated:** [September 4, 2023, 8:49pm UTC](https://discourse.threejs.org/t/calibrated-scale-fade-out/36898 "2023-09-04T20:49:46Z")

</div>

Hi community! Picture: Demo: https://codepen.io/prisoner849/full/PoEQPWR An attempt to build a calibrated scale around an object, that fades out with depth relative to the object.

---

## [Whats the correct way to use lines and points in threejs Webgpu](https://discourse.threejs.org/t/whats-the-correct-way-to-use-lines-and-points-in-threejs-webgpu/54953)

<div class="topic-metadata">

**Author:** [@anil\_simon](https://discourse.threejs.org/u/anil_simon)\
**Replies:** 0\
**Last updated:** [August 15, 2023, 5:08am UTC](https://discourse.threejs.org/t/whats-the-correct-way-to-use-lines-and-points-in-threejs-webgpu/54953 "2023-08-15T05:08:19Z")

</div>

I am trying to use line and points in webgpu. However the normal syntax isn’t cutting it. I know for a fact that the syntax is different because i came on to it but now i cant find it anymore. the normal syntax i use is …

---

## [Lines disappear when conditionally rendering multiple views; resizing window brings them back](https://discourse.threejs.org/t/lines-disappear-when-conditionally-rendering-multiple-views-resizing-window-brings-them-back/54065)

<div class="topic-metadata">

**Author:** [@Panda](https://discourse.threejs.org/u/Panda)\
**Replies:** 1\
**Last updated:** [July 19, 2023, 9:26pm UTC](https://discourse.threejs.org/t/lines-disappear-when-conditionally-rendering-multiple-views-resizing-window-brings-them-back/54065 "2023-07-19T21:26:32Z")

</div>

Here’s the codesandbox for reproduction. Steps to reproduce: Observe the visible line in the first view Click the “Change View” button Observe the missing line in the second view (line is present in the code) Resize t…

---

## [Keeping LineBasicMaterial in the same width regardless of camera position](https://discourse.threejs.org/t/keeping-linebasicmaterial-in-the-same-width-regardless-of-camera-position/18658)

<div class="topic-metadata">

**Author:** [@nitzanorchestra](https://discourse.threejs.org/u/nitzanorchestra)\
**Replies:** 12\
**Last updated:** [May 19, 2023, 8:23am UTC](https://discourse.threejs.org/t/keeping-linebasicmaterial-in-the-same-width-regardless-of-camera-position/18658 "2023-05-19T08:23:38Z")

</div>

I want to have a constant line-width regardless of camera distance in LineBasicMaterial, is there an option to do that? Because I see in the documentation there is a limitation regarding that. Due to limitations of th…

---

## [Line2 create width line but get white space](https://discourse.threejs.org/t/line2-create-width-line-but-get-white-space/50677)

<div class="topic-metadata">

**Author:** [@NJimmi](https://discourse.threejs.org/u/NJimmi)\
**Replies:** 1\
**Last updated:** [April 21, 2023, 8:23am UTC](https://discourse.threejs.org/t/line2-create-width-line-but-get-white-space/50677 "2023-04-21T08:23:43Z")

</div>

As the show img, when i create a ellipse by the line2, the will get the white space. but i use the same code in three example. it will not show.

---

## [Fading effect (points, lines)](https://discourse.threejs.org/t/fading-effect-points-lines/49241)

<div class="topic-metadata">

**Author:** [@prisoner849](https://discourse.threejs.org/u/prisoner849)\
**Replies:** 2\
**Last updated:** [March 18, 2023, 6:11pm UTC](https://discourse.threejs.org/t/fading-effect-points-lines/49241 "2023-03-18T18:11:36Z")

</div>

Hi community! Picture: Demo: https://codepen.io/prisoner849/full/xxazGZa An attempt to create a fading effect for lines and points around a sphere. PS Other options/solutions are very welcomed :slight\_smile:

---

## [Binding 2 wood logs like scouts](https://discourse.threejs.org/t/binding-2-wood-logs-like-scouts/47138)

<div class="topic-metadata">

**Author:** [@Pop\_John](https://discourse.threejs.org/u/Pop_John)\
**Replies:** 6\
**Last updated:** [January 29, 2023, 9:07am UTC](https://discourse.threejs.org/t/binding-2-wood-logs-like-scouts/47138 "2023-01-29T09:07:32Z")

</div>

Hi, I’m trying to build a simplified CAD where you can tie 2 wood logs as the scouts do (with square lash) and I’m stuck. How can I programatically “tie” 2 cylinders in the scene? I’m thinking that I need to detect …

[Next page](https://discourse.threejs.org/tag/lines/383.md?match_all_tags=true&page=1&tags%5B%5D=lines)