1. Core Components
  2. LineSegments

Core Components

LineSegments

Draw lines using THREE.LineSegments.

Import

Source

GitHub View Source Code

Example

<script lang="ts">
  import { EdgesGeometry, LineBasicMaterial, OctahedronBufferGeometry } from 'three'
  import { LineSegments } from 'threlte'

  const geometry = new EdgesGeometry(new OctahedronBufferGeometry(1, 1), 30)
</script>

<LineSegments {geometry} material={new LineBasicMaterial()} />

Properties

// required
material: THREE.Material | THREE.Material[]
geometry: THREE.BufferGeometry

// optional
position: Position | undefined = undefined
scale: Scale | undefined = undefined
rotation: Rotation | undefined = undefined
lookAt: LookAt | undefined = undefined
viewportAware: boolean = false
castShadow: boolean | undefined = undefined
receiveShadow: boolean | undefined = undefined
frustumCulled: boolean | undefined = undefined
renderOrder: number | undefined = undefined
visible: boolean | undefined = undefined
interactive: boolean = false
ignorePointer: boolean = false

Bindings

inViewport: boolean
lineSegments: THREE.LineSegments

Events

viewportenter: undefined
viewportleave: undefined
click: CustomEvent<ThreltePointerEvent>
contextmenu: CustomEvent<ThreltePointerEvent>
pointerup: CustomEvent<ThreltePointerEvent>
pointerdown: CustomEvent<ThreltePointerEvent>
pointerenter: CustomEvent<ThreltePointerEvent>
pointerleave: CustomEvent<ThreltePointerEvent>
pointermove: CustomEvent<ThreltePointerEvent>