OlegJakushkin / aframe-gaussian-splatting

A-Frame component implementation of the 3D Gaussian splat viewer

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

aframe-gaussian-splatting-component

This component is an A-Frame implementation of real-time rendering for 3D Gaussian Splatting for Real-Time Radiance Field Rendering.
This code is derived from the WebGL implementation developed by antimatter15.

Demo page

Needs few seconds to load sploats.
https://quadjr.github.io/aframe-gaussian-splatting/

Properties

Property Description Default Value
src url of splat or ply file train.splat

Usage

Browser Installation

Install and use by directly including the file. About the splat file, please refer antimatter15.

<!DOCTYPE html>
<html>
  <head>
    <script src="https://aframe.io/releases/1.4.2/aframe.min.js"></script>
    <script src="https://quadjr.github.io/aframe-gaussian-splatting/index.js"></script>
  </head>
  <body>
    <a-scene renderer="antialias: false" stats>
      <a-entity position="0 1.6 -2.0" animation="property: rotation; to: 0 360 0; dur: 10000; easing: linear; loop: true">
        <a-sphere position="0 0 0.5" radius="0.5" color="#EF2D5E"></a-sphere>
        <a-sphere position="0 0 -0.5" radius="0.5" color="#EF2D5E"></a-sphere>
      </a-entity>
      <a-entity gaussian_splatting="src: https://huggingface.co/cakewalk/splat-data/resolve/main/train.splat;" rotation="0 0 0" position="0 1.5 -2"></a-entity>
    </a-scene>
  </body>
</html>

NPM Installation

Install via NPM:

npm install aframe-gaussian-splatting-component

Then register and use.

require('aframe');
require('aframe-gaussian-splatting-component');

About

A-Frame component implementation of the 3D Gaussian splat viewer

License:MIT License


Languages

Language:JavaScript 96.7%Language:HTML 3.3%