Overview
Modern business applications demand more than raw data presentation; they require intuitive, visual storytelling that transforms complex datasets into actionable insights. Construct Preview addresses this critical need using Charting Components, enabling WebApp Designers to create visually compelling, data-driven applications that bridge the gap between technical data presentation and executive-level business knowledge.
Charts are ideal for stakeholders who require quick visual comprehension of key performance indicators (KPIs), trends, and business metrics.
Note
You can converse with Build Assist to quickly configure charts as required by entering a prompt that provides the context of the dataset and the fields to be used. For example,
Create a page with a line chart with dataset of "Construct - Test - ExercisePerWeekView" with category field of "ExerciseType", label field of "Date" and value field of "MinutesOfExercise"
Chart Types
You can seamlessly integrate different charts with existing page data using Construct Preview's robust container system. Charts work alongside Forms and Grids within any page layout or on a separate page, including:
Standard containers for simple chart placement
Tabbed containers for organized data presentation
Charts with Grids and Forms for complex dashboard configurations
This flexibility enables you to create comprehensive business applications that combine data entry, detailed data review, and visual analytics within a single, cohesive interface.
Currently, Construct Preview includes the following chart types designed to address the most common data visualization requirements:
Chart Type | Description | Chart Dataset Design / Configuration Article Link |
|---|---|---|
Pie or Donut | Perfect for showing proportional relationships, percentage-based comparisons, or resource allocations | |
Line | Essential for trend analysis, time-series data visualization, or performance tracking over periods | |
Bar (Vertical) | Ideal for comparing categorical data, tracking performance metrics across departments, or displaying results and ranking information | |
Card | Optimized for highlighting high-level dashboard summaries, monitor critical business metrics at a glance, and establish KPI displays | |
Treemap | Ideal for visualizing hierarchical data with part-to-whole or parent-child relationships, portfolio composition analysis, or displaying nested category breakdowns where size represents value or volume | |
Sunburst | Perfect for exploring multi-level hierarchical structures or visualizing nested proportions radiating from a central point | |
Bump | Essential for tracking rank changes over time or comparing competitive positions across periods where relative position matters more than absolute values | |
Heatmap | Optimized for revealing patterns across two dimensions, identifying correlations or hotspots in data matrices, or displaying intensity distributions across time/categories using color gradients | |
Sankey | Ideal for visualizing flow and movement between stages, tracking conversion funnels and user journeys, or displaying resource allocation and distribution pathways where link width represents quantity |
Advanced Controls Customization
Each chart type offers extensive customization options that enable developers to align visualizations with organizational standards and specific analytical requirements:
Visual Presentation Controls:
Show/Hide data labels with precision control over bars, points, and slices
Configurable legends with Show/Hide toggle functionality
Data Presentation Controls:
Show/Hide axis labels for clean, focused presentations
Auto-scaling capabilities for both X and Y axes ensuring optimal data representation
Simple sorting functionality with Ascending/Descending options for enhanced data organization
Deep-Dive Capabilities:
Hover details provide instant information of specific data points without cluttering the visual presentation
Customized click functionality enables direct navigation to detailed data grid pages displaying the underlying chart data