sap-fiori-analytical-chart

SAP Fiori Analytical Chart

Purpose

Add analytical chart + table (hybrid view) to visualize aggregated data.

---

MANDATORY: Gather Required Inputs First

STOP and ASK the user for ALL of these inputs if ANY are missing from the prompt:

1. Entity - Which entity to add the analytical chart to
2. Dimension field - The field to group by (e.g., Category, Status, Destination)
3. Measure field - The numeric field to aggregate (e.g., Amount, TotalPrice, ReservationPrice)
4. Aggregation method - How to aggregate (see valid values below)
5. Chart type - Bar, Column, Line, Pie, HeatMap, Waterfall, HorizontalWaterfall
6. Display mode - How the chart should be shown:
   • Separate tabs (Approach 2)
   • Hybrid view (Approach 1)

DO NOT proceed with implementation until all inputs are confirmed.

---

CAP Implementation

Enable Aggregation

@Aggregation.ApplySupported: {
  Transformations: ['aggregate','groupby'],
  AggregatableProperties: [{Property: Amount}],
  GroupableProperties: [Category]
}

Aggregated Property

Analytics.AggregatedProperty #Amount_avg: {
  Name: 'Amount_avg',
  AggregatableProperty: Amount,
  AggregationMethod: 'average',
  ![@Common.Label]: 'Average Amount'
}

Valid AggregationMethod values (lowercase string):

• sum - Sum of the non-null values
• min - Smallest of the non-null values
• max - Largest of the non-null values
• average - Sum of non-null values divided by count of non-null values
• countdistinct - Count of distinct values, omitting null values

⚠️ CRITICAL: Must be a lowercase string (e.g., 'sum'), NOT an enum (e.g., #SUM). Using an enum will cause SQL generation errors.

Chart

UI.Chart #AnalyticalChart: {
  $Type: 'UI.ChartDefinitionType',
  Title: 'Chart Title',
  ChartType: #Column,
  Dimensions: [Category],
  DynamicMeasures: ['@Analytics.AggregatedProperty#Amount_avg'],
  MeasureAttributes: [{
    $Type: 'UI.ChartMeasureAttributeType',
    DynamicMeasure: '@Analytics.AggregatedProperty#Amount_avg',
    Role: #Axis1
  }],
  DimensionAttributes: [{
    $Type: 'UI.ChartDimensionAttributeType',
    Dimension: Category,
    Role: #Category
  }]
},
UI.PresentationVariant #ChartView: {
  $Type: 'UI.PresentationVariantType',
  Text: 'Chart View',
  Visualizations: ['@UI.Chart#AnalyticalChart']
},
UI.PresentationVariant #TableView: {
  $Type: 'UI.PresentationVariantType',
  Text: 'Table View',
  Visualizations: ['@UI.LineItem']
}