-
Notifications
You must be signed in to change notification settings - Fork 0
/
sketch.js
144 lines (136 loc) · 4.3 KB
/
sketch.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
function setup() {
createCanvas(1050, 400);
}
let x_coord = 10;
let y_coord = 200;
let y_legend = 100;
let country = ['United States', 'China', 'Saudi Arabia', 'India', 'France', 'Russia', 'United Kingdom', 'Germany', 'Japan', 'South Korea'];
let militarySpending = [649, 250, 67.6, 66.5, 63.8, 61.4, 50, 49.5, 46.6, 43.1];
let exportRank = [1, 7, "n/a", 24, 3, 2, 8, 4, 35, 6];
let importRank = [13, 3, 1, 4, 31, "n/a", 18, 78, 11, 7];
function draw() {
background('rgb(51, 51, 51)');
textFont('Liberation Mono');
// Top legend
textSize(13);
noStroke();
fill('#f9e861');
square(10, 5, 20, 5);
fill('#ffffff');
text("Military spending in 2018 ($ b)", 50, 20);
stroke('#e0556e');
line(350, 15, 380, 15);
text("Arms exports rank in 2018", 400, 20);
stroke('#bc53ba');
line(650, 15, 680, 15);
text("Arms imports rank in 2018", 700, 20);
noStroke();
textSize(11);
text("Source: Stockholm International Peace Research Institute (sipri.org)", 10, 45);
strokeWeight(1);
stroke('#ffffff');
line(0, 70, windowWidth, 70);
textSize(16);
for(i=0; i < country.length; i++) {
if(i == 0) {
noStroke();
// square
fill('#f9e861');
square(x_coord, y_coord, militarySpending[i] * 0.25, 5);
// legend
fill('#ffffff');
text(country[i], x_coord, y_legend);
// arrange import and export ranks
y_er = y_coord + (exportRank[i] - 1) * 2.5;
y_etext = y_er -7
y_ir = y_coord + (importRank[i] - 1) * 2.5;
y_itext = y_ir -7
if(Math.abs(exportRank[i] - importRank[i]) < 5) {
if(importRank[i] < exportRank[i]) {
y_etext = y_er + 15;
} else {
y_itext = y_ir + 15;
}
}
// export rank
y_er = y_coord + (exportRank[i] - 1) * 2.5
stroke('#e0556e');
text(exportRank[i], x_coord, y_etext)
strokeWeight(2);
line(x_coord, y_er, x_coord + 30, y_er);
// import rank
y_ir = y_coord + (importRank[i] - 1) * 2.5
stroke('#bc53ba');
text(importRank[i], x_coord, y_itext)
strokeWeight(2);
line(x_coord, y_ir, x_coord + 30, y_ir);
noStroke();
} else {
if(i%2 == 0) {
// square
x_even = x_coord + i * 98 + country[i-1].length * 6;
fill('#f9e861');
square(x_even, y_coord, militarySpending[i] * 0.25, 5);
// legend
fill('#ffffff');
text(country[i], x_even, y_legend);
// arrange import and export ranks
y_er = y_coord + (exportRank[i] - 1) * 2.5;
y_etext = y_er -7
y_ir = y_coord + (importRank[i] - 1) * 2.5;
y_itext = y_ir -7
if(Math.abs(exportRank[i] - importRank[i]) < 5) {
if(importRank[i] < exportRank[i]) {
y_etext = y_er + 15;
} else {
y_itext = y_ir + 15;
}
}
// export rank
y_er = y_coord + (exportRank[i] - 1) * 2.5
stroke('#e0556e');
text(exportRank[i], x_even, y_etext)
strokeWeight(2);
line(x_even, y_er, x_even + 30, y_er);
// import rank
y_ir = y_coord + (importRank[i] - 1) * 2.5
stroke('#bc53ba');
text(importRank[i], x_even, y_itext)
strokeWeight(2);
line(x_even, y_ir, x_even + 30, y_ir);
noStroke();
} else {
// square
x_odd = x_coord + i * 98 + country[i-1].length * 5;
fill('#f9e861');
square(x_odd, y_coord, militarySpending[i] * 0.25, 5);
// legend
fill('#ffffff');
text(country[i], x_odd, y_legend + 50);
// arrange import and export ranks
y_er = y_coord + (exportRank[i] - 1) * 2.5;
y_etext = y_er -7
y_ir = y_coord + (importRank[i] - 1) * 2.5;
y_itext = y_ir -7
if(Math.abs(exportRank[i] - importRank[i]) < 5) {
if(importRank[i] < exportRank[i]) {
y_etext = y_er + 15;
} else {
y_itext = y_ir + 15;
}
}
// export rank
stroke('#e0556e');
text(exportRank[i], x_odd, y_etext)
strokeWeight(2);
line(x_odd, y_er, x_odd + 30, y_er);
// import rank
stroke('#bc53ba');
text(importRank[i], x_odd, y_itext)
strokeWeight(2);
line(x_odd, y_ir, x_odd + 30, y_ir);
noStroke();
}
}
}
}