# Graphical Answer

## Graphical answer

The graphic answer type aims to allow questions with an answer requiring the student to draw something on a canvas instead of selecting an option or writing an algebraic expression. With this feature, students will be able to draw points, lines, circles, conic sections, and more, and the new evaluation criteria will do the rest!

### Graphic question type

When the *Graphic* option is selected, the drawing tool replaces the equation editor. Using the upper toolbar, you may readily draw the correct answer to the question.

This question type has several options, including different *Statistical graphs* as bar charts, line charts and pie charts. We will analyze the user interface when the *Standard* option is selected on this page. You can see more details regarding how you can use statistical graphs here.

Bear in mind students will use the same toolbar (or a reduced version) to answer the question. They will also be able to use the handwriting to do so, and you can see more details here.

#### Initial content

It's also possible to include initial content for the students. It can be beneficial when, for instance, we want them to indicate some elements of a given object.

As a brand new option of WirisQuizzes, it's also possible to import information from the initial content to the correct answer or vice-versa. Thus, you can build the corresponding graph once, and it will appear automatically on the right answer, ready to be edited.

### Input options

In the *Input options* screen, you can control how the *toolbar* provided to the students is displayed and the offered *auxiliary input*.

#### Customize toolbar

Sometimes, we may not provide the student with all the graph resources. In the *Customize toolbar* section, you can define which will be shown in the student's graph by simply checking or unchecking the corresponding box. They are all selected by default.

The graph resources are divided into five sections explained below: toolbar, menu, floating, contextual (elements), and contextual (labels).

##### Toolbar

The *Toolbar* is at the core of many of the graph's possibilities. You can hide some icons to facilitate the research of those the students need or make the problem's resolution a little bit more complicated.

Element | Description | Icon |
---|---|---|

Select | To select objects and see their algebraic expression and modify their properties. | |

Handwriting | To handwrite any of the existing objects. See how here. | |

Point | To draw a single point. | |

Lines | Line: To draw a line passing through two given points. | |

Segment: To draw a segment between two given points. | ||

Ray: To draw a ray given a starting point and a direction. | ||

Vector: To draw a vector given a starting point and a direction. | ||

Parallelogram: To draw a parallelogram given a starting point and two different directions. | ||

Polyline: To draw a polyline given an ordered set of points. | ||

Polygon: To draw a polygon given a closed ordered set of points. | ||

Conic sections | Circle by centre and point: To draw a circle given its centre and a belonging point. | |

Circle by three points: To draw a circle passing through three given points. | ||

Arc: To draw an arc of circumference. | ||

Parabola: To draw a parabola given a directrix line and its centre. | ||

Ellipse: To draw an ellipse given an axis and a belonging point. | ||

Hyperbola: To draw a hyperbola given. | ||

Conic: To draw a general conic section given five belonging points. | ||

Measures | Area: To fill an enclosed region and calculate its area. | |

Angle: To calculate the counterclockwise angle between two given elements. | ||

Length: To calculate the length of a bounded unidimensional element. | ||

Label | To include any label within the plotter. | |

Expression | To include the graphic representation of any mathematical expression. | |

Undo | To undo the last performed action. | |

Redo | To redo the last erased action. |

##### Floating

The *Floating* elements are thought to facilitate the students' view of the plotter and make the content creation more comfortable.

Element | Description | Icon |
---|---|---|

Zoom in | To zoom in the plotter. | |

Zoom out | To zoom out the plotter. | |

Anima | To make the elements apparition dynamic. The different objects of the answer will appear one by one in its creation order. | |

Maximize | To maximize (or minimize) the plotter. |

##### Contextual (elements)

The *Contextual (elements)* options enable the capability of modifying a plotted object appearance.

Element | Description | Icon |
---|---|---|

Fix label | To fix the algebraic expression of the represented object | |

Line width | To modify the line width of the represented object | |

Line style | To modify the line style of the represented object | |

Line colour | To modify the line colour of the represented object | |

Delete | To delete the represented object |

##### Contextual (labels)

The *Contextual (labels)* enables the capability of representing a function by giving its algebraic expression or including any text in the plotter. The labels in grey are only available if we are introducing a mathematical expression.

Element | Description | Icon |
---|---|---|

Bold | To write text in bold. | |

Italic | To write text in italics. | |

Colour | To write text in any of the available colours. | |

Big fraction | To add a fraction | |

Superscript | To add a superscript. | |

Square root | To add a square root. | |

Root | To add a generic root. | |

Number | To add the irrational numbers $\mathrm{normal\pi}$ or $\mathrm{normale}$ | |

Functions | To add any of the available functions ($\mathrm{sin}$, $\mathrm{tan}$, $\mathrm{log}$, …) | |

Delete | To delete the written text or formulas |

#### Answer input method

Here, you can choose what kind of additional entry you want to offer to the students.

There are four options:

