# gul-e-rana-027/brats-visualizer architecture

> Architecture diagram of the GitHub repository gul-e-rana-027/brats-visualizer, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-09-27). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/gul-e-rana-027/brats-visualizer
- Repository: https://github.com/gul-e-rana-027/brats-visualizer

## Overview

BraTS Brain Tumor Visualizer is a browser-based MRI viewer and segmentation tool. Users upload NIfTI scans, the Flask API preprocesses them and can run a selected ONNX model, then returns predictions, region statistics, and slice or volume data for viewing. The browser supports orthogonal slices, 3D visualization, navigation, and annotations. The frontend modules shown are placeholders; their planned responsibilities remain in app.js. Backend route and utility excerpts are partial, so the graph omits uncertain internal wiring.

Main entry points: [`backend/routes.py`](https://github.com/gul-e-rana-027/brats-visualizer/blob/main/backend/routes.py) (HTTP Routes), [`static/js/app.js`](https://github.com/gul-e-rana-027/brats-visualizer/blob/main/static/js/app.js) (Viewer UI), [`backend/utils.py`](https://github.com/gul-e-rana-027/brats-visualizer/blob/main/backend/utils.py) (ONNX Inference), [`app.py`](https://github.com/gul-e-rana-027/brats-visualizer/blob/main/app.py) (Flask App)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_viewer["Browser Viewer"]
  node_page["Viewer Templates"]
  node_frontend["Viewer UI<br/>[app.js]"]
  node_controls["Slice Navigation<br/>[app.js]"]
  node_annotations["Measurements<br/>[app.js]"]
  node_viewer3d["3D Viewer<br/>[app.js]"]
end

subgraph group_backend["API and Imaging"]
  node_webapp["Flask App<br/>[app.py]"]
  node_api["HTTP Routes<br/>[routes.py]"]
  node_preprocess["NIfTI Preprocessing<br/>[utils.py]"]
  node_cache[("Session Volume Cache<br/>[utils.py]")]
end

subgraph group_segmentation["Segmentation"]
  node_config["Model Registry<br/>[config.py]"]
  node_inference["ONNX Inference<br/>[utils.py]"]
  node_models["ONNX Runtime"]
  node_postprocess["Labels and Statistics<br/>[utils.py]"]
end

subgraph group_rendering["Visualization Data"]
  node_sliceimages["Slice Image Rendering<br/>[utils.py]"]
  node_volumeendpoint["Volume Data API<br/>[routes.py]"]
end

node_user(("Clinician / User"))

node_user -->|"uses"| node_frontend
node_webapp -->|"registers routes"| node_api
node_api -->|"renders page"| node_page
node_frontend -->|"calls API"| node_api
node_api -->|"reads model settings"| node_config
node_api -->|"preprocesses scans"| node_preprocess
node_api -->|"runs prediction"| node_inference
node_inference -->|"runs model"| node_models
node_api -->|"builds prediction results"| node_postprocess
node_api -->|"stores and reads volumes"| node_cache
node_api -->|"renders slices"| node_sliceimages
node_api -->|"serves volume data"| node_volumeendpoint
node_frontend -->|"provides navigation"| node_controls
node_frontend -->|"provides tools"| node_annotations
node_frontend -->|"renders volume"| node_viewer3d
node_controls -->|"requests slices"| node_api
node_viewer3d -->|"fetches volume"| node_volumeendpoint
node_postprocess -->|"returns labels and stats"| node_frontend

click node_webapp "https://github.com/gul-e-rana-027/brats-visualizer/blob/main/app.py"
click node_page "https://github.com/gul-e-rana-027/brats-visualizer/tree/main/templates"
click node_frontend "https://github.com/gul-e-rana-027/brats-visualizer/blob/main/static/js/app.js"
click node_controls "https://github.com/gul-e-rana-027/brats-visualizer/blob/main/static/js/app.js"
click node_annotations "https://github.com/gul-e-rana-027/brats-visualizer/blob/main/static/js/app.js"
click node_viewer3d "https://github.com/gul-e-rana-027/brats-visualizer/blob/main/static/js/app.js"
click node_api "https://github.com/gul-e-rana-027/brats-visualizer/blob/main/backend/routes.py"
click node_config "https://github.com/gul-e-rana-027/brats-visualizer/blob/main/backend/config.py"
click node_preprocess "https://github.com/gul-e-rana-027/brats-visualizer/blob/main/backend/utils.py"
click node_inference "https://github.com/gul-e-rana-027/brats-visualizer/blob/main/backend/utils.py"
click node_postprocess "https://github.com/gul-e-rana-027/brats-visualizer/blob/main/backend/utils.py"
click node_cache "https://github.com/gul-e-rana-027/brats-visualizer/blob/main/backend/utils.py"
click node_sliceimages "https://github.com/gul-e-rana-027/brats-visualizer/blob/main/backend/utils.py"
click node_volumeendpoint "https://github.com/gul-e-rana-027/brats-visualizer/blob/main/backend/routes.py"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_page,node_frontend,node_controls,node_annotations,node_viewer3d,node_user toneBlue
class node_webapp,node_api,node_preprocess,node_cache toneAmber
class node_config,node_inference,node_models,node_postprocess toneMint
class node_sliceimages,node_volumeendpoint toneRose
```

## Components

### Browser Viewer

- [Viewer Templates](https://github.com/gul-e-rana-027/brats-visualizer/tree/main/templates): `templates`
- [Viewer UI](https://github.com/gul-e-rana-027/brats-visualizer/blob/main/static/js/app.js): `static/js/app.js`
- [Slice Navigation](https://github.com/gul-e-rana-027/brats-visualizer/blob/main/static/js/app.js): `static/js/app.js`
- [Measurements](https://github.com/gul-e-rana-027/brats-visualizer/blob/main/static/js/app.js): `static/js/app.js`
- [3D Viewer](https://github.com/gul-e-rana-027/brats-visualizer/blob/main/static/js/app.js): `static/js/app.js`

### API and Imaging

- [Flask App](https://github.com/gul-e-rana-027/brats-visualizer/blob/main/app.py): `app.py`
- [HTTP Routes](https://github.com/gul-e-rana-027/brats-visualizer/blob/main/backend/routes.py): `backend/routes.py`
- [NIfTI Preprocessing](https://github.com/gul-e-rana-027/brats-visualizer/blob/main/backend/utils.py): `backend/utils.py`
- [Session Volume Cache](https://github.com/gul-e-rana-027/brats-visualizer/blob/main/backend/utils.py): `backend/utils.py`

### Segmentation

- [Model Registry](https://github.com/gul-e-rana-027/brats-visualizer/blob/main/backend/config.py): `backend/config.py`
- [ONNX Inference](https://github.com/gul-e-rana-027/brats-visualizer/blob/main/backend/utils.py): `backend/utils.py`
- **ONNX Runtime**
- [Labels and Statistics](https://github.com/gul-e-rana-027/brats-visualizer/blob/main/backend/utils.py): `backend/utils.py`

### Visualization Data

- [Slice Image Rendering](https://github.com/gul-e-rana-027/brats-visualizer/blob/main/backend/utils.py): `backend/utils.py`
- [Volume Data API](https://github.com/gul-e-rana-027/brats-visualizer/blob/main/backend/routes.py): `backend/routes.py`

### Other components

- **Clinician / User**

## Connections

- Clinician / User → Viewer UI: uses
- Flask App → HTTP Routes: registers routes
- HTTP Routes → Viewer Templates: renders page
- Viewer UI → HTTP Routes: calls API
- HTTP Routes → Model Registry: reads model settings
- HTTP Routes → NIfTI Preprocessing: preprocesses scans
- HTTP Routes → ONNX Inference: runs prediction
- ONNX Inference → ONNX Runtime: runs model
- HTTP Routes → Labels and Statistics: builds prediction results
- HTTP Routes → Session Volume Cache: stores and reads volumes
- HTTP Routes → Slice Image Rendering: renders slices
- HTTP Routes → Volume Data API: serves volume data
- Viewer UI → Slice Navigation: provides navigation
- Viewer UI → Measurements: provides tools
- Viewer UI → 3D Viewer: renders volume
- Slice Navigation → HTTP Routes: requests slices
- 3D Viewer → Volume Data API: fetches volume
- Labels and Statistics → Viewer UI: returns labels and stats
