Skip to content

Commit 86d7417

Browse files
astrojuanluastrojuanlu
committed
First draft of app
1 parent 9ff409c commit 86d7417

File tree

10 files changed

+3509
-0
lines changed

10 files changed

+3509
-0
lines changed

‎app/.gitignore‎

Lines changed: 144 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,144 @@
1+
# Created by https://www.toptal.com/developers/gitignore/api/node
2+
# Edit at https://www.toptal.com/developers/gitignore?templates=node
3+
4+
### Node ###
5+
# Logs
6+
logs
7+
*.log
8+
npm-debug.log*
9+
yarn-debug.log*
10+
yarn-error.log*
11+
lerna-debug.log*
12+
.pnpm-debug.log*
13+
14+
# Diagnostic reports (https://nodejs.org/api/report.html)
15+
report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
16+
17+
# Runtime data
18+
pids
19+
*.pid
20+
*.seed
21+
*.pid.lock
22+
23+
# Directory for instrumented libs generated by jscoverage/JSCover
24+
lib-cov
25+
26+
# Coverage directory used by tools like istanbul
27+
coverage
28+
*.lcov
29+
30+
# nyc test coverage
31+
.nyc_output
32+
33+
# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
34+
.grunt
35+
36+
# Bower dependency directory (https://bower.io/)
37+
bower_components
38+
39+
# node-waf configuration
40+
.lock-wscript
41+
42+
# Compiled binary addons (https://nodejs.org/api/addons.html)
43+
build/Release
44+
45+
# Dependency directories
46+
node_modules/
47+
jspm_packages/
48+
49+
# Snowpack dependency directory (https://snowpack.dev/)
50+
web_modules/
51+
52+
# TypeScript cache
53+
*.tsbuildinfo
54+
55+
# Optional npm cache directory
56+
.npm
57+
58+
# Optional eslint cache
59+
.eslintcache
60+
61+
# Optional stylelint cache
62+
.stylelintcache
63+
64+
# Microbundle cache
65+
.rpt2_cache/
66+
.rts2_cache_cjs/
67+
.rts2_cache_es/
68+
.rts2_cache_umd/
69+
70+
# Optional REPL history
71+
.node_repl_history
72+
73+
# Output of 'npm pack'
74+
*.tgz
75+
76+
# Yarn Integrity file
77+
.yarn-integrity
78+
79+
# dotenv environment variable files
80+
.env
81+
.env.development.local
82+
.env.test.local
83+
.env.production.local
84+
.env.local
85+
86+
# parcel-bundler cache (https://parceljs.org/)
87+
.cache
88+
.parcel-cache
89+
90+
# Next.js build output
91+
.next
92+
out
93+
94+
# Nuxt.js build / generate output
95+
.nuxt
96+
dist
97+
98+
# Gatsby files
99+
.cache/
100+
# Comment in the public line in if your project uses Gatsby and not Next.js
101+
# https://nextjs.org/blog/next-9-1#public-directory-support
102+
# public
103+
104+
# vuepress build output
105+
.vuepress/dist
106+
107+
# vuepress v2.x temp and cache directory
108+
.temp
109+
110+
# Docusaurus cache and generated files
111+
.docusaurus
112+
113+
# Serverless directories
114+
.serverless/
115+
116+
# FuseBox cache
117+
.fusebox/
118+
119+
# DynamoDB Local files
120+
.dynamodb/
121+
122+
# TernJS port file
123+
.tern-port
124+
125+
# Stores VSCode versions used for testing VSCode extensions
126+
.vscode-test
127+
128+
# yarn v2
129+
.yarn/cache
130+
.yarn/unplugged
131+
.yarn/build-state.yml
132+
.yarn/install-state.gz
133+
.pnp.*
134+
135+
### Node Patch ###
136+
# Serverless Webpack directories
137+
.webpack/
138+
139+
# Optional stylelint cache
140+
141+
# SvelteKit build / generate output
142+
.svelte-kit
143+
144+
# End of https://www.toptal.com/developers/gitignore/api/node

‎app/.prettierignore‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
# Ignore artifacts:
2+
build
3+
coverage
4+
dist

‎app/.prettierrc‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
{}

‎app/eslint.config.mjs‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
import globals from "globals";
2+
import pluginJs from "@eslint/js";
3+
4+
/** @type {import('eslint').Linter.Config[]} */
5+
export default [
6+
{ languageOptions: { globals: globals.browser } },
7+
pluginJs.configs.recommended,
8+
];

‎app/index.html‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8" />
5+
<title>VUTs Madrid</title>
6+
<style>
7+
body {
8+
margin: 0;
9+
width: 100vw;
10+
height: 100vh;
11+
overflow: hidden;
12+
}
13+
#map {
14+
width: 100%;
15+
height: 100%;
16+
position: relative;
17+
}
18+
</style>
19+
</head>
20+
<body>
21+
<div id="map"></div>
22+
</body>
23+
<script type="module" src="index.js"></script>
24+
</html>

‎app/index.js‎

Lines changed: 73 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,73 @@
1+
import { MapboxOverlay } from "@deck.gl/mapbox";
2+
import { GeoJsonLayer } from "@deck.gl/layers";
3+
import maplibregl from "maplibre-gl";
4+
import { asyncBufferFromUrl } from "hyparquet";
5+
import { toGeoJson } from "geoparquet";
6+
7+
async function initializeMap() {
8+
try {
9+
// Load and convert GeoParquet file
10+
const url = "https://raw.githubusercontent.com/astrojuanlu/desalkila/refs/heads/app/app/public/registry_cam_no_vuts_simple.geoparquet";
11+
const data = await asyncBufferFromUrl({ url });
12+
console.log(data);
13+
const geojson = await toGeoJson({ data });
14+
console.log(geojson);
15+
16+
const map = new maplibregl.Map({
17+
container: "map",
18+
style: {
19+
version: 8,
20+
sources: {
21+
osm: {
22+
type: "raster",
23+
tiles: ["https://tile.openstreetmap.org/{z}/{x}/{y}.png"],
24+
tileSize: 256,
25+
attribution: "&copy; OpenStreetMap Contributors",
26+
maxzoom: 19,
27+
},
28+
},
29+
layers: [
30+
{
31+
id: "osm",
32+
type: "raster",
33+
source: "osm",
34+
minzoom: 0,
35+
maxzoom: 19,
36+
},
37+
],
38+
},
39+
center: [-3.7038, 40.4168], // Madrid
40+
zoom: 11,
41+
});
42+
43+
map.on("load", () => {
44+
// Initialize your deck instance
45+
const deckOverlay = new MapboxOverlay({
46+
layers: [
47+
new GeoJsonLayer({
48+
id: "geojson-layer",
49+
data: geojson,
50+
filled: true,
51+
pointRadiusMinPixels: 8,
52+
pointRadiusScale: 2000,
53+
getPointRadius: 1,
54+
getFillColor: [255, 0, 0, 200], // Red dots
55+
pickable: true,
56+
onHover: ({ object }) => {
57+
if (object) {
58+
console.log(object.properties.name);
59+
}
60+
},
61+
}),
62+
],
63+
});
64+
65+
map.addControl(deckOverlay);
66+
map.addControl(new maplibregl.NavigationControl());
67+
});
68+
} catch (error) {
69+
console.error("Error initializing map:", error);
70+
}
71+
}
72+
73+
initializeMap();

0 commit comments

Comments
 (0)