HoshinoKoji/jsPsych
1
0
Fork 0
mirror of https://github.com/jspsych/jsPsych.git synced 2025-05-12 08:38:11 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Deployed 4a59c86 with MkDocs version: 1.1.2

Browse Source
This commit is contained in:
Becky Gilbert 2021-02-24 12:47:43 -08:00
parent 03d38da142
commit 0ecfcee475
2 changed files with 4 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
overview/eye-tracking/index.html
View File

@ -1427,7 +1427,7 @@
<h1 id="eye-tracking">Eye Tracking<a class="headerlink" href="#eye-tracking" title="Permanent link">&para;</a></h1>
<p>jsPsych supports eye tracking through the <a href="https://webgazer.cs.brown.edu/">WebGazer</a> library. WebGazer uses computer vision techniques to identify features of the participant's eyes via a webcam and predicts gaze location. The system is calibrated by having the participant click on or look at known locations on the screen. These locations are linked to eye features. Gaze location is predicted using regression.</p>
<h2 id="getting-started">Getting Started<a class="headerlink" href="#getting-started" title="Permanent link">&para;</a></h2>
<p>First, <a href="https://webgazer.cs.brown.edu/#download">download WebGazer.js </a> and include it in your experiment file via a <code>&lt;script&gt;</code> tag. You'll also need to include jsPsych's <a href="/extensions/jspsych-ext-webgazer.md">webgazer extension</a>.</p>
<p>First, <a href="https://webgazer.cs.brown.edu/#download">download WebGazer.js </a> and include it in your experiment file via a <code>&lt;script&gt;</code> tag. You'll also need to include jsPsych's <a href="../../extensions/jspsych-ext-webgazer/">webgazer extension</a>.</p>
<div class="highlight"><pre><span></span><code><span class="p">&lt;</span><span class="nt">head</span><span class="p">&gt;</span>
<span class="p">&lt;</span><span class="nt">script</span> <span class="na">src</span><span class="o">=</span><span class="s">&quot;jspsych/jspsych.js&quot;</span><span class="p">&gt;&lt;/</span><span class="nt">script</span><span class="p">&gt;</span>
<span class="p">&lt;</span><span class="nt">script</span> <span class="na">src</span><span class="o">=</span><span class="s">&quot;webgazer.js&quot;</span><span class="p">&gt;&lt;/</span><span class="nt">script</span><span class="p">&gt;</span>
@ -1446,12 +1446,12 @@
<span class="p">]</span>
<span class="p">})</span>
</code></pre></div>
<p>To help the participant position their face correctly for eye tracking you can use the <a href="/plugins/jspsych-webgazer-init-camera.ms">jspsych-webgazer-init-camera plugin</a>. This will show the participant what the camera sees, including facial feature landmarks, and prevent the participant from continuing until their face is in good position for eye tracking.</p>
<p>To help the participant position their face correctly for eye tracking you can use the <a href="../../plugins/jspsych-webgazer-init-camera/">jspsych-webgazer-init-camera plugin</a>. This will show the participant what the camera sees, including facial feature landmarks, and prevent the participant from continuing until their face is in good position for eye tracking.</p>
<div class="highlight"><pre><span></span><code><span class="kd">var</span> <span class="nx">init_camera_trial</span> <span class="o">=</span> <span class="p">{</span>
<span class="nx">type</span><span class="o">:</span> <span class="s1">&#39;webgazer-init-camera&#39;</span>
<span class="p">}</span>
</code></pre></div>
<p>To calibrate WebGazer, you can use the <a href="/plugins/jspsych-webgazer-calibrate.md">jspsych-webgazer-calibrate plugin</a>. This plugin allows you to specify a set of points on the screen for calibration and to choose the method for calibrating -- either clicking on each point or simply fixating on each point. The location of calibration points is specified in percentages, e.g., <code>[25,50]</code> will result in a point that is 25% of the width of the screen from the left edge and 50% of the height of the screen from the top edge. Options for controlling other details of the calibration are explained in the <a href="/plugins/jspsych-webgazer-calibrate.md">documentation for the plugin</a>.</p>
<p>To calibrate WebGazer, you can use the <a href="../../plugins/jspsych-webgazer-calibrate/">jspsych-webgazer-calibrate plugin</a>. This plugin allows you to specify a set of points on the screen for calibration and to choose the method for calibrating -- either clicking on each point or simply fixating on each point. The location of calibration points is specified in percentages, e.g., <code>[25,50]</code> will result in a point that is 25% of the width of the screen from the left edge and 50% of the height of the screen from the top edge. Options for controlling other details of the calibration are explained in the <a href="../../plugins/jspsych-webgazer-calibrate/">documentation for the plugin</a>.</p>
<p>Note that instructions are not included in the calibration plugin, so you'll likely want to use a different plugin (e.g., <code>html-button-response</code>) to display instructions prior to running the calibration. </p>
<div class="highlight"><pre><span></span><code><span class="kd">var</span> <span class="nx">calibration_trial</span> <span class="o">=</span> <span class="p">{</span>
<span class="nx">type</span><span class="o">:</span> <span class="s1">&#39;webgazer-calibrate&#39;</span><span class="p">,</span>
@ -1459,7 +1459,7 @@
<span class="nx">calibration_mode</span><span class="o">:</span> <span class="s1">&#39;click&#39;</span>
<span class="p">}</span>
</code></pre></div>
<p>To measure the accuracy and precision of the calibration, you can use the <a href="/plugins/jspsych-webgazer-validate.md">jspsych-webgazer-vaidate plugin</a>. Like the calibration plugin, you can specify a list of points to perform validation on. Here you can specify the points as either percentages or in terms of the distance from the center of the screen in pixels. Which mode you use will probably depend on how you are defining your stimuli throughout the experiment. You can also specify the radius of tolerance around each point, and the plugin will calculate the percentage of measured gaze samples within that radius. This is a potentially useful heuristic for deciding whether or not to calibrate again. Options for controlling other details of the validation are explained in the <a href="/plugins/jspsych-webgazer-validate.md">documentation for the plugin</a>.</p>
<p>To measure the accuracy and precision of the calibration, you can use the <a href="../../plugins/jspsych-webgazer-validate/">jspsych-webgazer-vaidate plugin</a>. Like the calibration plugin, you can specify a list of points to perform validation on. Here you can specify the points as either percentages or in terms of the distance from the center of the screen in pixels. Which mode you use will probably depend on how you are defining your stimuli throughout the experiment. You can also specify the radius of tolerance around each point, and the plugin will calculate the percentage of measured gaze samples within that radius. This is a potentially useful heuristic for deciding whether or not to calibrate again. Options for controlling other details of the validation are explained in the <a href="../../plugins/jspsych-webgazer-validate/">documentation for the plugin</a>.</p>
<div class="highlight"><pre><span></span><code><span class="kd">var</span> <span class="nx">validation_trial</span> <span class="o">=</span> <span class="p">{</span>
<span class="nx">type</span><span class="o">:</span> <span class="s1">&#39;webgazer-validate&#39;</span><span class="p">,</span>
<span class="nx">validation_points</span><span class="o">:</span> <span class="p">[[</span><span class="o">-</span><span class="mf">200</span><span class="p">,</span><span class="mf">200</span><span class="p">],</span> <span class="p">[</span><span class="mf">200</span><span class="p">,</span><span class="mf">200</span><span class="p">],[</span><span class="o">-</span><span class="mf">200</span><span class="p">,</span><span class="o">-</span><span class="mf">200</span><span class="p">],[</span><span class="mf">200</span><span class="p">,</span><span class="o">-</span><span class="mf">200</span><span class="p">]],</span>

BIN
sitemap.xml.gz
View File

Binary file not shown.