Upgrade to Pro — share decks privately, control downloads, hide ads and more …

BabiaXR: Virtual Reality Data Visualizations fo...

Avatar for David Moreno Lumbreras David Moreno Lumbreras
February 05, 2022
Technology
0
200

BabiaXR: Virtual Reality Data Visualizations for the browser

Avatar for David Moreno Lumbreras

David Moreno Lumbreras

February 05, 2022
Tweet

More Decks by David Moreno Lumbreras

See All by David Moreno Lumbreras
Exploring Visualization of Software-Related data in Extended Reality - Thesis dissertation
Avatar for David Moreno Lumbreras dlumbrer
0
25
OPENSYM & OSS 2023 GATHER TOGETHER
Avatar for David Moreno Lumbreras dlumbrer
0
72
Visualize the NPM dependencies city ecosystem of your node project in VR
Avatar for David Moreno Lumbreras dlumbrer
0
140
BabiaXR: Virtual Reality Data Visualizations for the Web
Avatar for David Moreno Lumbreras dlumbrer
0
190
CodeCity: On-Screen or in Virtual Reality? - VISSOFT 2021
Avatar for David Moreno Lumbreras dlumbrer
0
78
BabiaXR Visualización de Datos en Realidad Virtual
Avatar for David Moreno Lumbreras dlumbrer
0
150
BabiaXR: Virtual Reality Data Visualizations using only Front-End
Avatar for David Moreno Lumbreras dlumbrer
0
210
VBoard, Web dashboards in VR and AR
Avatar for David Moreno Lumbreras dlumbrer
0
180
VBoard, web dashboards in VR and AR
Avatar for David Moreno Lumbreras dlumbrer
0
180

Other Decks in Technology

See All in Technology
20250905_MeetUp_Ito-san_s_presentation.pdf
Avatar for MagicPod magicpod
1
100
AIエージェントで90秒の広告動画を制作！台本・音声・映像・編集をつなぐAWS最新アーキテクチャの実践
Avatar for Kiminori Yokoi nasuvitz
3
350
Oracle Base Database Service 技術詳細
Avatar for oracle4engineer oracle4engineer
PRO
10
75k
要件定義・デザインフェーズでもAIを活用して、コミュニケーションの密度を高める
Avatar for KazukiHayase kazukihayase
0
120
Apache Spark もくもく会
Avatar for Takaaki Yayoi taka_aki
0
140
Evolución del razonamiento matemático de GPT-4.1 a GPT-5 - Data Aventura Summit 2025 & VSCode DevDays
Avatar for Lautaro Carro lauchacarro
0
210
AWSで始める実践Dagster入門
Avatar for キタガワ kitagawaz
1
740
新アイテムをどう使っていくか？みんなであーだこーだ言ってみよう / 20250911-rpi-jam-tokyo
Avatar for Akira Ouchi akkiesoft
0
340
AI時代を生き抜くエンジニアキャリアの築き方 (AI-Native 時代、エンジニアという道は 「最大の挑戦の場」となる) / Building an Engineering Career to Thrive in the Age of AI (In the AI-Native Era, the Path of Engineering Becomes the Ultimate Arena of Challenge)
Avatar for JaeSoon Jeong jeongjaesoon
0
250
Create Ruby native extension gem with Go
Avatar for sue445 sue445
0
130
dbt開発 with Claude Codeのためのガードレール設計
Avatar for 10xinc 10xinc
2
1.3k
JTCにおける内製×スクラム開発への挑戦〜内製化率95%達成の舞台裏/JTC's challenge of in-house development with Scrum
Avatar for AEON aeonpeople
0
270

Featured

