Starting with AEM Forms 6.4, we now have the ability to insert charts in Interactive Communications. The following video walks through the steps involved in configuring chart component.

To use Charts or Table component in your Interactive Communication Document, you must have a repeating set of data for populating the Chart of Table component.

The following is the snippet of data that is being returned by the Form Data Model Service.

 "modelAssetMix": [ {"percentage": 70,"assetType": "Stocks" },{"percentage": 20,"assetType": "Bonds"},{"percentage": 10, "assetType": "Cash"}] .

You can add a chart component to the target area or panel component defined in the Interactive Communication Document. Once you add the chart component, you will configure the chart component to specify the following properties

  • Chart Type - Bar or Pie etc.
  • Specify Titles for X and Y axis.
  • Bind the Data Model Objects for the X and Y axis.

 

To test this capability on your serve, please follow the steps below

  • Set up tomcat with SampleRest.war as explained here
  • Download the zip file containing the assets related to this article on to your hard drive
  • Import WebChannelAssets.zip using a package manager. you will get the following
    • Interactive Communication(Web Channel)
    • Form Data Model which depends on tomcat for the data source
  • Open the Interactive Communication Document in edit mode and add the chart component as described in the video

 

Download

This work is licensed under a Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License  Twitter™ and Facebook posts are not covered under the terms of Creative Commons.

Legal Notices   |   Online Privacy Policy