AppAlloy Documentation
Home
  • Glossary
  • 🚀Getting Started
    • Introduce AppAlloy Documentation
    • Build your first AppAlloy app
    • From sheet to app
  • 🗃️Data management
    • Learn data structure
    • Set up data source
      • Integrate with Google Sheets
      • Integrate with Microsoft Excel
      • Build Alloy table
      • Upload local file
    • Manage data type
    • Ultimate guide for data sheet
  • ⚒️Manage table views
    • Design Record View
    • Design Actions
      • Update current record
      • Delete current record
      • Delete many records
      • Create record
      • Open external URL
      • HTTP Request
      • Open phone call popup
      • Open SMS Popup
      • Open email popup
      • Send notification
    • Design Record Components
      • Plain Text
      • Phone number
      • Email
      • URL
      • Map
      • Barcode
      • Checkbox
      • Number
      • Currency
      • Rating
      • Voting
      • Date time
      • Relative date
      • Count Down / Count Up
      • Single Photo
      • Photo Gallery
      • Carousel
      • Audio Player
      • Video Player
      • Youtube Player
      • Vimeo Player
    • Design Form View
    • Design Form fields (synced tables)
      • Text (for synced tables)
      • Number (for synced tables)
      • Date time (for synced tables)
      • Checkbox (for synced table)
      • Options (for synced table)
      • Photos (for synced table)
      • Files (for synced table)
      • Table lookup (for synced table)
      • Signature (for synced table)
    • Design Form fields (Alloy tables)
      • Single line Text (for Alloy table)
      • Long Text (for Alloy table)
      • Phone number (for Alloy table)
      • Email (for Alloy table)
      • Barcode (for Alloy table)
      • Number (for Alloy table)
      • Currency (for Alloy table)
      • Checkbox (for Alloy table)
      • Date (for Alloy table)
      • Photos (for Alloy table)
      • Files (for Alloy table)
      • Single select (for Alloy table)
      • Multiple select (for Alloy table)
      • Address (for Alloy table)
      • Table lookup (for Alloy table)
  • 🎨Manage pages
    • Manage page types
    • Design 'View From' Page
    • Page Layouts
      • List Layout
      • Grid Layout
      • Card Layout
      • Map Layout
      • Checklist Layout
      • Calendar Layout
      • Kanban Layout
    • Design Canvas View Page
    • Canvas Charts
      • Line chart
      • Area Chart
      • Pie Chart
      • Donut Chart
      • Column chart vs. Stacked Column chart
      • Bar chart vs. Stacked bar chart
      • Table
    • Design Form of... Page
  • ⚙️Manage workflow
    • Introduce Workflow
    • Design a workflow
  • 🔌Manage Integration
    • Manage AppAlloy Integration
    • Manage Slack Integration
    • Manage Gmail Integration
    • Manage Google Drive Integration
    • Manage Google Calendar integration
  • 📱Manage App Settings
    • Manage app appearance
  • 🌎App distribution
    • Publish your app
    • Use app as Mobile Web app
    • Use app on AppAlloy Air
  • 🚹Account, team, and plan
    • Manage Account
    • Manage Apps
    • Manage Users
    • Manage Plans
    • Manage Teams
  • #️⃣Learn Power FX
    • Introduce Power FX
    • Operators & Identifiers
    • Formula References
      • Average
      • Concatenate
      • Date
      • DateAdd
      • DateDiff
      • DateValue
      • DateTimeValue
      • Day
      • If
      • Month
      • Now
      • Rand
      • RandBetween
      • Round
      • RoundDown
      • RoundUp
      • Sum
      • Text
      • Today
      • Weeknum
      • Weekday
      • Year
Powered by GitBook
On this page
  • Introduction
  • Settings
  • Title
  • Caption
  • Data
  • Style
  • X Axis
  • Y Axis
  • Series
  • Visibility

Was this helpful?

  1. Manage pages
  2. Canvas Charts

Area Chart

The Area Chart in AppAlloy is a powerful tool for visualizing the cumulative values over time.

Last updated 7 months ago

Was this helpful?

Introduction

This Area chart is ideal for understanding the magnitude of data changes and visualizing the proportion of different data series.

Suitable Use Cases:

  • Sales Growth: Track the total sales volume over time, showcasing both the trend and the overall sales magnitude.

  • Customer Retention: Analyze how customer engagement changes over time, with emphasis on the cumulative impact.

  • Revenue Analysis: Visualize revenue growth or decline across different periods, helping identify patterns and trends.

  • Project Progress: Monitor progress against goals by visualizing how the total project metrics evolve over time.

Settings

Title

The title provides a clear and concise label for the chart, helping users quickly understand what data is being represented.

Caption

The caption offers additional context or explanatory text for the chart. It may include information about the data source or key insights derived from the chart.

Data

Define the source and specifics of the data used for the chart. For instance, "from table 'Customer', show the number of new Customers in the last 6 months."

Style

Customize the appearance of the chart by selecting colors and deciding whether to display a legend as the explanation for each data part in the chart.

  • Color: Choose colors for the donut segments to differentiate between categories or to align with your branding.

  • Checkbox Legend: Decide whether to include an explanation below the chart that helps users identify what kind of data is shown on the chart

X Axis

Configure the horizontal axis to represent time or categories.

  • Axis Name: Label the axis to indicate what it represents

  • Axis Line Checkbox: Choose whether to display the first vertical line from the bottom of the chart as the line along the axis to improve clarity.

  • Axis Grid Line Checkbox: Decide whether to include grid lines in the chart area to aid in reading values.

Y Axis

Set up the vertical axis to display the values or measurements.

  • Axis Name: Label the axis to specify what the values represent.

  • Value Format: Choose how to format the values, such as Number, Currency, or Fraction.

  • Value Label Prefix: Add text before the value in the label, if necessary (e.g., "$" for currency).

  • Value Label Suffix: Add text after the value in the label, if necessary (e.g., "%" for percentages).

  • Axis Line Checkbox: Decide whether to display the first line to the left of the chart, along the axis as the clarification.

  • Axis Grid Line Checkbox: Choose whether to include grid lines on the inside area of the chart for better readability.

Series

Define the value label for each data point of the chart, including its format and labeling.

  • Value Format: Choose the format for the values, such as Number, Currency, or Fraction.

  • Value Label Prefix: Add text before the value in the label, if necessary.

  • Value Label Suffix: Add text after the value in the label, if necessary.

Visibility

Control the chart’s visibility based on specific conditions.

  • Settings:

    • Yes: Hide the chart.

    • No: Show the chart.

    • Use PowerFX: Set conditions to dynamically show or hide the chart based on criteria or user inputs.

🎨
The area chart shows the growth in sale per month in 2015, 2016, and 2017