Tag Cloud or Word Cloud is used to show frequency of words or phrases on your website or in some content.
Here is what this Tag Cloud will look like:
//Add this code in your solution:
public class TagCloudGenerator
{
public string GetTagCloudHTML(Dictionary<string, int> tagNameWithFrequesncies)
{
StringBuilder tagCloudString = new StringBuilder("");
int highestFrequency = tagNameWithFrequesncies.Values.Max();
int counter =1;
foreach (string tag in tagNameWithFrequesncies.Keys)
{
string tagClass = GetTagClass(tagNameWithFrequesncies[tag], highestFrequency);
//TODO: need to set proper URL where links should redirect to
string targetUrl = "http://abc.com/filter=" + tag;
string tagItem = " + counter + "' class='" + tagClass + "'> + targetUrl + "'>" + tag + "";
tagCloudString.Append(tagItem);
}
tagCloudString.Append("");
return tagCloudString.ToString();
}
public string GetTagClass(int tagFrequency, int highestFrequency)
{
if(tagFrequency == 0 || highestFrequency ==0)
return "tag0";
var percentageFrequency = (tagFrequency * 100) / highestFrequency;
if (percentageFrequency >= 90)
return "tag90";
if (percentageFrequency >= 80)
return "tag80";
if (percentageFrequency >= 70 )
return "tag70";
if (percentageFrequency >= 60)
return "tag60";
if (percentageFrequency >= 50)
return "tag50";
if (percentageFrequency >= 40)
return "tag40";
if (percentageFrequency >= 30)
return "tag30";
if (percentageFrequency >= 20)
return "tag20";
if (percentageFrequency >= 10)
return "tag10";
if (percentageFrequency >= 1)
return "tag1";
// This is the required code to be placed in the Page where you want to generate Tag cloud
protected void Page_Load(object sender, EventArgs e)
{
Dictionary<string, int> categoryTags = new Dictionary<string,int>();
categoryTags.Add("Science", 100);
categoryTags.Add("Maths", 80);
categoryTags.Add("Biology", 190);
categoryTags.Add("Physics", 70);
categoryTags.Add("Commerce", 60);
categoryTags.Add("Behavioral Science", 90);
categoryTags.Add("Psychology", 40);
categoryTags.Add("Numismatics", 43);
categoryTags.Add("Philately", 45);
categoryTags.Add("English", 28);
categoryTags.Add("Hindi", 145);
categoryTags.Add("Oriya", 40);
categoryTags.Add("French", 10);
categoryTags.Add("German", 9);
categoryTags.Add("Sanskrit", 8);
categoryTags.Add("Telugu", 20);
categoryTags.Add("Kannara", 2);
categoryTags.Add("Malyalam", 1);
categoryTags.Add("Pongal", 0);
categoryTags.Add("Earth Sciences", 90);
tag.InnerHtml = new TagCloudGenerator().GetTagCloudHTML(categoryTags);
}// This is the CSS Style you need for rendering Tag Cloud
// Put this is the head section of your ASPX /HTML page
<style type="text/css">
.tagCloud
{
width:400px;
height:auto;
border:1px solid black;
font-family:Arial;
padding:10px;
}
.tagCloud span
{
display:inline-block;
vertical-align:middle
}
.tagCloud a
{
text-decoration:none;
}
.tagCloud a:hover
{
text-decoration:underline;
background-color:Blue;
color:White;
}
.tag0
{
font-size:0pt;
padding:5px;
}
.tag1
{
font-size:8pt;
padding:5px;
}
.tag10
{
font-size:10pt;
padding:5px;
}
.tag20
{
font-size:12pt;
padding:5px;
}
.tag30
{
font-size:14pt;
padding:5px;
}
.tag40
{
font-size:16pt;
padding:5px;
}
.tag50
{
font-size:18pt;
padding:5px;
}
.tag60
{
font-size:20pt;
padding:5px;
}
.tag70
{
font-size:22pt;
padding:5px;
}
.tag80
{
font-size:24pt;
padding:5px;
}
.tag90
{
font-size:30pt;
padding:5px;
}
style>
return "tag0";
}
}
ShareThis
