Design and implementation of a new version of 2DProts database web pages

Bc. Mario Mičulka

Bakalářská práce

Anotace:

Databáze CATH klasifikuje stovky tisíc proteinových domén do rodin na základě strukturní podobnosti. Projekt 2DProts generuje dvourozměrné diagramy sekundárních strukturních elementů těchto domén, které umožňují porovnávání proteinů v rámci rodiny. Stávající webové rozhraní 2DProts zobrazuje tyto diagramy jako statické obrázky bez interaktivních funkcí. Tato práce představuje návrh a implementaci nového webového prohlížeče pro databázi 2DProts. Aplikace, vytvořená jako aplikace v React a TypeScript, umožňuje výzkumníkům interaktivně prozkoumávat 2D diagramy pomocí přepínání vrstev, tooltipů a skrývání jednotlivých elementů, posouvání a přiblížení a režimu celé obrazovky. Výkonnostně orientované techniky vykreslování, včetně přímé injekce do DOM a řízení viditelnosti pomocí CSS, umožňují prohlížeči zpracovat velké rodinné diagramy obsahující tisíce SVG elementů.

Abstract:

The CATH database classifies hundreds of thousands of protein domains into families based on structural similarity. The 2DProts project generates two-dimensional diagrams of secondary structure elements for these domains, providing a compact representation useful for comparing proteins within a family. The existing 2DProts web interface displays these diagrams as static images with no interactive capabilities. This thesis presents the design and implementation of a new web-based viewer for the 2DProts database. The application, built using React and TypeScript, allows researchers to interactively explore 2D diagrams through layer toggling, element-level tooltips and hiding, pan and zoom, and fullscreen mode. Performance-oriented rendering techniques, including direct DOM injection and CSS-driven visibility control, enable the viewer to handle large family diagrams containing thousands of SVG elements. The application currently serves tens of thousands of domains organized into hundreds of families, covering thousands of proteins.

Keywords

2DProts, protein structure, CATH, web application, React, TypeScript, SVG, interactive visualization

Jazyk práce: angličtina

Datum vytvoření / odevzdání či podání práce: 21. 5. 2026

Obhajoba závěrečné práce

• Obhajoba proběhla 26. 6. 2026
• Vedoucí: RNDr. Ivana Hutařová Vařeková, Ph.D.
• Oponent: RNDr. Ondřej Schindler, Ph.D.

Masarykova univerzita

Fakulta informatiky

Bakalářský studijní program / obor:
Informatika / Informatika