Implementing Chart.ctrl

Implementing Chart.ctrl

WebClient supports displaying data in several basic charts based on the C3 and D3 JavaScript libraries. Chart.ctrl now allows you to display your data in pie, donut, line, bar, and spline chart formats. The grid should have exactly two columns of data. First, the label. Second, the quantitative data.


To implement it, the control name of the grid should follow the format below.
<grid control name>:<attachpoint>:template=Chart:chartType=<chart type>:default

For example:

Grid1P:MainArea:template=Chart:chartType=donut:default

The currently supported chart types are pie, donut, line, bar and spline.

Donut Chart


Pie Chart


Bar Chart


Line Chart


Spline Chart

C3 Library Reference: https://c3js.org/examples.html

    • Related Articles

    • Implementing the WebImageGallery custom template

      This custom template is based on galleriajs and it is applying to a Grid control. Its functionality consists of displaying a gallery of images extracted from webproject/WebContent/images folder. To implement this control please follow the steps ...

    • How to Implement Outlook Style Calendar View Using EventCalendar.ctrl

      Create a grid function with the following fields. Event Id (Column Heading=Event Id) StartDate (Column Heading=Start Date) StartTime (Column Heading=Start Time) EndTime (Column Heading=End Time) Event Description (Column Heading=Summary) ViewType ...

    • CM WebClient 1.8.8 Release Notes

      Download current GA Release : Download CM WebClient 1.8.8 WebClient Mobile Updates To see the latest updates of WebClient Mobile, please visit: WebClient Mobile repository. What's New? Support Java 11 Complete functionality of DojoTimePicker.ctrl to ...

    • Web Controls

      What Are the Different Types of Controls? Include files (*.inc)   are evaluated within the referencing template and can be useful for repeated blocks of code. They can have parameters, such as :nc (do not evaluate comments) or :parameterName=pValue ...

    • Dashboard Overview

      This document will cover the basics of the CM evolveIT Dashboard. There will be a review of the different parts of the dashboard, how to customize the dashboard for personal viewing.   After completing this document, you should have a basic ...