Examples
EPT Streaming
Entwine Point Tile (EPT) is a directory-based format for serving large point clouds over HTTP. Points stream dynamically based on your viewport, enabling visualization of datasets with billions of points.
Installation
$ npx shadcn-vue@latest add https://mapcn-vue.geoql.in/r/map-control-lidarUsage
<script setup lang="ts">
import { VMap, VControlNavigation } from '@geoql/v-maplibre';
import { VControlLidar } from '@geoql/v-maplibre/lidar';
import 'maplibre-gl-lidar/style.css';
const mapOptions = {
style: 'https://basemaps.cartocdn.com/gl/dark-matter-gl-style/style.json',
center: [-6.26, 53.34], // Dublin, Ireland
zoom: 14,
pitch: 60,
maxPitch: 85,
};
const lidarOptions = {
collapsed: false,
pointSize: 2,
colorScheme: 'elevation',
pickable: true,
autoZoom: true,
streamingPointBudget: 5_000_000, // 5 million points max
};
// Dublin EPT dataset from Entwine
const eptUrl = 'https://na-c.entwine.io/dublin/ept.json';
</script>
<template>
<VMap :options="mapOptions" class="h-125 w-full">
<VControlNavigation position="top-right" />
<VControlLidar
position="top-right"
:options="lidarOptions"
:default-url="eptUrl"
@load="(info) => console.log('Loaded:', info)"
@streamingprogress="(p) => console.log('Progress:', p)"
/>
</VMap>
</template> Components 3
<VMap />@geoql/v-maplibre<VControlNavigation />@geoql/v-maplibre<VControlLidar />@geoql/v-maplibre/lidar