json-render/examples/react-three-fiber-gsplat/app/scenes/splat-with-primitives.ts

import type { Scene } from "./_helpers";

export const splatWithPrimitives: Scene = {
  name: "Splat + Primitives",
  description:
    "A gaussian splat scene composed with standard 3D primitives and lights",
  spec: {
    root: "scene",
    elements: {
      scene: {
        type: "Group",
        props: { position: null, rotation: null, scale: null },
        children: [
          "camera",
          "ambient",
          "sun",
          "splat",
          "logo",
          "label",
          "grid",
          "controls",
        ],
      },
      camera: {
        type: "PerspectiveCamera",
        props: {
          position: [4, 3, 6],
          rotation: null,
          scale: null,
          fov: 50,
          near: null,
          far: null,
          makeDefault: true,
        },
        children: [],
      },
      ambient: {
        type: "AmbientLight",
        props: { color: "#ffffff", intensity: 0.4 },
        children: [],
      },
      sun: {
        type: "DirectionalLight",
        props: {
          position: [8, 10, 5],
          rotation: null,
          scale: null,
          color: "#fff5e0",
          intensity: 2.5,
          castShadow: true,
        },
        children: [],
      },
      splat: {
        type: "GaussianSplat",
        props: {
          src: "https://huggingface.co/datasets/dylanebert/3dgs/resolve/main/garden/garden-7k.splat",
          position: [0, 0, 0],
          rotation: null,
          scale: [1, 1, 1],
          castShadow: null,
          receiveShadow: null,
          alphaHash: null,
          toneMapped: null,
          visible: true,
        },
        children: [],
      },
      logo: {
        type: "Cone",
        props: {
          position: [-0.4, -0.25, 1],
          rotation: [-1.5708, 0, 0],
          scale: null,
          radius: 0.1,
          height: 0.06,
          radialSegments: 3,
          castShadow: true,
          receiveShadow: null,
          material: {
            color: "#ffffff",
            metalness: 0.3,
            roughness: 0.4,
            emissive: null,
            emissiveIntensity: null,
            opacity: null,
            transparent: null,
            wireframe: null,
          },
        },
        children: [],
      },
      grid: {
        type: "GridHelper",
        props: {
          position: [0, -0.49, 0],
          rotation: null,
          scale: null,
          size: 30,
          divisions: 30,
          color: "#333333",
          secondaryColor: "#1a1a1a",
        },
        children: [],
      },
      label: {
        type: "ExtrudedText",
        props: {
          position: [-0.3, -0.28, 1],
          rotation: null,
          scale: null,
          text: "vercel-labs/json-render",
          font: null,
          size: 0.1,
          depth: 0.02,
          curveSegments: null,
          bevelEnabled: false,
          bevelThickness: null,
          bevelSize: null,
          bevelSegments: null,
          centered: false,
          castShadow: true,
          receiveShadow: null,
          material: {
            color: "#ffffff",
            metalness: 1,
            roughness: 0.4,
            emissive: null,
            emissiveIntensity: null,
            opacity: null,
            transparent: null,
            wireframe: null,
          },
        },
        children: [],
      },
      controls: {
        type: "OrbitControls",
        props: {
          enableDamping: true,
          dampingFactor: null,
          enableZoom: null,
          enablePan: null,
          enableRotate: null,
          minDistance: 2,
          maxDistance: 20,
          minPolarAngle: 0.2,
          maxPolarAngle: 1.5,
          autoRotate: true,
          autoRotateSpeed: 0.3,
          target: [0.3, -0.4, 0.4],
        },
        children: [],
      },
    },
  },
};