Data Apps
A data app is a configuration-based visualization tool that allows you to create interactive dashboards from SQL queries without writing complex frontend code.What are Data Apps?
Data apps in Oxygen are defined using YAML configuration files (.app.yml) that specify both the data processing tasks and how to visualize the results.
ℹ️ Info
Data apps are designed to make it simple to transform SQL query results into meaningful visualizations with minimal effort. The .app.yml files abstract away the complexity of building dashboards, allowing you to focus on the data and insights rather than visualization code.
Data App Components
In a data app YAML file, you need to specify the following components:Tasks
Thetasks section defines SQL queries that will extract and transform data from your databases. Each task has the following structure:
⚠️ Warning Make sure your tasks are named uniquely as these names are referenced in the display section.
Display
Thedisplay section defines how to visualize the data produced by your tasks. Several visualization types are supported:
Markdown
Markdown blocks can be used to add formatted text, headers, and documentation:Controls
Controls add interactive filter widgets to your app. When the user changes a control value, every task that references that control re-runs automatically and all charts and tables update. Controls are defined inline in thedisplay list using type: control:
Control types
select — a dropdown menu. Populate options from a static list, from Jinja expressions, or from a task query:
date — a date picker that injects a YYYY-MM-DD string. The default can be a static date or a Jinja expression:
toggle — a boolean on/off switch:
Using control values in SQL
Reference control values in your task SQL using Jinja syntax:
ℹ️ Info
Controls must be placed before the charts and tables they affect in the display list. The controls bar is rendered at the top of the page and stays visible as you scroll.
Bar Chart
Line Chart
Pie Chart
Table
Row (multi-column layout)
Userow to arrange multiple charts side by side: