Line Chart

Animated line chart with smooth curves and interactive points

A fully animated line chart component for time-series data visualization. Features smooth curves, area fill, interactive data points, and both light and dark themes. Perfect for dashboards and analytics screens.

Smooth curves Area fill Interactive points Light/Dark themes Auto-scaling Skeleton loading

Key Properties

Items[Table]

Series"Sales"

Labels"Month"

Theme"Light" | "Dark"

LineColor"#ffb300"

AreaFilltrue | false

Animatedtrue | false

ShowDotstrue | false

Requires Modern controls enabled. Go to Settings → Updates → Preview → Modern controls and themes.

Component YAML

Copy-paste ready

# Line Chart Component v2.0.0
# Copy this YAML directly into Power Apps

LineChart:
  Type: "CanvasComponent"
  Version: "2.0.0"
  Description: "Animated line chart with smooth curves"
  
  Properties:
    Items: "YourDataSource"
    Series: "ValueColumn"
    Labels: "LabelColumn"
    Theme: "Light"  # or "Dark"
    LineColor: "#ffb300"
    AreaFill: true
    Animated: true
    ShowDots: true
    Height: 300
    Width: 500
    Padding: 20

  Controls:
    - Control: "Gallery"
      Name: "DataGallery"
      Items: "Parent.Items"
      
    - Control: "Label"
      Name: "TitleLabel"
      Text: "Monthly Sales"
      FontSize: 16
      FontWeight: "Bold"

    - Control: "Chart"
      Name: "LineChart"
      Type: "Line"
      Items: "Parent.Items"
      Series: "Parent.Series"
      Labels: "Parent.Labels"
      LineColor: "Parent.LineColor"
      AreaFill: "Parent.AreaFill"
      Animated: "Parent.Animated"
      ShowDots: "Parent.ShowDots"

Line Chart

Key Properties

Component YAML

Related Components

Pie Chart

Bar Chart

KPI Cards