See All Featured
Save Time (by Creating Custom Rails Generators)
Avatar for Garrett Dimon garrettdimon
PRO
32
1.6k
Making Projects Easy
Avatar for Brett Harned brettharned
117
6.4k
The Success of Rails: Ensuring Growth for the Next 100 Years
Avatar for Eileen M. Uchitelle eileencodes
46
7.6k
The Pragmatic Product Professional
Avatar for Laura Van Doore lauravandoore
36
6.9k
Distributed Sagas: A Protocol for Coordinating Microservices
Avatar for Caitie McCaffrey caitiem20
333
22k
A Tale of Four Properties
Avatar for Chris Coyier chriscoyier
160
23k
Become a Pro
Avatar for Speaker Deck speakerdeck
PRO
29
5.5k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
Avatar for mongodb mongodb
48
9.7k
Making the Leap to Tech Lead
Avatar for Ryan Cromwell cromwellryan
135
9.5k
Building an army of robots
Avatar for Kyle Neath kneath
306
46k
Performance Is Good for Brains [We Love Speed 2024]
Avatar for Tammy Everts tammyeverts
12
1.1k
Designing for Performance
Avatar for Lara Hogan lara
610
69k

Transcript

  1. BabiaXR Virtual Reality Data Visualizations for the browser https://babiaxr.gitlab.io David

    Moreno - [email protected] & [email protected]
  2. None

  3. https://babiaxr.gitlab.io/aframe-babia-components/examples/charts/barsmap/

  4. https://babiaxr.gitlab.io/aframe-babia-components/examples/demos/1.0.11/

  5. A-Frame

  6. Entity Component System Entity - <a-entity> Components - HTML attributes

    on <a-entity>‘s System - Systems are similar to components in definition https://aframe.io/docs/1.2.0/introduction/entity-component-system.html

  7. Component https://aframe.io/docs/1.2.0/introduction/writing-a-component.html

  8. Queriers babia-queryjson <a-entity id="data" babia-queryjson="url: ./data.json;"> </a-entity> babia-queryes babia-querygithub

  9. Data management babia-filter Work In Progress <a-entity babia-filter="from: data; filter:

    age=2017"></a-entity> babia-treebuilder

  10. 1. Pie 2. Doughnut 3. 3D/2D bars 4. 3D/2D cylinders

    5. Bubbles 6. Network . . Visualizations

  11. Visualizations 1. Pie 2. Doughnut 3. 3D/2D bars 4. 3D/2D

    cylinders 5. Bubbles 6. Network . . City

  12. Examples babiaxr-vismapper (maps data properties to visualization properties) https://babiaxr.gitlab.io/aframe-babia-components/

  13. Guides Components API https://babiaxr.gitlab.io/apis/ Tutorials https://babiaxr.gitlab.io/tutorials/

  14. City https://babiaxr.gitlab.io/aframe-babia-components/examples/codecityjs/basic/

  15. Metrics Layout Tree structure for districts/buildings Building Geometry height area

    (depth/width) Other Color map for numeric field

  16. Metrics Treemap - Tree structure for districts/buildings Building Geometry height

    area (depth/width) Other Color map for numeric field

  17. Quick full example

  18. Quick full example

  19. Quick full example

  20. Quick full example

  21. Boats and City

  22. Full Configuration

  23. Get the Data Tutorials: https://gitlab.com/babiaxr/aframe-babia-components/-/tree/master/tools Boats API: https://babiaxr.gitlab.io/apis/charts/#babia-boats-component

  24. None

  25. Time evolution

  26. Multiuser Networked component: https://github.com/networked-aframe/networked-aframe

  27. Desert: https://tinyurl.com/babiaFOSDEM22 With avatar selection: https://tinyurl.com/babiaAvatars Multiuser

  28. Other components babia-terrain babia-lookat More coming soon!

  29. bonus

  30. WebRTC + Aframe + NPM upload

  31. Contribute GPLv3 License Contributing guide https://gitlab.com/babiaxr/aframe-babia-components/-/blob/master/docs/CONTRIBUTING.md

  32. BabiaXR Virtual Reality Data Visualizations for the browser https://babiaxr.gitlab.io David

    Moreno - [email protected] & [email protected]