Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revisionPrevious revision
Next revision
Previous revision
Last revisionBoth sides next revision
en:create:feedback-visual [04.04.2019 23:14] adminen:create:feedback-visual [12.06.2022 13:51] – [Multiple Values (II)] christina.treppy
Line 1: Line 1:
-====== Personal evaluation for the participant ======+====== Individual Feedback for Participants ======
  
  
 Using the functions ''[[:en:create:functions:value]]'', ''[[:en:create:functions:valueMean]]'', the participant's answers can already be evaluated during the Questionnaire session (also see [[:en:create:points]]). Some questions, like for instance [[:en:create:questions:IAT]], deliver an evaluation directly. Additionally, with the help of ''[[:en:create:functions:statistic]]'' function, it is possible to evaluate values of all the previously tested participants. Using the functions ''[[:en:create:functions:value]]'', ''[[:en:create:functions:valueMean]]'', the participant's answers can already be evaluated during the Questionnaire session (also see [[:en:create:points]]). Some questions, like for instance [[:en:create:questions:IAT]], deliver an evaluation directly. Additionally, with the help of ''[[:en:create:functions:statistic]]'' function, it is possible to evaluate values of all the previously tested participants.
  
 +**Note:** This tutorial shows how feedback can be displayed within or at the end of a questionnaire. Using the additional [[:en:results:analyses|automatic data analysis]] module, it is possible to provide a PDF with a personal feedback for download, see [[:en:results:report]].
 +
 +**Note:** Instructions on how to give feedback on individual questions (correct/incorrect) can be found in a separate tutorial: [[:en:create:feedback-correct]]
 +
 +**Note:** Another tutorial explains how to provide a print view of a participant's own answers ("print/save my questionnaire"): ''[[:en:create:functions:answersprint]]''
  
 ===== Presenting outcome as text ===== ===== Presenting outcome as text =====
Line 50: Line 55:
 ==== Multiple Values ==== ==== Multiple Values ====
  
-Multiple values are commonly displayed in a table. The easiest way to do this is with text-blocks and placeholders.  For instance you could save the following HTML code under  **Textblocks and Labels** inside a new textblock //results//.+Multiple values are commonly displayed in a table. The easiest way to do this is with text-blocks and placeholders. For instance you could save the following HTML code under **Textblocks and Labels** inside a new textblock //results// ("HTML code" representation).
  
 <code html> <code html>
Line 91: Line 96:
 {{:de:create:exp.feedback-visual.textelement.png?nolink|An example for visual presentation of a single value}} {{:de:create:exp.feedback-visual.textelement.png?nolink|An example for visual presentation of a single value}}
  
-Save the following HTML code as a textblock, for example under the identifier "responseSD".+Save the following HTML code as a text in the list fo questions (the following examples assume that it gets the ID "RS01").
  
 <code html> <code html>
Line 125: Line 130:
 // Use textblocks (only if $value delivered a valid value) // Use textblocks (only if $value delivered a valid value)
 if ($value > 0) { if ($value > 0) {
-  show('responseSD', array(+  show('RS01', array(
     '%title%' => 'Extraversion',     '%title%' => 'Extraversion',
-    '%zValue100%' => round($zValue * 100)+    '%zValue%' => (string)round($zValue * 100)
   ));   ));
 } }
Line 138: Line 143:
 ==== Multiple Values (II) ==== ==== Multiple Values (II) ====
  
-As long as the //Highcharts// plug-in is available on the questionnaire server, you can use the Highcharts library to display nifty diagrams in your questionnaire. As long as the category labels are saved in the array ''$labels'', the results are saved in the array ''$ownData''and reference data in the array ''$refData'', you can use the following text block "chart(//Darstellung// "HTML_Code") and the associated PHP code to display a bar chart. You can find clarifications and details  at [[http://www.highcharts.com/docs|Highcharts Dokumentation]].+You can use the ChartJS library to display nifty diagrams in your questionnaire. If the category labels are saved in the array ''$labels'', the results are saved in the array ''$ownData'' and reference data is saved in the array ''$refData'', you can use the following text (in the example it has the identifier "CH01", as //Darstellung// "HTML_Code") and the associated PHP code to display a bar chart. You can find clarifications and details at [[https://www.chartjs.org/|ChartJS Documentation]].
  
 <code html> <code html>
 <!-- Container for the diagram --> <!-- Container for the diagram -->
-<div id="chartstyle="height: 600px"></div>+<canvas id="myChartwidth="400" height="300"></canvas>
  
-<script type="text/javascript" src="../plugins/highcharts/highcharts.js"></script> 
 <script type="text/javascript"> <script type="text/javascript">
 <!-- <!--
  
-$(function () +var chartCanvas = document.getElementById('myChart').getContext('2d')
-    $('#chart').highcharts({ +var chart01 = new Chart(chartCanvas, 
-        chart:+    type: 'line', 
-            type: 'bar' +    data: { 
-        }+        labels: %labels%, 
-        title: { +        datasets[
-            text: null +            label: 'Ihr Wert', 
-        }, +            data%ownData%
-        xAxis: { +            backgroundColor: '#FF9900', 
-            categories: %labels%+            borderColor: '#FFCCAA', 
-            title: { +            pointRadius8 
-                text: null +        }, { 
-            } +            label: 'Durchschnitt',
-        }+
-        plotOptions:+
-            bar: { +
-                dataLabels: { +
-                    enabled: true +
-                } +
-            } +
-        }, +
-        legend: { +
-            layout: 'horizontal', +
-            align'center'+
-            verticalAlign: 'bottom', +
-            floatingfalse, +
-            borderWidth: 0, +
-            backgroundColor: ((Highcharts.theme && Highcharts.theme.legendBackgroundColor) || '#FFFFFF')+
-            shadowfalse +
-        }, +
-        credits: { +
-            enabled: false +
-        }, +
-        series: [+
-            name: 'Average',+
             data: %refData%,             data: %refData%,
-            color: '#BBBBBB', +            backgroundColor: '#AAAAAA', 
-            dataLabels: { +            borderColor: '#DDDDDD', 
-                enabledfalse+            pointRadius:
 +        }] 
 +    }, 
 +    options: { 
 +        indexAxis: 'y', 
 +        scales: { 
 +            x: { 
 +                beginAtZerotrue
             }             }
-        }, { +        } 
-            name: 'Your Value', +    }
-            data: %ownData%, +
-            color: '#009900', +
-            dataLabels: { +
-                enabled: false +
-            } +
-        }] +
-    }); +
 }); });
  
Line 205: Line 186:
  
 <code php> <code php>
-// Make jQuery library available +// Make ChartJS library available 
-option('script', 'jQuery 1.x')+library('ChartJS'); 
-// Bind the textblock with the HTML code for the chart + 
-text('chart', array(+// Test data (here you would read data from the dataset) 
 +$labels = ['Motivation', 'Engagement', 'Qualifikation']; 
 +$ownData = [57, 42, 80]; 
 +$refData = [52, 48, 74]; 
 + 
 +// Include text module with the HTML code for the chart 
 +show('TX09', [
   '%labels%' => json_encode($labels),   '%labels%' => json_encode($labels),
   '%ownData%' => json_encode($ownData),   '%ownData%' => json_encode($ownData),
   '%refData%' => json_encode($refData)   '%refData%' => json_encode($refData)
-));+]);
 </code> </code>
en/create/feedback-visual.txt · Last modified: 07.12.2023 07:01 by admin
 
Except where otherwise noted, content on this wiki is licensed under the following license: CC Attribution-Share Alike 4.0 International
Driven by DokuWiki