Skip to content

Instantly share code, notes, and snippets.

@ngarske
Last active Aug 12, 2022
Embed
What would you like to do?
Let's make some 3D in Svelte (Part 1)
<script lang="ts">
import { Canvas } from "@threlte/core";
import Scene from "./Scene.svelte";
</script>
<div>
<Canvas size={{ width: 1280, height: 720 }}>
<Scene />
</Canvas>
</div>
<style>
div {
height: 100%;
width: 100%;
}
</style>
<script lang="ts">
import {
MeshStandardMaterial,
DoubleSide,
BoxBufferGeometry,
} from "three";
import {
DirectionalLight,
Mesh,
OrbitControls,
PerspectiveCamera,
} from "@threlte/core";
</script>
<PerspectiveCamera position={{ x: 30, y: 10, z: 5 }} fov={24}>
<OrbitControls
target={{ y: 3 }}
/>
</PerspectiveCamera>
<Mesh
geometry={new BoxBufferGeometry(4, 4, 4)}
material={new MeshStandardMaterial({ side: DoubleSide, color: "white" })}
/>
<DirectionalLight position={{ x: 10, y: 10, z: 10 }} />
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment