definition

Property description

The definition property defines the chart type and how it visualizes data. Dawiso supports Chart.js chart definitions for versions 4.4.3 and newer.

Example

Minimal JSON

{}

{
    "type": "api-chart",
    "definition": {
        "type": "line",
        "options": {
            "maintainAspectRatio": false,
            "plugins": {
                "legend": {
                    "display": false
                }
            },
            "scales": {
                "y": {
                    "beginAtZero": true
                },
                "x": {
                    "grid": {
                        "display": false
                    }
                }
            }
        }
    }
}

Example taken from the core_dashboard_adoption package.

Nested properties

Property	Description	Values	Mandatory
`type`	Chart type. See supported `type` values. Note that area, bubble, and scatter chart types are not supported.	string	No
`options`	Additional properties adjusting the chart. See supported `options` values.	json	No

Supported `type` values

See examples of each type in the screenshot above.

Value	Description
`bar`	Represents data values as vertical bars.
`doughnut`	Represents data similarly to a pie chart but with a cut-out in the middle.
`line`	Represents data values as points on a line.
`pie`	Represents data values proportionally as sections of a circle.
`polarArea`	Represents proportional value of data in a circle with varying radiuses.
`radar`	Represents data as points stacked at an axis with the same central point.

Supported `options` values

Using the options property, you can configure, e.g.:

Responsiveness: Responsiveness of the chart in different window sizes, e.g., maintainAspectRatio. For more information, see Responsive Charts in the Chart.js documentation.
Plugins: Customize the default behavior of a chart, e.g., disabling the legend "legend": { "display": false }. For more information, see Legend in the Chart.js documentation.
Scales: Configure the x and y axes in a chart (or r for radial charts). For more information, see Axes in the Chart.js documentation.