Tabula Sapiens 3D Viewer is a web application designed to explore Tabula Sapiens datasets as interactive 3D charts, focusing initially on blood samples.

Live Demo: Tabula Sapiens 3D Viewer

Works best on 16:9 or 16:10 desktops with Google Chrome or Edge.

Despite the advanced state of genomic and cellular analysis, a significant portion of visual data analysis remains confined to two-dimensional representations.

This project introduces a 3D data exploration tool for browsers, inspired by CELLxGENE, to facilitate a more intuitive and comprehensive visual analysis of genetic test samples.

The tool is particularly useful for examining multiple aspects of data simultaneously and serves as an effective benchmark for browser performance, managing datasets with approximately 50,000 data points.

Currently, the viewer is applied to explore the Blood Single Cell dataset.

The backend infrastructure utilizes Docker to containerize both a Flask application and a PostgreSQL database, ensuring consistent, isolated development environments. Use docker-compose for local development.

To visualize the datasets, the viewer processes .h5ad files, extracting cell metadata and dimensionality reduction data, specifically UMAP coordinates, for 3D visualization. Data is sourced from the Tabula Sapiens release available online. Then, this data is loaded into PostgreSQL and served via Flask ednpoints as JSON responses with just the bare minimum required for the visualization. Current live example uses one such example response, created via the logic that can be found in the Flask app.

The Flask backend supports several functions, including:

• Loading .h5ad file data into the database.
• Summarizing datasets to outline structure and components.
• Serving cell data for analysis and visualization.

Local setup involves downloading .h5ad files, preparing the backend dataset directory, and executing docker-compose up. Curl for populating database: curl -X POST http://localhost:5000/summarize_h5ad -H "Content-Type: application/json" -d '{"path":"/app/datasets/<filename>.h5ad"}'

The frontend is developed with React, employing react-window for efficient list management and three.js for 3D visualization. However, different renderers are being considered at this moment. Future considerations focus on scalability and optimization for handling large datasets and complex queries. The current capacity includes dynamically displaying 50,000 elements in lists and 3D visualizations, with ambitions to scale beyond one million points through advanced techniques and backend filtering enhancements, but it's not decided yet if this choice of libraries is the best.

The project is open for collaboration. Let me know if you have some ideas!