@threlte/extras
<SVG>
Renders an SVG using Three.js’ SVGLoader.
<script lang="ts">
import { NoToneMapping } from 'three'
import { Canvas } from '@threlte/core'
import Scene from './Scene.svelte'
import { Pane, Slider, Text } from 'svelte-tweakpane-ui'
</script>
<div>
<Canvas toneMapping={NoToneMapping}>
<Scene />
</Canvas>
</div>
<style>
div {
height: 100%;
}
</style><script lang="ts">
import { T } from '@threlte/core'
import { SVG, Grid, OrbitControls } from '@threlte/extras'
</script>
<T.PerspectiveCamera
makeDefault
position.z={5}
position.y={1}
>
<OrbitControls
autoRotate
enablePan={false}
enableZoom={false}
/>
</T.PerspectiveCamera>
<SVG
src="/icons/svelte.svg"
scale={0.005}
position.x={-1.2}
position.y={1.5}
/>Examples
Basic Example
Scene.svelte
<script lang="ts">
import { T } from '@threlte/core'
import { SVG } from '@threlte/extras'
</script>
<SVG
src="/icons/svelte.svg"
scale={0.005}
position.x={-1.2}
position.y={1.5}
/>