cg-vue-splat/dist/cg-vue-splat.umd.js

Vue 3 wrapper component for GaussianSplats3D rendering library

(function(i,a){typeof exports=="object"&&typeof module<"u"?a(exports,require("vue"),require("@mkkellogg/gaussian-splats-3d")):typeof define=="function"&&define.amd?define(["exports","vue","@mkkellogg/gaussian-splats-3d"],a):(i=typeof globalThis<"u"?globalThis:i||self,a(i.CGVueSplat={},i.Vue,i.GaussianSplats3D))})(this,function(i,a,y){"use strict";function h(e){const l=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const o in e)if(o!=="default"){const n=Object.getOwnPropertyDescriptor(e,o);Object.defineProperty(l,o,n.get?n:{enumerable:!0,get:()=>e[o]})}}return l.default=e,Object.freeze(l)}const p=h(y),g=(e,l)=>{const o=e.__vccOpts||e;for(const[n,c]of l)o[n]=c;return o},S={name:"GaussianSplat",props:{src:{type:String,required:!0},position:{type:Array,default:()=>[0,0,0]},rotation:{type:Array,default:()=>[0,0,0,1]},scale:{type:Array,default:()=>[1,1,1]},cameraPosition:{type:Array,default:()=>[0,0,3]},cameraLookAt:{type:Array,default:()=>[0,0,0]},cameraUp:{type:Array,default:()=>[0,-1,0]},fov:{type:Number,default:45},showLoadingUI:{type:Boolean,default:!0},splatAlphaRemovalThreshold:{type:Number,default:5},selfDrivenMode:{type:Boolean,default:!0},gpuAcceleratedSort:{type:Boolean,default:!1},enableSIMDInSort:{type:Boolean,default:!0},sharedMemoryForWorkers:{type:Boolean,default:!1},integerBasedSort:{type:Boolean,default:!0},halfPrecisionCovariancesOnGPU:{type:Boolean,default:!1},antialiased:{type:Boolean,default:!0},dynamicScene:{type:Boolean,default:!1},progressiveLoad:{type:Boolean,default:!0},focusDistance:{type:Number,default:1.2},sphericalHarmonicsDegree:{type:Number,default:0,validator:e=>[0,1,2].includes(e)},maxScreenSpaceSplatSize:{type:Number,default:2048},kernel2DSize:{type:Number,default:.5},autoRotate:{type:Boolean,default:!1},autoRotateSpeed:{type:Number,default:.5},showFps:{type:Boolean,default:!1},responsive:{type:Boolean,default:!0},enableControls:{type:Boolean,default:!0}},emits:["loaded","error"],setup(e,{emit:l}){const o=a.ref(null),n=a.ref(!1),c=a.ref("");let t=null;const m=async()=>{if(!o.value){l("error",new Error("Container not found"));return}n.value=!0,c.value="";try{u(),console.log("Initializing viewer with src:",e.src),console.log("Container dimensions:",o.value.clientWidth,"x",o.value.clientHeight),t=new p.Viewer({rootElement:o.value,cameraUp:e.cameraUp,initialCameraPosition:e.cameraPosition,initialCameraLookAt:e.cameraLookAt,fov:e.fov,selfDrivenMode:e.selfDrivenMode,gpuAcceleratedSort:e.gpuAcceleratedSort,sharedMemoryForWorkers:e.sharedMemoryForWorkers,enableSIMDInSort:e.enableSIMDInSort,integerBasedSort:e.integerBasedSort,halfPrecisionCovariancesOnGPU:e.halfPrecisionCovariancesOnGPU,antialiased:e.antialiased,dynamicScene:e.dynamicScene,focalAdjustment:e.focusDistance,sphericalHarmonicsDegree:e.sphericalHarmonicsDegree,kernel2DSize:e.kernel2DSize,maxScreenSpaceSplatSize:e.maxScreenSpaceSplatSize,autoRotate:e.autoRotate,autoRotateSpeed:e.autoRotateSpeed,showFps:e.showFps,responsive:e.responsive,controls:e.enableControls}),t.threeRenderer&&t.threeRenderer.domElement&&(t.threeRenderer.domElement.style.width="100%",t.threeRenderer.domElement.style.height="100%",t.threeRenderer.domElement.style.display="block"),console.log("Loading splat file:",e.src);const r=e.src;await t.addSplatScene(r,{splatAlphaRemovalThreshold:e.splatAlphaRemovalThreshold,showLoadingUI:e.showLoadingUI,position:e.position,rotation:e.rotation,scale:e.scale,progressiveLoad:e.progressiveLoad}),console.log("Starting viewer"),t.start(),console.log("Viewer started successfully"),setTimeout(()=>{o.value&&o.value.isConnected&&(l("loaded"),n.value=!1)},100)}catch(r){console.error("Error initializing GaussianSplats3D viewer:",r),c.value=`Error: ${r.message}`,u(),l("error",r),n.value=!1}},u=()=>{if(t){try{t.dispose?t.dispose():t.stop&&t.stop()}catch(r){console.warn("Error disposing viewer:",r)}t=null}};let d=null;return a.onMounted(()=>{console.log("Component mounted, initializing viewer"),setTimeout(m,300),d=new ResizeObserver(()=>{if(t&&t.threeRenderer){const r=o.value.clientWidth,s=o.value.clientHeight;t.setSize(r,s)}}),o.value&&d.observe(o.value)}),a.onBeforeUnmount(()=>{d&&(d.disconnect(),d=null),u()}),a.watch(()=>e.src,r=>{console.log("src changed to:",r),setTimeout(m,300)}),a.watch(()=>e.position,r=>{try{t&&t.splatMesh&&t.splatMesh.position.fromArray(r)}catch(s){console.error("Error updating position:",s)}},{deep:!0}),a.watch(()=>e.rotation,r=>{try{t&&t.splatMesh&&t.splatMesh.quaternion.fromArray(r)}catch(s){console.error("Error updating rotation:",s)}},{deep:!0}),a.watch(()=>e.scale,r=>{try{t&&t.splatMesh&&t.splatMesh.scale.fromArray(r)}catch(s){console.error("Error updating scale:",s)}},{deep:!0}),{containerWrapper:o,loading:n,errorMsg:c}}},v={ref:"containerWrapper",class:"gaussian-splat-container"},w={key:0,class:"loading-overlay"},k={key:1,class:"error-overlay"};function B(e,l,o,n,c,t){return a.openBlock(),a.createElementBlock("div",v,[n.loading?(a.openBlock(),a.createElementBlock("div",w,"Loading splat...")):a.createCommentVNode("",!0),n.errorMsg?(a.openBlock(),a.createElementBlock("div",k,a.toDisplayString(n.errorMsg),1)):a.createCommentVNode("",!0)],512)}const f=g(S,[["render",B],["__scopeId","data-v-78c67811"]]),b={install:e=>{e.component("GaussianSplat",f)}};i.GaussianSplat=f,i.default=b,Object.defineProperties(i,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});