Smoke

<Smoke /> is a component that renders a smoke in your scene. It is an abstraction that use a combination of textures, transparency and some calculation, to create a beautiful smoke - cloud - fog effect

Usage

WARNING

Smoke componente comes with a default texture abstraction it needs to be wrapped by a Suspense component

You can use <Smoke /> component without passing any props, but still if you want you can tweak the props to find the best setup for you

<template>
  <TresCanvas>
    ...
    <Suspense>
      <Smoke />
    </Suspense>
    ...
  </TresCanvas>
</template>

Notice that you can pass a texture in combination with props, to personalize your effect

<template>
  <TresCanvas>
    ...
    <Suspense>
      <Smoke
        :speed="0.8"
        :segments="12"
        texture="my_texture_path"
        :color="#f7f"
      />
    </Suspense>
    ...
  </TresCanvas>
</template>

Props

Name	Type	Description	Default	Required
color	TresColor	The color of the smoke.	'#ffffff'	No
opacity	number	The strength of the opacity.	0.5	No
speed	number	The rotation speed of the smoke.	0.4	No
width	number	The base width.	10	No
depth	number	The base depth.	1.5	No
segments	number	The number of smoke to render.	20	No
texture	string	The texture of the smoke.	default component texture	No
depthTest	boolean	The depthTest.	true	No