Single Chart Work flow

Bindable Properties

  1. extData
  2. extType
  3. extRunTimeChartTypes
  4. extOptions
  5. instanceCallback
  6. evtClickCallback

Overview

Basic Chart component.

Features/Functionality

  • Chart can be drawn by giving data.
  • Types of charts can be changed on run time.
  • Component is container responsive.
  • It is cross browser compatible. (IE11, Edge, Firefox, chrome).

Defaults

  • Default type will be taken as 'bar'.

Breakdown

  • Set defaults.
  • OnPageLoad:
    • Import chart library.
    • After importing if type selected is card then make the value of first time card loading var as true.
    • Else call createChart method.
  • Create Chart:
    • Get chart type options by calling getChartTypeOptions method.
    • Set chart colors by calling setChartColors method.
    • Draw chart by calling drawChart method.
  • On click of run time chart icons:
    • Set new type value.
    • If new type is card, then set variable value.
    • Else call createChart method.
  • On click of chart, call click callback method.
  • Reset method can be called directly by page using instance to empty all the chart information.