The data was taken from the enjalot’s block and includes > 5000 different blocks. He parsed out hex codes, hsl(a), rgb(a), named colors (as found in this block) and the 4 different d3.scale.category.. color palettes in any html, js, css or coffee file found in each block. Because it is rather difficult to figure out which of the d3.scale.category.. colors were actually being used, the choice was made to include each color within the particular scale one time. This assumption was based on a visual inspection of all blocks that use these scales. There were 66500 different color statements in these blocks that make up 5957 unique colors.
I converted each color to its hex, rgb and hsl values and ran these through a Self Organizing Map clustering (I’ve been using SOM for a few years now to do all kinds of clustering, see my series of blog posts about it here). The clustering grouped similar colors together in 600 hexagons (based on their rgb and hsl values: 6 variables in total). The resulting map displays the “average” hex value and the size of each hexagon is scaled to the number of (the 66500) colors that are grouped in each hexagon. The biggest one, pure black, #000000, has 2700 entries. In essence it is an exercise in trying to map a 3D color space into a 2D plane while also looking at the nuances in colors used in blocks :)