Skip to content

Commit 2a22e37

Browse files
JannikBrackJannikBrack
authored
pointcloud 0.1
add pointcloud demo
2 parents ee941b0 + 4d5332e commit 2a22e37

28 files changed

+2097420
-75
lines changed

‎.github/workflows/build_and_deploy.yml‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -40,6 +40,13 @@ jobs:
4040
CI=false yarn build
4141
cd ..
4242
cp -r multi_tab/dist docs-build/multi_tab
43+
- name: Install and build pointcloud🔧
44+
run: |
45+
cd pointcloud
46+
yarn
47+
CI=false yarn build
48+
cd ..
49+
cp -r pointcloud/dist docs-build/pointcloud
4350
- name: copy catalogue metadata
4451
run: |
4552
cp mc_meta.json docs-build/mc_meta.json

‎assets/thumbnails/PointCloudDemoThumbnail.png‎

176 KB
Loading

‎mc_meta.json‎

Lines changed: 100 additions & 75 deletions
Original file line numberDiff line numberDiff line change
@@ -1,79 +1,104 @@
11
{
2-
"AppRunningContest": {
3-
"name": "AppRunningContest",
4-
"title": "Running contest",
5-
"description": "A WebGis application which shows the results of a running contest between members of the different WhereGroup company locations in Germany.",
6-
"i18n": {
7-
"de": {
8-
"title": "Laufwettbewerb",
9-
"description": "Eine WebGis Anwendung die den Laufwettbewerb zwischen Mitarbeitern der verschiedenen WhereGroup Standorte in Deutschland darstellt."
10-
}
11-
},
12-
"tags": [],
13-
"category": "",
14-
"type": "application",
15-
"components": [
16-
"MlTransitionGeoJsonLayer",
17-
"MlGeoJsonLayer",
18-
"MlVectorTileLayer"
19-
],
20-
"thumbnail": "https://mapcomponents.github.io/react-map-components-apps/assets/thumbnails/AppRunningContest.png",
21-
"demos": [
22-
{
23-
"name": "Demo",
24-
"url": "https://mapcomponents.github.io/react-map-components-apps/running_contest/"
25-
}
26-
]
27-
},
28-
"AppWebGis": {
29-
"name": "AppWebGis",
30-
"title": "WebGis",
31-
"description": "An example of a WebGis application with different measure tools, visualizing multiple layers containg various data within north-rhine westphalia",
32-
"i18n": {
33-
"de": {
34-
"title": "WebGis",
35-
"description": "Eine WebGis Anwenung mit Messwerkzeugen, dargestellt werden mehere Layer mit unetrschiedlichen Informationen in NRW"
36-
}
37-
},
38-
"tags": [],
39-
"category": "",
40-
"type": "application",
41-
"components": [
42-
"MlGeoJsonLayer",
43-
"MlIconLayer",
44-
"MlWmsLoader",
45-
"MlNavigationTools"
46-
],
47-
"thumbnail": "https://mapcomponents.github.io/react-map-components-apps/assets/thumbnails/AppWebGis.png",
48-
"demos": [
49-
{
50-
"name": "Demo",
51-
"url": "https://mapcomponents.github.io/react-map-components-apps/webGis/"
52-
}
53-
]
54-
},
55-
"PowerPlantsApp": {
56-
"name": "PowerPlantsApp",
57-
"title": "World Power Plants",
58-
"description": "A WebGis application providing precise Information about various types of energy generation across the whole planet ",
59-
"i18n": {
60-
"de": {
61-
"title": "Energiekraftwerke weltweit",
62-
"description": "Eine WebGis-Anwendung welche Inofrmationen über Energieerzeugung auf der ganzen Welt darstellt"
63-
}
64-
},
65-
"tags": [],
66-
"category": "",
67-
"type": "application",
68-
"components": ["MlGeoJsonLayer", "MlWmsLoader", "MlNavigationTools"],
69-
"thumbnail": "https://mapcomponents.github.io/react-map-components-apps/assets/thumbnails/PowerPlants.png",
70-
"demos": [
71-
{
72-
"name": "Demo",
73-
"url": "https://mapcomponents.github.io/react-map-components-apps/powerplants/"
74-
}
75-
]
76-
},
2+
"AppRunningContest": {
3+
"name": "AppRunningContest",
4+
"title": "Running contest",
5+
"description": "A WebGis application which shows the results of a running contest between members of the different WhereGroup company locations in Germany.",
6+
"i18n": {
7+
"de": {
8+
"title": "Laufwettbewerb",
9+
"description": "Eine WebGis Anwendung die den Laufwettbewerb zwischen Mitarbeitern der verschiedenen WhereGroup Standorte in Deutschland darstellt."
10+
}
11+
},
12+
"tags": [],
13+
"category": "",
14+
"type": "application",
15+
"components": [
16+
"MlTransitionGeoJsonLayer",
17+
"MlGeoJsonLayer",
18+
"MlVectorTileLayer"
19+
],
20+
"thumbnail": "https://mapcomponents.github.io/react-map-components-apps/assets/thumbnails/AppRunningContest.png",
21+
"demos": [
22+
{
23+
"name": "Demo",
24+
"url": "https://mapcomponents.github.io/react-map-components-apps/running_contest/"
25+
}
26+
]
27+
},
28+
"AppWebGis": {
29+
"name": "AppWebGis",
30+
"title": "WebGis",
31+
"description": "An example of a WebGis application with different measure tools, visualizing multiple layers containg various data within north-rhine westphalia",
32+
"i18n": {
33+
"de": {
34+
"title": "WebGis",
35+
"description": "Eine WebGis Anwenung mit Messwerkzeugen, dargestellt werden mehere Layer mit unetrschiedlichen Informationen in NRW"
36+
}
37+
},
38+
"tags": [],
39+
"category": "",
40+
"type": "application",
41+
"components": [
42+
"MlGeoJsonLayer",
43+
"MlIconLayer",
44+
"MlWmsLoader",
45+
"MlNavigationTools"
46+
],
47+
"thumbnail": "https://mapcomponents.github.io/react-map-components-apps/assets/thumbnails/AppWebGis.png",
48+
"demos": [
49+
{
50+
"name": "Demo",
51+
"url": "https://mapcomponents.github.io/react-map-components-apps/webGis/"
52+
}
53+
]
54+
},
55+
"PowerPlantsApp": {
56+
"name": "PowerPlantsApp",
57+
"title": "World Power Plants",
58+
"description": "A WebGis application providing precise Information about various types of energy generation across the whole planet ",
59+
"i18n": {
60+
"de": {
61+
"title": "Energiekraftwerke weltweit",
62+
"description": "Eine WebGis-Anwendung welche Inofrmationen über Energieerzeugung auf der ganzen Welt darstellt"
63+
}
64+
},
65+
"tags": [],
66+
"category": "",
67+
"type": "application",
68+
"components": [
69+
"MlGeoJsonLayer",
70+
"MlWmsLoader",
71+
"MlNavigationTools"
72+
],
73+
"thumbnail": "https://mapcomponents.github.io/react-map-components-apps/assets/thumbnails/PowerPlants.png",
74+
"demos": [
75+
{
76+
"name": "Demo",
77+
"url": "https://mapcomponents.github.io/react-map-components-apps/powerplants/"
78+
}
79+
]
80+
},
81+
"PointCloud": {
82+
"name": "PointCloud",
83+
"title": "PointCloud on world map",
84+
"description": "Ever heard of a PointCloud? Basically, it's a set of points placed in 3-dimensional space creating a detailed 3D object. This application contains an example of a point cloud, but projected onto the world map.",
85+
"i18n": {
86+
"de": {
87+
"title": "Energiekraftwerke weltweit",
88+
"description": "Haben Sie schon einmal von einer PointCloud gehört? Im Grunde genommen handelt es sich um eine Reihe von Punkten, die im dreidimensionalen Raum platziert sind und ein detailliertes 3D-Objekt bilden. Diese Anwendung enthält ein Beispiel für eine Punktwolke, allerdings projiziert auf die Weltkarte."
89+
}
90+
},
91+
"tags": [],
92+
"category": "",
93+
"type": "application",
94+
"thumbnail": "https://mapcomponents.github.io/react-map-components-apps/assets/thumbnails/PointCloudDemoThumbnail.png",
95+
"demos": [
96+
{
97+
"name": "Demo",
98+
"url": "https://mapcomponents.github.io/react-map-components-apps/pointcloud/"
99+
}
100+
]
101+
},
77102
"MultiTab": {
78103
"name": "MultiTab",
79104
"title": "Multi-Tab Demo",

‎pointcloud/.eslintrc.cjs‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
module.exports = {
2+
env: { browser: true, es2020: true },
3+
extends: [
4+
'eslint:recommended',
5+
'plugin:@typescript-eslint/recommended',
6+
'plugin:react-hooks/recommended',
7+
],
8+
parser: '@typescript-eslint/parser',
9+
parserOptions: { ecmaVersion: 'latest', sourceType: 'module' },
10+
plugins: ['react-refresh'],
11+
rules: {
12+
'react-refresh/only-export-components': 'warn',
13+
},
14+
}

‎pointcloud/.gitignore‎

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
# Logs
2+
logs
3+
*.log
4+
npm-debug.log*
5+
yarn-debug.log*
6+
yarn-error.log*
7+
pnpm-debug.log*
8+
lerna-debug.log*
9+
10+
node_modules
11+
dist
12+
dist-ssr
13+
*.local
14+
15+
# Editor directories and files
16+
.vscode/*
17+
!.vscode/extensions.json
18+
.idea
19+
.DS_Store
20+
*.suo
21+
*.ntvs*
22+
*.njsproj
23+
*.sln
24+
*.sw?
25+
26+
sample*

‎pointcloud/Dockerfile‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
FROM node:18 as node_builder
2+
WORKDIR /usr/src/app
3+
COPY . /usr/src/app
4+
RUN yarn
5+
RUN yarn build
6+
7+
FROM nginxinc/nginx-unprivileged:1.21
8+
9+
COPY --from=node_builder /usr/src/app/dist /usr/share/nginx/html
10+
EXPOSE 80
11+
CMD ["nginx", "-g", "daemon off;"]

‎pointcloud/README.md‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
# MapComponents Point cloud - Demo
2+
3+
Diese Demo lädt eine Punktwolke im JSON-Format. Sie muss sich im Ordner „Public“ mit dem Namen „output_pointcloud.json“ befinden.
4+
Um die Datei zu erzeugen, führt man das Skript **converter.py** aus und übergibt als Parameter den Pfad zur LAS-Datei:
5+
6+
```bash
7+
python3 converter.py < path_to_file >
8+
```
9+
10+
# MapComponents + vite + react + typescript
11+
12+
This template is based on the vite ts-react template, and adds all
13+
required basic components for a MapComponents application.
14+
15+
## Start the development server
16+
17+
```bash
18+
yarn dev
19+
```

‎pointcloud/converter.py‎

Lines changed: 76 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,76 @@
1+
import laspy
2+
import json
3+
import numpy as np
4+
from laspy.compression import LazBackend
5+
from pyproj import Transformer
6+
import argparse
7+
8+
# Set up argument parsing
9+
parser = argparse.ArgumentParser(description="Process a LAS/LAZ file.")
10+
parser.add_argument("input_las", type=str, help="Path to the LAS/LAZ file")
11+
12+
13+
# Parse the arguments
14+
args = parser.parse_args()
15+
16+
# Load the LAS/LAZ file
17+
input_las = args.input_las
18+
19+
if LazBackend.Lazrs.is_available():
20+
laz_backend = LazBackend.Lazrs
21+
elif LazBackend.Laszip.is_available():
22+
laz_backend = LazBackend.Laszip
23+
else:
24+
raise RuntimeError("No LAZ backend is available. Install lazrs or laszip.")
25+
26+
las = laspy.read(input_las, laz_backend=laz_backend)
27+
28+
original_crs = "EPSG:25832"
29+
target_crs = "EPSG:4326" # WGS84
30+
31+
# Set up transformer for coordinate system conversion to WGS84
32+
transformer = Transformer.from_crs(original_crs, target_crs, always_xy=True)
33+
34+
# Extract x, y, z coordinates and transform to WGS84
35+
x, y, z = transformer.transform(las.x, las.y, las.z)
36+
37+
# Check for RGB color information
38+
dimension_names = las.point_format.dimension_names
39+
has_rgb = 'red' in dimension_names and 'green' in dimension_names and 'blue' in dimension_names
40+
# Extract color values and normalize them to 8-bit range
41+
if has_rgb:
42+
r = (las.red / 256).astype(np.uint8)
43+
g = (las.green / 256).astype(np.uint8)
44+
b = (las.blue / 256).astype(np.uint8)
45+
else:
46+
# Default grey color if RGB is missing
47+
r = np.full_like(x, 128, dtype=np.uint8)
48+
g = np.full_like(x, 128, dtype=np.uint8)
49+
b = np.full_like(x, 128, dtype=np.uint8)
50+
51+
# Prepare the data for JSON export
52+
positions: list = []
53+
normals: list = []
54+
colors: list = []
55+
56+
for i in range(len(x)):
57+
position = [float(x[i]), float(y[i]), float(z[i])]
58+
normal = [0, 0, -1] # Normal placeholder; replace with actual data if available
59+
color = [int(r[i]), int(g[i]), int(b[i])] # Use the scaled 8-bit values
60+
61+
positions.append(position)
62+
normals.append(normal)
63+
colors.append(color)
64+
65+
points = {
66+
"positions": positions,
67+
"normals": normals,
68+
"colors": colors
69+
}
70+
71+
# Export to JSON
72+
output_json = "public/output_pointcloud.json"
73+
with open(output_json, "w") as f:
74+
json.dump(points, f, indent=2)
75+
76+
print(f"Exported LAS/LAZ data to JSON format: {output_json}")

‎pointcloud/index.html‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<link rel="manifest" href="/manifest.json">
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7+
<link rel="icon" type="image/png" sizes="196x196" href="favicon-196.png">
8+
<link rel="apple-touch-icon" href="apple-icon-180.png">
9+
<meta name="apple-mobile-web-app-capable" content="yes">
10+
<title>PointCloud (3D-Darstellung)</title>
11+
</head>
12+
<body>
13+
<div id="root"></div>
14+
<script type="module" src="/src/main.tsx"></script>
15+
</body>
16+
</html>

0 commit comments

Comments
 (0)