Game stats

It encodes all stats as sorted lollipop charts per section. We can change the sorting direction and the sorting base - as in either Time or Points. Apart from the usual D3-patterns there are 2 (noteworthy?) features implemented. The modal blurs the background with a CSS filter like so:

graphId can be animals or flags.data[graphId] is an array of objects with each object containing the stats we want to display (time, points, name of animal or flag etc.). So for each object we found (an animal or a flag) we create a pattern in an SVG defs tag with a unique ID. Within the pattern we append the respective image pulled out of our images folder…