**Display auxiliary CalcMe**: You can supply your students with our online calculator while answering the question and set initial content for the calculator if desired. Keep in mind that the calculator can do a lot more than numerical computations!**Replace answer input with auxiliary CalcMe**: You can replace the answer input field with an additional CalcMe calculator for the student answer.**Display auxiliary text field**: You can provide your students with a text editor to make them include the reasoning they have followed to answer the question. For more details, see this page: Auxiliary input.**Don't show auxiliary input**: Don't show the additional CalcMe calculator nor the auxiliary text editor in the input field for the student's answer.

### Validation options

The validation options field allows to define us how we want to evaluate the student's answer. This section is divided into two sections explained below.

#### Elements

The *Elements* subsection is thought to select the elements in answer to be evaluated. By default, all the elements will be taken into account, and they will have to match the student answer to be graded correctly.

On the other hand, it's also possible to distribute the grade among those selected elements if we want to consider partial grading.

#### Criteria

The *Criteria* subsection is thought to set the amount of error allowed between the student answer and the correct answer. Moreover, it's also possible to consider some additional properties explained below.

Prohibit superfluous elements in the student answer: There can't be more elements in the student answer than in the correct answer.

Match color: The elements in the student answer must have the same color as in the correct answer.

Match line type: The elements in the student answer must have the same line type as in the correct answer.

### Example: Perpendicular line

Imagine creating a question asking to draw, given the line $y=2x+1$, its perpendicular line through the point $(4,0)$. To do so, we have to start defining the initial content. You can use the *line* icon or introduce its algebraic expression.

Once we have defined the initial content, we must move on to the *Correct answer* field and define the perpendicular line.

Then, we need to define which elements we want the students to use to answer. As they have to draw a line, we may be only interested in keeping the *line* icons and the *expression* option.

Finally, we have to define the validation properties that we want to consider to correctly grade the students' answers. We will only validate the solution if it matches the perpendicular line.

We can preview the question by clicking the *Test the question*. Thus, we can verify if it's working as we expected.

## Statistical graphs

Teachers can now add statistical graphs to a short-answer question type and ask students to answer by interacting with the dynamic graph. The following statistical representations are available: bar chart, line chart and pie chart.

All statistical charts designed within WirisQuizzes are interactive and customizable, and our software system automatically evaluates assessments with graphical statistical questions.

### Bar charts

A bar chart is a diagram in which the numerical values of variables are represented by the height or length of lines or rectangles of equal width. This type of graphical representation is now supported by WirisQuizzes Instructors can now create dynamic bar charts as initial content and ask the students to answer questions by interacting with the chart.

#### Bar chart toolbar

You will now be able to add and edit bars but also packs to each bar.

##### Vertical and horizontal orientation

Alter the orientation of your bar graph, from vertical to horizontal.

##### Add new bar packs

With the add packs button, you will be able to add as many packs of bars as you wish and label them individually with the tag you consider.

##### Add groups to bar packs

With the add groups button, you will be able to add as many groups as you wish to the bar packs. These groups will automatically appear in different colours.

##### Groups positioning

Alter the positioning of your bar graph groups, from stacked to grouped.

##### Delete groups

Delete a group by clicking on delete group on the lower toolbar menu. This option does not delete packs of bars.

##### Delete bar packs

Delete an entire bar pack by clicking on the delete pack button on the lower toolbar menu. This option will also delete all packs included in the bar group.

### Line charts

A line chart or line plot or line graph or curve chart displays information as a series of data points called 'markers' connected by straight line segments. It's a primary type of chart typical in many fields. This type of graphical representation is now supported by WirisQuizzes Instructors can now create dynamic line charts as initial content and ask the students to answer questions by interacting with the chart.

#### Line chart toolbar

You will now be able to add and edit lines, but also line points.

##### Vertical and horizontal orientation

Alter the orientation of your line graph, from vertical to horizontal, with the orientation button.

##### Add group of points

With the add group of points, you will be able to add as many groups of points as you wish within the same lines you’ve established and label them individually with the tag you consider.

##### Add lines

With the add lines, you will be able to add as many lines as you wish to the line groups. With the add line button, you’ll add as many group points as established previously in the other lines.

##### Delete lines

Delete a full line of points by clicking on the delete line button on the lower toolbar menu. This option will not delete a full group of points/labels.

##### Delete group of points

Delete a group of points by clicking on the delete points button on the lower toolbar menu. This option will delete the full group of points, hence the entire label.

### Pie charts

A pie chart is a circular statistical graphic divided into slices to illustrate numerical proportion. In a pie chart, the arc length of each piece is proportional to the quantity it represents. This type of graphical representation is now supported by WirisQuizzes Instructors can now create dynamic pie charts as initial content and ask the students by interacting with the chart.

#### Pie chart toolbar

You will now be able to add and edit pie sections.

##### Add new pieces

With the add piece button, you will be able to add as many pie pieces as you wish within the same pie and label each pie piece individually with the tag you consider.

##### Visualize in 2D or 3D

With the 2D/3D button, you will be able to visualize your pie chart either in 2D or 3D.

##### Delete pieces

Delete a piece of the pie chart by clicking on the delete pie button on the lower toolbar menu.