Documentation

Pie Chart

Description

A Pie Chart addon enables you to present a pie chart. This can be used both as a presentatoin/simulation or as an activity, where a student can change percentage values.

Properties

Property name Description
Is visible Enables to hide or show the module.
Items This section allows to enter all the details about every Item.
"Name" is only needed if the property “Show names” is selected.
"Color" defines the color of the item; if left empty, the color is taken from the CSS style.
"Starting percent" defines the percentage values at the beginning.
"Answer" is only needed if the property "Is Activity" is selected.
Step This property defines the step (in percent) by which a user can change the Items. It is equal to 1 if left empty.
Show values If this property is selected, the items' percentage values are shown.
Show names If this property is selected, the legend is displayed.
Is activity Enables to define whether the module is an activity or not.
Is disabled Allows to disable the module so that it won't be possible to change any item.
Radius size This property enables to change the graph radius in the module (a number between 0 and 1).
Percent positions This property enables to change the position where the values are displayed (a number between 0 and 1).

Scoring

Pie Chart addon allows to create exercises. To set the module in an excercise mode, choose the 'Is Activity' property. If the addon is not in an excercise mode, all the below methods return 0!

Property Description
maxScore 1
score 1 if all answers are correct, otherwise 0
errorCount 1 if all answers are correct, otherwise 1

Supported commands

Command name Params Description
disable --- Disables the addon.
enable --- Enables the addon.
show --- Shows the addon.
hide --- Hides the addon.
reset --- Resets the addon.
isAttempted --- Returns true if a user tries to solve the module.
isAllOK --- Returns true if all items have correct values, otherwise false.
isOK index Returns true if the chosen item has the correct value, otherwise false.
getPercent --- Returns the value of the chosen item.

Events

OnValueChanged Event

This event contains the following fields:

Field name Description
source module ID
item N/A
value N/A
score 1 when the addon has a correct answer, otherwise 0

CSS classes

Class name Description
.piechart DIV containing the pie chart
.disabled additional class for a disabled addon
.correct additional class for the addon solved correctly
.wrong additional class for the addon solved incorrectly
.graph indicates the look of the graph
.line indicates the look of the line
.item, .itemX indicates the color of an Item (X is the number of the item) and its color in the legend
.legend describes the style for the legend
.legendItem indicates the look of the items in the legend
.legendSquare indicates the look of the colored square in the legend
.legendText indicates the look of the items' names in the legend
.percentsValues indicates the look of the percentage values on the pie chart

Demo presentation

Demo presentation contains examples on how to use the Pie Chart addon.