Tag Cloud

**dutube** · 01-06-2008, 03:23 PM

Jeremy

Could you share the could how you implement the Cloud tags on your website, i think it's a great option.

Hakob.

**georgezzz** · 03-24-2008, 09:34 PM

Originally Posted by mhancoc7

Originally Posted by dutube

Jeremy

Could you share the could how you implement the Cloud tags on your website, i think it's a great option.

Hakob.

Sure, here is the code to my current setup. I used an iframe to display the page below.

Code:

<html>
<head>

<?
/*
@wordCloud
Author: Derek Harvey (www.derekharvey.co.uk)
*/

class wordCloud
{
    var $wordsArray = array();
   
    /*
    * PHP 5 Constructor
    *
    * @param array $words
    * @return void
    */
   
    function __construct($words = false)
    {
        if ($words !== false && is_array($words))
        {
            foreach ($words as $key => $value)
            {
                $this->addWord($value);
            }
        }
    }
   
    /*
    * PHP 4 Constructor
    *
    * @param array $words
    * @return void
    */
   
    function wordCloud($words = false)
    {
        $this->__construct($words);
    }
   
    /*
    * Assign word to array
    *
    * @param string $word
    * @return string
    */
   
    function addWord($word, $value = 1)
    {
        $word = strtolower($word);
        if (array_key_exists($word, $this->wordsArray))
            $this->wordsArray[$word] += $value;
        else
            $this->wordsArray[$word] = $value;
       
        return $this->wordsArray[$word];
    }
   
    /*
    * Shuffle associated names in array
    */
   
    function shuffleCloud()
    {
        $keys = array_keys($this->wordsArray);
       
        shuffle($keys);
       
        if (count($keys) && is_array($keys))
        {
            $tmpArray = $this->wordsArray;
            $this->wordsArray = array();
            foreach ($keys as $key => $value)
                $this->wordsArray[$value] = $tmpArray[$value];
        }
    }
   
    /*
    * Calculate size of words array
    */
   
    function getCloudSize()
    {
        return array_sum($this->wordsArray);
    }
   
    /*
    * Get the class range using a percentage
    *
    * @returns int $class
    */
   
    function getClassFromPercent($percent)
    {
        if ($percent >= 99)
            $class = 1;
        else if ($percent >= 70)
            $class = 2;
        else if ($percent >= 60)
            $class = 3;
        else if ($percent >= 50)
            $class = 4;
        else if ($percent >= 40)
            $class = 5;
        else if ($percent >= 30)
            $class = 6;
        else if ($percent >= 20)
            $class = 7;
        else if ($percent >= 10)
            $class = 8;
        else if ($percent >= 5)
            $class = 9;
        else
            $class = 0;
       
        return $class;
    }
   
    /*
    * Create the HTML code for each word and apply font size.
    *
    * @returns string $spans
    */
   
    function showCloud($returnType = "html")
    {
        $this->shuffleCloud();
        $this->max = max($this->wordsArray);
       
        if (is_array($this->wordsArray))
        {
            $return = ($returnType == "html" ? "" : ($returnType == "array" ? array() : ""));
            foreach ($this->wordsArray as $word => $popularity)
            {
                $sizeRange = $this->getClassFromPercent(($popularity / $this->max) * 100);
                if ($returnType == "array")
                {
                    $return[$word]['word'] = $word;
                    $return[$word]['sizeRange'] = $sizeRange;
                    if ($currentColour)
                      $return[$word]['randomColour'] = $currentColour;
                }
                else if ($returnType == "html")
                {
                    $return .= "<span class='tag_cloud size{$sizeRange}'>  {$word}  </span>";
                }
            }
            return $return;
        }
    }
}
?>

<style type="text/css">
.tag_cloud { padding: 3px; text-decoration: none; }
.tag_cloud:link  { color: #3F4C6B; }
.tag_cloud:visited { color: #3F4C6B; }
.tag_cloud:hover { color: #0066FF; background: #e7e7f7; }
.tag_cloud:active { color: #0066FF; background: #e7e7f7; }

body {
font-family: Verdana, Helvetica, sans-serif;
}
</style>

<script language="JavaScript" type="text/JavaScript">

//add event function
function addEvent(obj, evType, fn){ 
 if (obj.addEventListener){ 
   obj.addEventListener(evType, fn, true); 
   return true; 
 } else if (obj.attachEvent){ 
   var r = obj.attachEvent("on"+evType, fn); 
   return r; 
 } else { 
   return false; 
 } 
}

// Find all link elements and add an onfocus attribute and value
function hideFocusBorders(){
var theahrefs = document.getElementsByTagName("a");
if (!theahrefs){return;}
for(var x=0;x!=theahrefs.length;x++){
theahrefs[x].onfocus = function stopLinkFocus(){this.hideFocus=true;};
}
}

//event added using the addEvent() function above
addEvent(window, 'load', hideFocusBorders);

</script>
<style type="text/css">
<!--

/* ----- hidden focus borders from mozilla ----- */
:focus { -moz-outline-style: none; }

-->

</style>

</head>
<body>
<center>
<?php
    $randomWords = array();
    $cloud = new wordCloud($randomWords);
    $cloud->addWord("music", 33);
    $cloud->addWord("Jesus", 9);
    $cloud->addWord("Oprah", 62);
    $cloud->addWord("catholic", 10);
    $cloud->addWord("Worship", 13);
    $cloud->addWord("gnosticism", 1);
    $cloud->addWord("Liturgy", 2);
    $cloud->addWord("Bible", 11);
    $cloud->addWord("comedy", 17);
    $cloud->addWord("Switchfoot", 3);
    $cloud->addWord("WTC", 84);
    $cloud->addWord("Parents", 12);
    $cloud->addWord("gospel", 30);
    $cloud->addWord("Church", 28);
    $cloud->addWord("Abortion", 27);
    $cloud->addWord("forgiveness", 32);
    $cloud->addWord("911", 99);
    $cloud->addWord("Saint", 44);
    $cloud->addWord("whiteboydj", 79);
    $cloud->addWord("Mercy", 35);
    $cloud->addWord("School", 58);
    $cloud->addWord("Sin", 27);
    $cloud->addWord("Nuns", 3);
    $myCloud = $cloud->showCloud("array");
    foreach ($myCloud as $key => $value) {
        echo ' '.$value['word'].' ';
    }
  ?></center>
</body>
</html>

Still needing this?