Widget Types

Widget Types

Widgets are the building blocks of your Querri dashboards. Each widget type is designed to display data in a specific way, helping you create comprehensive and informative dashboards.

Available Widget Types

Querri dashboards support several widget types, each suited for different data visualization needs:

Charts

Chart widgets are perfect for visualizing trends, comparisons, and distributions:

• Line Charts: Show trends over time, ideal for tracking metrics like revenue, traffic, or sales
• Bar Charts: Compare values across categories, great for showing top performers or regional comparisons
• Pie Charts: Display proportions and percentages, useful for market share or category breakdowns
• Area Charts: Similar to line charts but emphasize volume and cumulative values
• Scatter Plots: Show relationships between two variables, perfect for correlation analysis

When to use charts: Use charts when you need to show patterns, trends, or relationships in your data.

Tables

Table widgets display data in a structured, row-and-column format:

• Standard Tables: Show detailed data with sorting and filtering
• Paginated Tables: Handle large datasets with page navigation
• Conditional Formatting: Highlight important values with colors and icons

When to use tables: Use tables when users need to see detailed records, look up specific values, or export raw data.

Metrics

Metric widgets (also called KPI widgets) display single, important numbers:

• Single Value: Display one key metric prominently
• Comparison: Show current value vs. previous period
• Trend Indicators: Include sparklines or arrows showing direction
• Goal Progress: Display percentage toward a target

When to use metrics: Use metrics for your most important KPIs that need immediate attention.

Filters

Filter widgets allow dashboard viewers to control what data is displayed:

• Dropdown Filters: Select from a list of options
• Date Range Pickers: Choose time periods for analysis
• Search Filters: Find specific items by text
• Multi-Select Filters: Choose multiple values simultaneously

When to use filters: Use filters to make your dashboard interactive and let users explore different data slices.

Adding Widgets from Project Steps

One of Querri’s powerful features is the ability to convert project analysis steps into dashboard widgets:

Step-by-Step Process

1. Create your analysis in a project: Build your data pipeline and visualizations in a project first
2. Identify the steps to display: Determine which project steps contain the data or visualizations you want on your dashboard
3. Open your dashboard: Navigate to the dashboard where you want to add the widget
4. Add widget: Click “Add Widget” and select “From Project Step”
5. Select the project and step: Choose the source project and the specific step to display
6. Configure the widget: Adjust size, title, and other settings

Example: Sales Analysis to Dashboard

Let’s say you’ve created a project that analyzes sales data:

1. Project Step 1: Load sales data from your database
2. Project Step 2: Calculate total revenue by region
3. Project Step 3: Create a bar chart showing regional performance
4. Project Step 4: Identify top 10 products by sales

To create a dashboard:

• Add Step 3’s bar chart as a chart widget
• Add Step 4’s product list as a table widget
• Add a metric widget showing total revenue from Step 2

Widget Configuration

Each widget can be customized to match your needs:

Common Configuration Options

• Title: Give your widget a descriptive name
• Description: Add context or instructions for viewers
• Size: Set width and height in the grid layout
• Refresh Rate: Configure how often data updates
• Styling: Customize colors, fonts, and borders

Chart-Specific Options

• Axis Labels: Name your X and Y axes clearly
• Legend Position: Place the legend where it fits best
• Color Scheme: Choose colors that match your brand or improve readability
• Data Labels: Show or hide values on data points
• Tooltips: Configure what information appears on hover

Table-Specific Options

• Column Visibility: Show or hide specific columns
• Default Sorting: Set which column to sort by initially
• Row Limits: Control how many rows to display
• Column Formatting: Apply number formats, date formats, or custom formatting
• Cell Styling: Add conditional formatting rules

Metric-Specific Options

• Number Format: Choose decimal places, currency symbols, or percentages
• Comparison Period: Set the baseline for comparison (previous day, week, month, year)
• Thresholds: Define good/warning/bad ranges with color coding
• Icon: Add visual indicators for the metric type

Connecting Data to Widgets

Widgets need data to display. You can connect data in several ways:

From Project Steps

The most common method is linking to a project step that produces the data or visualization you need.

Direct Queries

Some widget types support direct database queries, allowing you to:

• Write custom SQL queries
• Connect to specific data sources
• Update data independently of projects

Static Data

For reference information or benchmarks, you can use static data:

• Manual entry for small datasets
• Uploaded CSV files
• Fixed values for comparison

Widget Best Practices

1. Choose the Right Widget Type

Match your widget to your data and message:

• Trends over time? Use line or area charts
• Comparisons? Use bar charts or tables
• Single important number? Use a metric widget
• Detailed records? Use a table widget

2. Keep It Simple

• Avoid chart junk and unnecessary decorations
• Use clear, concise titles
• Limit the number of data series in a single chart
• Don’t overcrowd your dashboard with too many widgets

3. Use Consistent Styling

• Stick to a color palette throughout your dashboard
• Use the same font sizes for similar elements
• Align widgets to create a clean grid layout
• Maintain consistent spacing between widgets

4. Optimize for Performance

• Limit table row counts to what’s necessary
• Use aggregated data when possible
• Set appropriate refresh rates (don’t refresh more often than needed)
• Consider using caching for slow queries

5. Make It Interactive

• Add filters to let users explore the data
• Use drill-down capabilities when available
• Include tooltips with additional context
• Link widgets together so filtering one affects others

Example Dashboard Layout

Here’s a recommended layout for a sales performance dashboard:

+------------------+------------------+------------------+
|  Total Revenue   |  Orders Today    |  Avg Order Value |
|  (Metric)        |  (Metric)        |  (Metric)        |
+------------------+------------------+------------------+
|  Revenue Trend (Line Chart)                          |
|                                                        |
+------------------------------------------------------ +
|  Regional Performance (Bar Chart)  | Top Products     |
|                                     | (Table)          |
|                                     |                  |
+-------------------------------------+------------------+

This layout prioritizes key metrics at the top, shows trends in the middle, and provides detailed breakdowns at the bottom.

Next Steps

• Dashboard Configuration - Customize your dashboard’s appearance and behavior
• Sharing Dashboards - Share your insights with others
• Scheduling & Automation - Automate dashboard updates and reports

Start building informative, actionable dashboards that drive better decision-making!