Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

PointCloudLayer: use view.crs in LasParser (as the other parsers) #2498

Open
wants to merge 11 commits into
base: master
Choose a base branch
from
Open

PointCloudLayer: use view.crs in LasParser (as the other parsers) #2498

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
11 commits
Select commit Hold shift + click to select a range
6f978a1
refactor(PointCloudLayer): move spacing from Source to Layer for homo…
ftoromanoff Apr 30, 2024
c32b7de
refactor(LASLoader): reproj data during parsing
ftoromanoff Jul 12, 2024
60d3f74
feat(PointCloudNode): generate bbox in a referentiel local (view Crs …
ftoromanoff Apr 30, 2024
bef3c66
fix(PtCloudLayer): fix elevation
ftoromanoff Feb 26, 2025
9b290e3
fix(PtCloudLayer): clamp bbox to get distance to camera
ftoromanoff Feb 26, 2025
e60462a
example(COPC): add crs for COPC simple loader
ftoromanoff Feb 6, 2025
1656066
example(entwine3d): add grand Lyon dataSet
ftoromanoff Feb 11, 2025
4e5485c
example(COPC): add new copc 3D loader example
ftoromanoff Feb 6, 2025
51b6ff5
fix(examples): PointCloud Examples
ftoromanoff Feb 26, 2025
d358029
fix(Potree1&2): linked to reprojection
ftoromanoff Feb 27, 2025
712ef25
refactor(LasParser): optimization
ftoromanoff Feb 27, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
143 changes: 143 additions & 0 deletions examples/copc_3d_loader.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,143 @@
<html>
<head>
<title>Itowns - COPC 3D loader</title>

<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="css/example.css">
<link rel="stylesheet" type="text/css" href="css/LoadingScreen.css">

<style type="text/css">
#description {
z-index: 2;
left: 10px;
}
</style>

<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://cdnjs.cloudflare.com/ajax/libs/dat-gui/0.7.6/dat.gui.min.js"></script>
</head>
<body>
<div id="description">Specify the URL of a COPC file to load:
<input type="text" id="copc_url" />
<button onclick="readCopcURL()">Load</button>
<button onclick="loadLidarHD()">Load LiDAR HD dataset</button>
<div id="share"></div>
</div>
<div id="viewerDiv">
</div>

<script src="../dist/itowns.js"></script>
<script src="js/GUI/LoadingScreen.js"></script>
<script src="../dist/debug.js"></script>
<script type="text/javascript">
var debugGui = new dat.GUI();
var viewerDiv = document.getElementById('viewerDiv');

var view = new itowns.GlobeView(viewerDiv);

// Add one imagery layer to the scene and the miniView
// This layer is defined in a json file but it could be defined as a plain js
// object. See Layer* for more info.
itowns.Fetcher.json('./layers/JSONLayers/Ortho.json').then(function _(config) {
config.source = new itowns.WMTSSource(config.source);
var layer = new itowns.ColorLayer('Ortho', config);
view.addLayer(layer);
});
// Add two elevation layers.
// These will deform iTowns globe geometry to represent terrain elevation.
function addElevationLayerFromConfig(config) {
config.source = new itowns.WMTSSource(config.source);
var layer = new itowns.ElevationLayer(config.id, config);
view.addLayer(layer);
}
itowns.Fetcher.json('./layers/JSONLayers/IGN_MNT_HIGHRES.json').then(addElevationLayerFromConfig);
itowns.Fetcher.json('./layers/JSONLayers/WORLD_DTM.json').then(addElevationLayerFromConfig);

var layer;

function onLayerReady() {
var lookAt = layer.root._position;
var coordLookAt = new itowns.Coordinates(view.referenceCrs).setFromVector3(lookAt);

var size = new itowns.THREE.Vector3();
layer.root._bbox.getSize(size);

view.controls.lookAtCoordinate({
coord: coordLookAt,
range: 2 * size.length(),
}, false);
}

function readCopcURL() {
const urlParams = new URL(location.href).searchParams
var url = document.getElementById('copc_url').value || urlParams.get('copc');

if (url) {
const options = {};
urlParams.keys().forEach(key => {
if (key !== 'copc') {
if (key.includes('.')) {
params = key.split('.');
let object = options;
params.forEach((subKey, index) => {
if (!object[subKey]) { object[subKey] = {}; }
if (index === params.length - 1) {
object[subKey] = parseFloat(urlParams.get(key));
}
object = object[subKey];
})
} else {
options[key] = parseFloat(urlParams.get(key));
}

}
});
loadCopc(url, options);

document.getElementById('share').innerHTML = '<a href="' +
location.href.replace(location.search, '?copc=' + url) +
'" target="_blank">Link to share this view</a>';
document.getElementById('copc_url').value = url;
}
}

function loadCopc(url, options) {
const source = new itowns.CopcSource({ url });

if (layer) {
debugGui.removeFolder(layer.debugUI);
view.removeLayer('COPC');
view.notifyChange();
layer.delete();
}

const config = {
source,
crs: view.referenceCrs,
sseThreshold: 2,
pointBudget: 3000000,
...options,
}

layer = new itowns.CopcLayer('COPC', config);

itowns.View.prototype.addLayer.call(view, layer).then(onLayerReady);

layer.whenReady
.then(() => debug.PointCloudDebug.initTools(view, layer, debugGui));
}

function loadLidarHD() {
// const url ="https://storage.sbg.cloud.ovh.net/v1/AUTH_63234f509d6048bca3c9fd7928720ca1/ppk-lidar/ML/LHD_FXX_0746_6509_PTS_C_LAMB93_IGN69.copc.laz"
const url ="https://dl-lidar.ign.fr/ppk-lidar/ML/LHD_FXX_0746_6509_PTS_C_LAMB93_IGN69.copc.laz" //fixed with proxy
const options = {
material: {mode: 2},
opacity: 0.5,
}
loadCopc(url, options);
}

readCopcURL();
</script>
</body>
</html>
54 changes: 29 additions & 25 deletions examples/copc_simple_loader.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
<head>
<meta charset="UTF-8">

<title>Itowns - COPC loader</title>
<title>Itowns - COPC simple loader</title>

<link rel="stylesheet" type="text/css" href="css/example.css">
<link rel="stylesheet" type="text/css" href="css/LoadingScreen.css">
Expand Down Expand Up @@ -35,41 +35,44 @@
<script src="../dist/debug.js"></script>
<script type="text/javascript">
let layer; // COPCLayer
let view;
let control;

const uri = new URL(location);

const gui = new dat.GUI();
const crs = {
'autzen-classified': 'EPSG:2992',
sofi: 'EPSG:32611',
millsite: 'EPSG:6341',
}

const viewerDiv = document.getElementById('viewerDiv');
const view = new itowns.View('EPSG:4326', viewerDiv);
const controls = new itowns.PlanarControls(view);
view.mainLoop.gfxEngine.renderer.setClearColor(0xdddddd);
gui = new dat.GUI();

setUrl(uri.searchParams.get('copc'));
const uri = new URL(location);
setView(uri.searchParams.get('copc'));

function onLayerReady(layer) {
const camera = view.camera.camera3D;

const lookAt = new itowns.THREE.Vector3();
const size = new itowns.THREE.Vector3();
layer.root.bbox.getSize(size);
layer.root.bbox.getCenter(lookAt);
const lookAt = layer.root._position;
lookAt.z = (layer.maxElevationRange + layer.minElevationRange) * 0.5;

camera.far = 2.0 * size.length();
const size = new itowns.THREE.Vector3();
layer.root._bbox.getSize(size);

controls.groundLevel = layer.root.bbox.min.z;
const position = layer.root.bbox.min.clone().add(
size.multiply({ x: 1, y: 1, z: size.x / size.z }),
controls.groundLevel = layer.minElevationRange;
var corner = new itowns.THREE.Vector3(...layer.source.header.min);
var position = corner.clone().add(
size.multiply({ x: 0, y: 0, z: (size.x / size.z) })
);

camera.far = 2.0 * size.length();
camera.position.copy(position);
camera.lookAt(lookAt);
camera.updateProjectionMatrix();

view.notifyChange(camera);
}


function readURL() {
const url = document.getElementById('copc_url').value;

Expand All @@ -88,9 +91,17 @@
history.replaceState(null, null, `?${uri.searchParams.toString()}`);

input_url.value = url;
load(url);
location.reload()
}

function setView(url) {
const copcId = url.split('/').pop().split('.').shift();

view = new itowns.View(crs[copcId], viewerDiv);
controls = new itowns.PlanarControls(view);
view.mainLoop.gfxEngine.renderer.setClearColor(0xdddddd);
load(url);
}

function load(url) {
const options = {};
Expand All @@ -102,13 +113,6 @@
});
const source = new itowns.CopcSource({ url });

if (layer) {
gui.removeFolder(layer.debugUI);
view.removeLayer('COPC');
view.notifyChange();
layer.delete();
}

const config = {
source,
crs: view.referenceCrs,
Expand Down
22 changes: 14 additions & 8 deletions examples/entwine_3d_loader.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,8 +20,8 @@
<div id="description">Specify the URL of a Entwine Point Tree to load:
<input type="text" id="ept_url" />
<button onclick="readEPTURL()">Load</button>
<p>If your dataset is not displaying at the right location,
check that it has been converted in <code>EPSG:4978</code>.</p>
<button onclick="loadGrandLyon()">Load the Grand Lyon
dataset</button>
<div id="share"></div>
</div>
<div id="viewerDiv">
Expand Down Expand Up @@ -57,12 +57,11 @@
var eptLayer, eptSource;

function onLayerReady() {
var lookAt = new itowns.THREE.Vector3();
eptLayer.root.bbox.getCenter(lookAt);
var coordLookAt = new itowns.Coordinates(view.referenceCrs, lookAt);
var lookAt = eptLayer.root._position;
var coordLookAt = new itowns.Coordinates(view.referenceCrs).setFromVector3(lookAt);

var size = new itowns.THREE.Vector3();
eptLayer.root.bbox.getSize(size);
eptLayer.root._bbox.getSize(size);

view.controls.lookAtCoordinate({
coord: coordLookAt,
Expand All @@ -71,7 +70,8 @@
}

function readEPTURL() {
var url = document.getElementById('ept_url').value || new URL(location.href).searchParams.get('ept');
const urlParams = new URL(location.href).searchParams
var url = document.getElementById('ept_url').value || urlParams.get('ept');

if (url) {
loadEPT(url);
Expand Down Expand Up @@ -100,7 +100,13 @@

itowns.View.prototype.addLayer.call(view, eptLayer).then(onLayerReady);

debug.PointCloudDebug.initTools(view, eptLayer, debugGui);
eptLayer.whenReady
.then(() => debug.PointCloudDebug.initTools(view, eptLayer, debugGui));
}

function loadGrandLyon() {
document.getElementById('ept_url').value = 'https://download.data.grandlyon.com/files/grandlyon/imagerie/mnt2018/lidar/ept/';
readEPTURL();
}

readEPTURL();
Expand Down
Loading