Examples
Gaussian Splat Layer
Render a georeferenced Gaussian splat scene (.ply / .spz / .splat / .ksplat / .sog) on the map. A converted outward-facing 3DGS capture (CC0, steam-studio.jp) anchored near Tokyo Tower, rendered by Spark with LOD streaming inside a shared three.js scene.
Usage
<script setup lang="ts">
import { VMap, VControlNavigation } from '@geoql/v-maplibre';
import { VLayerSplat } from '@geoql/v-maplibre/splat';
// Peers: pnpm add three @sparkjsdev/spark @dvt3d/maplibre-three-plugin
const mapOptions = {
style: 'https://basemaps.cartocdn.com/gl/positron-gl-style/style.json',
center: [139.7454, 35.6586],
zoom: 20.5,
pitch: 62,
maxPitch: 85,
maxZoom: 23,
};
</script>
<template>
<VMap :options="mapOptions" class="h-125 w-full">
<VControlNavigation position="top-right" />
<VLayerSplat
id="cactus-splat"
url="https://your-bucket.example.com/scene.spz"
:longitude="139.7454"
:latitude="35.6586"
:altitude="1"
:rotation="[-90, 0, 0]"
:lod="true"
@load="onLoad"
@progress="onProgress"
/>
</VMap>
</template> Components 3
<VMap />@geoql/v-maplibre<VControlNavigation />@geoql/v-maplibre<VLayerSplat />@geoql/v-maplibre/splat
Loading splat… 0%