The Pareto chart, named after Vilfredo Pareto, is a type of chart which contains both bars and a line. FusionCharts Suite XT allows you to configure several functional and cosmetic properties for the Pareto chart.
In this section you will be shown how you can:
Display values for the line series
Customize the line dataset
Hide secondary axis values
Show/hide the line chart
Displaying Values for the Line Series
By default, the auto-generated percentage values for the line chart are not rendered.
A pareto chart configured to render the percentage values for the line chart looks like this:
Given below is a brief description of the attribute that is used to show data values for the line series:
| Attribute Name | Description |
|---|---|
showLineValues |
It is used to specify whether the percentage data values will be shown for the line chart. Setting this attribute to 1 will show them, setting it to 0 (default) will hide them. |
The data structure needed to show percentage values for the line chart is given below:
Customizing the line dataset
A pareto chart with the line segments customized looks like this:
Given below is a brief description of the attributes used to customize the line segments:
| Attribute Name | Description |
|---|---|
lineColor |
It is used to specify the hex code for the color that will be used to render the line. |
lineThickness |
It is used to configure the thickness of the line, in pixels. |
lineAlpha |
It use to set the transparency for the line segments. This attribute takes values between 0 (transparent) and 100 (opaque). |
lineDashed |
It is used to specify whether the line segments will be rendered as dashed lines. Setting this attribute to 1 will render them as dashed lines, setting it to 0 will render them as whole lines. |
lineDashLen |
It is used to specify the length of each dash, if the line segments are to be rendered as dashed lines. |
lineDashGap |
It is used to specify the gap between each dash, if the line segments are to be rendered as dashed lines. |
The data structure needed to customize the line segments is given below:
Hiding Secondary Axis Values
A pareto chart with the secondary y-axis values hidden looks like this:
Given below is a brief description of the attributes used to hide the secondary y-axis values:
| Attribute Name | Description |
|---|---|
showSecondaryLimits |
It is used to specify whether the upper and lower limits for the secondary y-axis will be shown. Setting this attribute to 0 will hide the limits, setting it to 1 (default) will show them. |
showDivLineSecondaryValue |
It is used to specify whether the divisional line values for the secondary y-axis will be shown. Setting this attribute to 0 will hide the values, setting it to 1 (default) will show them. |
The data structure needed to hide the secondary y-axis values is given below:
Showing/Hiding the Line Chart
Given below is a brief description of the attribute used to show/hide the line chart:
| Attribute Name | Description |
|---|---|
showCumulativeLine |
It is used to specify whether the line chart will be rendered in the Pareto chart. Setting this attribute to 0 will hide the line chart, setting it to 1 (default) will show it. |
There! You have now seen how you can configure the Pareto chart.