Skip to content

Instantly share code, notes, and snippets.

@emily-wasserman
Last active June 27, 2017 21:56
Show Gist options
  • Save emily-wasserman/2e4a30c4ffaa494adcec11b3bfd5d0ff to your computer and use it in GitHub Desktop.
Save emily-wasserman/2e4a30c4ffaa494adcec11b3bfd5d0ff to your computer and use it in GitHub Desktop.
Trait Judgment Task Performance Under Cognitive Load

A visualization of how working memory load impacts a Trait Judgment task. Subjects viewed 36 trait-judgment trials, of which 6 were "load" trials. "Load" trials were interspersed with letters, and subjects were asked to recall the letters at the end of the set.

Data visualization

Displays average score (percent correct) in load/no load sets for each of 42 participants. Horizontal lines indicate overall mean score for load (red) and no load (blue). Cognitive load did not have any significant effect on trait judgment performance.

This project lives at the Open Science Framework.

subject_id mean_noload mean_load
0 1 0.6333333333333333 0.6666666666666666
1 2 0.6 0.8333333333333334
2 5 0.6 0.5
3 6 0.5333333333333333 0.5
4 8 0.6666666666666666 0.5
5 9 0.6666666666666666 0.5
6 11 0.7 0.6666666666666666
7 12 0.6666666666666666 0.6666666666666666
8 13 0.6333333333333333 0.6666666666666666
9 14 0.7 0.5
10 15 0.6 0.6666666666666666
11 16 0.5333333333333333 0.5
12 17 0.5333333333333333 0.5
13 18 0.5333333333333333 1.0
14 19 0.6666666666666666 0.3333333333333333
15 20 0.6333333333333333 0.6666666666666666
16 21 0.6 1.0
17 22 0.4666666666666667 0.5
18 23 0.5 0.8333333333333334
19 24 0.6333333333333333 0.3333333333333333
20 25 0.6333333333333333 0.8333333333333334
21 26 0.6333333333333333 0.5
22 27 0.5666666666666667 0.5
23 28 0.5 0.8333333333333334
24 29 0.6 0.6666666666666666
25 30 0.43333333333333335 0.6666666666666666
26 31 0.6 0.5
27 32 0.6666666666666666 0.6666666666666666
28 33 0.7 0.6666666666666666
29 34 0.7 0.3333333333333333
30 35 0.5666666666666667 0.8333333333333334
31 36 0.5333333333333333 0.8333333333333334
32 37 0.6666666666666666 0.6666666666666666
33 38 0.5333333333333333 0.6666666666666666
34 39 0.5666666666666667 1.0
35 40 0.5 0.8333333333333334
36 41 0.7 0.5
37 42 0.6333333333333333 0.5
38 43 0.6 0.6666666666666666
39 44 0.7 0.5
40 45 0.6 0.8333333333333334
41 46 0.5333333333333333 0.16666666666666666
<html>
<style>
.bar1 {fill: steelblue;}
.bar2 {fill: red;}
text {font-family: sans-serif;}
</style>
<div id="chart_cont">
<script src="http://d3js.org/d3.v4.min.js"></script>
<script type="text/javascript">
var margin = {left: 50, top: 100, bottom: 50};
var width = 800 - margin.left,
height = 600 - margin.top - margin.bottom;
var svg = d3.select("body")
.append("svg")
.attr("width", 800)
.attr("height", 600);
svg.append("text")
.text("Trait Judgment Scores (%) Under Cognitive Load")
.attr("y",margin.top/4)
.attr("x",margin.left/2)
.style("font-size","30px");
var legend = svg.append("g")
.attr("class","legend")
.attr("transform","translate("+margin.left+','+margin.top/2+")");
legend.append("rect")
.attr("width",15)
.attr("height",15)
.attr("fill","steelblue")
.attr("opacity",0.5);
legend.append("rect")
.attr("width",15)
.attr("height",15)
.attr("fill","red")
.attr("transform","translate(150,0)")
.attr("opacity",0.5);
legend.append("text")
.text("No load")
.attr("transform","translate(20,13)");
legend.append("text")
.text("Load")
.attr("transform","translate(170,13)")
var x = d3.scaleBand().rangeRound([0, width]).padding(0.1),
y = d3.scaleLinear().rangeRound([height, 0]);
var g = svg.append("g")
.attr("transform", "translate(" + margin.left + "," + margin.top + ")");
d3.csv("./data_traitjudg_means.csv",function(data) {
x.domain(data.map(function(d) { return d.subject_id; }));
y.domain([0, 1]);
g.append("g")
.attr("class", "axis axis--x")
.attr("transform", "translate(0," + height + ")")
.call(d3.axisBottom(x));
g.append("g")
.attr("class", "axis axis--y")
.call(d3.axisLeft(y));
svg.append("text")
.attr("text-anchor","middle")
.attr("transform","translate(" + (margin.left/3) + "," + (margin.top + height/2) + ")rotate(-90)")
.text("Mean Score (%)");
svg.append("text")
.attr("text-anchor","middle")
.attr("transform","translate(" + (margin.left + width/2) + "," + (height + margin.top + margin.bottom/1.5) + ")")
.text("Subject ID");
svg.append("line")
.attr("x1",""+margin.left)
.attr("y1",margin.top+(height-y(1-0.63)))
.attr("x2","800")
.attr("y2",margin.top+(height-y(1-0.63)))
.attr("stroke","red");
svg.append("line")
.attr("x1",""+margin.left)
.attr("y1",margin.top+(height-y(1-0.6)))
.attr("x2","800")
.attr("y2",margin.top+(height-y(1-0.6)))
.attr("stroke","steelblue");
var barg = g.selectAll(".bar")
.data(data)
.enter().append("g")
barg.append("rect")
.attr("class", "bar1")
.attr("x", function(d) { return x(d.subject_id); })
.attr("y", function(d) { return y(+d.mean_noload); })
.attr("width", x.bandwidth())
.attr("height", function(d) { return height - y(+d.mean_noload); })
.attr("opacity",0.5);
barg.append("rect")
.attr("class", "bar2")
.attr("x", function(d) { return x(d.subject_id); })
.attr("y", function(d) { return y(+d.mean_load); })
.attr("width", x.bandwidth())
.attr("height", function(d) { return height - y(+d.mean_load); })
.attr("opacity",0.5);
});
</script>
</div>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment