Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
OPENSYM & OSS 2023 GATHER TOGETHER
Search
David Moreno Lumbreras
September 08, 2023
Technology
0
78
OPENSYM & OSS 2023 GATHER TOGETHER
David Moreno Lumbreras
September 08, 2023
Tweet
Share
More Decks by David Moreno Lumbreras
See All by David Moreno Lumbreras
Exploring Visualization of Software-Related data in Extended Reality - Thesis dissertation
dlumbrer
0
26
Visualize the NPM dependencies city ecosystem of your node project in VR
dlumbrer
0
150
BabiaXR: Virtual Reality Data Visualizations for the Web
dlumbrer
0
200
BabiaXR: Virtual Reality Data Visualizations for the browser
dlumbrer
0
210
CodeCity: On-Screen or in Virtual Reality? - VISSOFT 2021
dlumbrer
0
82
BabiaXR Visualización de Datos en Realidad Virtual
dlumbrer
0
150
BabiaXR: Virtual Reality Data Visualizations using only Front-End
dlumbrer
0
220
VBoard, Web dashboards in VR and AR
dlumbrer
0
180
VBoard, web dashboards in VR and AR
dlumbrer
0
180
Other Decks in Technology
See All in Technology
『バイトル』CTOが語る! AIネイティブ世代と切り拓くモノづくり組織
dip_tech
PRO
1
130
Findy Team+ QAチーム これからのチャレンジ!
findy_eventslides
0
400
PHPからはじめるコンピュータアーキテクチャ / From Scripts to Silicon: A Journey Through the Layers of Computing Hiroshima 2025 Edition
tomzoh
0
140
Git in Team
kawaguti
PRO
3
380
「使い方教えて」「事例教えて」じゃもう遅い! Microsoft 365 Copilot を触り倒そう!
taichinakamura
0
400
研究開発部メンバーの働き⽅ / Sansan R&D Profile
sansan33
PRO
3
20k
Introduction to Sansan Meishi Maker Development Engineer
sansan33
PRO
0
310
[Codex Meetup Japan #1] Codex-Powered Mobile Apps Development
korodroid
2
920
アイテムレビュー機能導入からの学びと改善
zozotech
PRO
0
180
セキュアな認可付きリモートMCPサーバーをAWSマネージドサービスでつくろう! / Let's build an OAuth protected remote MCP server based on AWS managed services
kaminashi
3
340
難しいセキュリティ用語をわかりやすくしてみた
yuta3110
0
220
Oracle Base Database Service 技術詳細
oracle4engineer
PRO
12
80k
Featured
See All Featured
We Have a Design System, Now What?
morganepeng
53
7.8k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
48
9.7k
How STYLIGHT went responsive
nonsquared
100
5.8k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
162
15k
Embracing the Ebb and Flow
colly
88
4.9k
Keith and Marios Guide to Fast Websites
keithpitt
411
23k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
16k
How to train your dragon (web standard)
notwaldorf
97
6.3k
Testing 201, or: Great Expectations
jmmastey
45
7.7k
Facilitating Awesome Meetings
lara
56
6.6k
GitHub's CSS Performance
jonrohan
1032
470k
VelocityConf: Rendering Performance Case Studies
addyosmani
332
24k
Transcript
Visualize your Open Source Software using an Extended Reality (XR)
web-based software analytics system: BabiaXR https://babiaxr.gitlab.io David Moreno Lumbreras Jesús M. González-Barahona Gregorio Robles
None
https://babiaxr.gitlab.io/aframe-babia-components/examples/charts/barsmap/
https://babiaxr.gitlab.io/aframe-babia-components/examples/demos/1.0.11/
A-Frame
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
Component https://aframe.io/docs/1.2.0/introduction/writing-a-component.html
Queriers babia-queryjson <a-entity id="data" babia-queryjson="url: ./data.json;"> </a-entity> babia-queryes babia-querygithub
Data management babia-filter Work In Progress <a-entity babia-filter="from: data; filter:
age=2017"></a-entity> babia-treebuilder
1. Pie 2. Doughnut 3. 3D/2D bars 4. 3D/2D cylinders
5. Bubbles 6. Network . . Visualizations
Visualizations 1. Pie 2. Doughnut 3. 3D/2D bars 4. 3D/2D
cylinders 5. Bubbles 6. Network . . City
Examples babiaxr-vismapper (maps data properties to visualization properties) https://babiaxr.gitlab.io/aframe-babia-components/
Guides Components API https://babiaxr.gitlab.io/apis/ Tutorials https://babiaxr.gitlab.io/tutorials/
City https://babiaxr.gitlab.io/aframe-babia-components/examples/codecityjs/basic/
Metrics Layout Tree structure for districts/buildings Building Geometry height area
(depth/width) Other Color map for numeric field
Metrics Treemap - Tree structure for districts/buildings Building Geometry height
area (depth/width) Other Color map for numeric field
Quick full example
Boats and City
Full Configuration
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
https://thesis-dlumbrer.gitlab.io/ist21-reprpckg/first_ experiment/scenes/screen/jetuml2021.html
Time evolution https://thesis-dlumbrer.gitlab.io/sattose2023/ Tutorial to build your visualization: https://babiaxr.gitlab.io/tutorials/temporal_evol_with_boats/
Dependencies Tutorial to build your visualization: https://gitlab.com/thesis-dlumbrer/vr-dependencies-babiaxr/-/blob/main/README.md?ref_type=heads https://thesis-dlumbrer.gitlab.io/emse22-scenes/dashboards/ch aoss-dashboards-static.html
Community Data https://thesis-dlumbrer.gitlab.io/emse22-scenes /dashboards/chaoss-dashboards-static.html
bonus
Contribute GPLv3 License Contributing guide https://gitlab.com/babiaxr/aframe-babia-components/-/blob/master/docs/CONTRIBUTING.md
Visualize your Open Source Software using an Extended Reality (XR)
web-based software analytics system: BabiaXR https://babiaxr.gitlab.io David Moreno Lumbreras Jesús M. González-Barahona Gregorio Robles