Link Search Menu Expand Document

You are browsing the documentation for v0.x.
Visit here for the newest version.

VglGeometry

This is the base mixin component for all geometry components, corresponding THREE.Geometry. This can also be used directly for building custom geometries.

props

  • name name (required)

    Name of the component.

  • position-attribute floatArray (optional)

    The x, y, and z coordinates of each vertex in this geometry.

  • color-attribute floatArray (optional)

    The red, green, and blue channels of vertex color of each vertex in this geometry.

  • normal-attribute floatArray (optional)

    The x, y, and z components of the vertex normal vector of each vertex in this geometry.

computed properties

  • inst

    The THREE.BufferGeometry instance.

methods

  • update()

    Emit an event in geometries namespace. Call this method after editing instance’s properties.

Example

<template>
  <div>
    <vgl-renderer
      antialias
      camera="camera"
      scene="scene"
    >
      <vgl-scene name="scene">
        <vgl-geometry
          name="vertices"
          position-attribute="-5, 0, 0, 5, 0, 0, 5, 5, 0, -5, 5, 0, -5, 4, 0, 4, 4, 0, 4, 1, 0, -5,
                              1, 0"
          color-attribute="1, 1, 1, 0, 0, 0, 1, 0, 0, 1, 1, 1, 0, 1, 0, 0, 0, 0, 0, 0, 1, 1, 1, 1"
        />
        <vgl-line-basic-material
          name="line"
          linewidth="2"
          vertex-colors="vertex"
        />
        <vgl-line-loop
          geometry="vertices"
          material="line"
        />
        <vgl-line-loop
          geometry="vertices"
          material="line"
          rotation="0 -1.5708 0 XYZ"
        />
      </vgl-scene>
      <vgl-perspective-camera
        orbit-position="20 0.8 0.7"
        name="camera"
      />
    </vgl-renderer>
  </div>
</template>