https://github.com/spectrachrome/eox-ar-spa

Demonstrator app for GeoTIFF rendering with Augmented Reality, with Vite and Vue to simplify the integration of some dependencies only available as ES modules.
https://github.com/spectrachrome/eox-ar-spa

aframe aframe-ar arjs augmented-reality geospatial geotiff

Last synced: 4 months ago
JSON representation

Demonstrator app for GeoTIFF rendering with Augmented Reality, with Vite and Vue to simplify the integration of some dependencies only available as ES modules.

• Host: GitHub
• URL: https://github.com/spectrachrome/eox-ar-spa
• Owner: spectrachrome
• Created: 2024-03-29T10:09:13.000Z (about 2 years ago)
• Default Branch: main
• Last Pushed: 2024-04-09T12:28:43.000Z (about 2 years ago)
• Last Synced: 2024-04-17T23:20:55.710Z (about 2 years ago)
• Topics: aframe, aframe-ar, arjs, augmented-reality, geospatial, geotiff
• Language: Vue
• Homepage: https://spectrachrome.github.io/eox-ar-spa/
• Size: 44.9 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
![eox_ar_banner](https://github.com/user-attachments/assets/3918c2ab-d88b-40c4-8a44-568822db7a81)![IMG_0178](https://github.com/spectrachrome/eox-ar/assets/94269527/61a4921f-8c43-49df-857e-e39fa22ae61e)



# Augmented Reality for Geospatial Applications

**Without SSL, this AR demonstrator will not function on mobile devices such as Android/iOS smartphones and tablets!**

A building ground for the evaluation of the capabilities of AR in a geospatial environment.

Currently, this is a simple Vue demonstrator application which uses AR.js to instantiate a camera view, and then render a 3D globe with GeoTIFF data expressed as colored radial columns if the Hiro marker is detected.

## Resources and Links

- [AR.js Marker Generator](https://jeromeetienne.github.io/AR.js/three.js/examples/marker-training/examples/generator.html)

- [Stemkoski's AR Examples](https://stemkoski.github.io/AR-Examples/)

- [A Guide To Developing An Augmented Reality Web App](https://3sidedcube.com/en-us/ar-js-a-guide-to-developing-an-augmented-reality-web-app-2/)

- [OpenLayers and Three.js](https://javascript.plainenglish.io/openlayers-and-three-js-99c904eed76c)

- [Canvas Textures - A-Frame Docs](https://aframe.io/docs/1.5.0/components/material.html#canvas-textures)

## Recommended IDE Setup

- [VS Code](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur) + [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin).

This template should help get you started developing with Vue 3 in Vite. The template uses Vue 3 `` SFCs, check out the [script setup docs](https://v3.vuejs.org/api/sfc-script-setup.html#sfc-script-setup) to learn more.

## Recommended IDE Setup

- [VS Code](https://code.visualstudio.com/) + [Vue - Official](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (previously Volar) and disable Vetur