{"id":13,"date":"2008-05-12T23:59:43","date_gmt":"2008-05-13T04:59:43","guid":{"rendered":"https:\/\/thinkstick.dreamhosters.com\/?p=13"},"modified":"2008-05-12T23:59:43","modified_gmt":"2008-05-13T04:59:43","slug":"algorithm-to-generate-tag-clouds","status":"publish","type":"post","link":"http:\/\/thinkstick.dreamhosters.com\/2008\/05\/algorithm-to-generate-tag-clouds\/","title":{"rendered":"Algorithm to generate tag clouds"},"content":{"rendered":"

I was talking to a friend who’s trying to figure out a formula for generating tag cloud. The purpose of a tag cloud is to convey the extent of relevance of a tag among all other tags being used. Trying to display the frequency of tags sounds easy but there are different issues for different algorithms out there. ( the ones found by quick google search)<\/p>\n

The first one is from WordPress Codex<\/a>. The summary for the algorithm is they sort the tags by frequencies and then group them into each font size.\u00c2\u00a0 The problem with this algorithm is if the max frequency is 5000 and the second to max frequency is 50. They will be displayed in the same font size since the algorithm does not take the frequency range into account.\u00c2\u00a0 Also when frequency range is too narrow, a tag with 24 occurrences and a tag with 25 occurrences may just have different font sizes if the cut off happens to be between 24 and 25.<\/p>\n

The second algorithm we found is this one<\/a>. This one takes the frequency range into account but it tries to display tags in font sizes that only differ by 1 unit each.\u00c2\u00a0 The problem here is human eye’s inability to detect varying font sizes if there are too many steps between the max font and the min font. So 100 different tags with sizes ranging from 10px to 48 px will not be visually distinguishable.<\/p>\n

I figure if we take the second algorithm and modify it so that font size gap is big enough to be visible, it may just work.<\/p>\n

count the frequencies for all tags<\/p>\n

find min freq and max freq<\/p>\n

x =\u00c2\u00a0 freq of tag we want to calculate the font size<\/p>\n

scaling factor, K = (x – min freq) \/ (max freq – min freq)<\/p>\n

font range = max font size – min font size<\/p>\n

font step = C\u00c2\u00a0 (the constant font step size)<\/p>\n

font for tag =\u00c2\u00a0\u00c2\u00a0\u00c2\u00a0 min font size\u00c2\u00a0 + (C * floor (K * (font range\/ C)))<\/strong><\/p>\n

so if we reuse the example from the second algorithm<\/p>\n

min freq = 6 , max freq = 91, freq for\u00c2\u00a0 current tag\u00c2\u00a0 = x<\/p>\n

scaling factor K = (x – 6)\/85<\/p>\n

min font = 10 , max font = 30, font step = 4<\/p>\n

font for tag = 10 + ( 4 * floor (( (x-6)\/85) *( 20\/4)))<\/p>\n

so if x = 64,\u00c2\u00a0 font for tag = 22<\/p>\n

if x = 79, font for tag =\u00c2\u00a0 26<\/p>\n

if x = 14, font for tag = 10<\/p>\n

if x = 32,\u00c2\u00a0 font for tag =14<\/p>\n

Although it does not solve the problem of the max frequency so far off from the rest, it will pile\u00c2\u00a0 more tags with lower frequencies into smaller font sizes.\u00c2\u00a0But a spike can be handled as a special edge case.\u00c2\u00a0 this will work for most cases as long as the distribution curve is not too far off from the bell curve.<\/p>\n

I need to look into another algorithm that takes median or mean with standard deviation as a way to generate banding. But it again won’t work since we are still assuming the distribution curve to be bell shaped.<\/p>\n

I need to keep thinking about how we can display tag clouds with frequencies with a distribution curve that doesn’t fit bell shaped.\u00c2\u00a0 It’d be nice to get real data of tag occurrences from live sources like flickr, youtube, digg etc.<\/p>\n","protected":false},"excerpt":{"rendered":"

I was talking to a friend who’s trying to figure out a formula for generating tag cloud. The purpose of a tag cloud is to convey the extent of relevance of a tag among all other tags being used. Trying to display the frequency of tags sounds easy but there are different issues for different […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[3],"tags":[40,41,39],"_links":{"self":[{"href":"http:\/\/thinkstick.dreamhosters.com\/wp-json\/wp\/v2\/posts\/13"}],"collection":[{"href":"http:\/\/thinkstick.dreamhosters.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/thinkstick.dreamhosters.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/thinkstick.dreamhosters.com\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/thinkstick.dreamhosters.com\/wp-json\/wp\/v2\/comments?post=13"}],"version-history":[{"count":0,"href":"http:\/\/thinkstick.dreamhosters.com\/wp-json\/wp\/v2\/posts\/13\/revisions"}],"wp:attachment":[{"href":"http:\/\/thinkstick.dreamhosters.com\/wp-json\/wp\/v2\/media?parent=13"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/thinkstick.dreamhosters.com\/wp-json\/wp\/v2\/categories?post=13"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/thinkstick.dreamhosters.com\/wp-json\/wp\/v2\/tags?post=13"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}