Hi Austin,
The ChartJS widget is indeed a struggle in the beginning. I will try to elaborate on the steps need to get you going.
- You should start with the set-up of the domain model as depicted in the documentation of the widget (Chart, Dataset and Datapoint entities, their attributes and associations).
- he ChartJS widget needs to be placed in a dataview on page. Usually I create a non-persistent entity, ChartWrapper, with a 1-1 association to the 'Chart' entity. Use a microflow as data source for the dataview containing the widget and create one object of the ChartWrapper.
Now we have to set-up the actual widget:
- On the data source tabpage of the widget select the 'Chart' entity as chart entity
- Create a microflow that will fill the widget with actual data.
Some steps that need to be taken in this microflow:
- Input parameter: ChartWrapper
- Create object: Chart and associate with the ChartWrapper
- Create a DataSet with label and color for each bar you want
- Create a microflow for the DataPoints (more on that later)
- Change the Chart object and associate(Add and NOT Set) all new datasets to the chart
Microflow with DataPoints: each DataPoint represents a bar of a certain DataSet in the chart. So if you would like a bar for every month in the year you will need to make 12 DataPoints associated with the DataSet (by association MultiplePoints). Each DataPoint needs to be filled with the following data:
- xvalue: the label on the x-axis (for example: the month of the year)
- xsortingvalue: the place of the bar (for example: for January you would like 1 etc.)
- yvalue: the actual value of the bar (and thus the height)
I hope this will help you!