Orientationscales
Orientationscales is a javascript library to create visual response scales for spatial orientation tasks in internet-based surveys.
Example
Instruction: Look at the left image. Imagine standing at the truck and looking at the horn. From your perspective, mark the position of the cap on the right circle.
Note: If the images are not loaded properly, try reloading the page.
1. Change Log
Orientationscales (version 0.1 beta) is a proof-of-concept to demonstrate that even more complex response formats can easily be created for online assessments.
2. License
Orientationscales is available under the GNU General Public License. It implements the javascript library wz_dragdrop.js and wz_jsgraphics by Walter Zorn published under the GPL as well.
The icons in the example above have been published by Panoramix under a free license.
3. Installation
- Include "wz_jsgraphics.js", "wz_dragdrop.js" and "orientationscales.js" AFTER the opening <body> tag:
<script type="text/javascript" src="wz_jsgraphics.js"></script> <script type="text/javascript" src="wz_dragdrop.js"></script> <script type="text/javascript" src="orientationscales.js"></script>
- Include the following line BEFORE the closing </body> tag:
<script type="text/javascript">init();</script>
- Create the scale:
var scale1 = new scale(); scale1.print();
These settings of the scale can be change:- scale1.name (string): name of the variable (=name of the hidden form element)
- scale1.circle.radius (int): circle radius
- scale1.circle.stroke (int): width of the circle line
- scale1.circle.color (string): circle color
- scale1.line.stroke (int): width of the horizontal line
- scale1.line.color (string): line color
- scale1.drawRefline (bool): display horizontal line
- scale1.refmarker.img (string): image for horizontal line
- scale1.refmarker.img_w (int): image width
- scale1.refmarker.img_h (int): image height
- scale1.center.img (string): image for center image
- scale1.center.img_w (int): image width
- scale1.center.img_h (int): image height
- scale1.center.img (string): image for center
- scale1.center.img_w (int): image width
- scale1.center.img_h (int): image height
- scale1.center.text (strint): text for image center
- scale1.center.text_size (int): font size
- scale1.center.text_family(string): font type
- scale1.center.text_stile (string): font style (e.g. BOLD, ITALIC)
- scale1.center.text_corrx (int): correction for x-coordinate
- scale1.center.text_corry (int): correction for y-coordinate
English
Deutsch
Post new comment