jQCloud gone bad (jQuery Tag Cloud plugin in XPages)

I had the idea to make a custom control to make the display of a categorized view more attractive. Quickly you come to tag clouds. While the extension library has an easy to use tagcloud control you probably want to have a result that looks more like this:

jQCloud is a JQuery based plugin that does a bit of the trick for you. Unfortunately it seems the link option can not handle question mark parameters so an .xsp?filter= link does not work. This makes the plugin little of interest. Nevertheless here is my progress so far:

<?xml version=”1.0″ encoding=”UTF-8″?>
<xp:view xmlns:xp=”http://www.ibm.com/xsp/core”&gt;
<xp:this.beforePageLoad><![CDATA[#{javascript:var v:NotesView = database.getView(“country”);
var nav:NotesViewNavigator = v.createViewNav();
var entry:NotesViewEntry = nav.getFirst();
var data:String = “”;
while (entry != null && !entry.isTotal()) {
if (entry.isCategory()){
var cat = entry.getColumnValues().firstElement().toString();
var num = entry.getChildCount().toFixed();
//var link = “, link: ‘./jQueryCloud.nsf/country.xsp?cat=” + cat + “‘”;
var link = “, link: ‘./CountryFiltered.xsp'”
var data = data + “{text: ‘” + cat + “‘, weight: ” + num + link +”},”;
var tmpentry:NotesViewEntry = nav.getNext();
entry = tmpentry;

<title>jQCloud Example</title>
<link rel=”stylesheet” type=”text/css” href=”jqcloud.css” />
<script type=”text/javascript” src=”http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js”></script&gt;
<script type=”text/javascript” src=”jqcloud-1.0.3.js”></script>
<script type=”text/javascript”>
* Create an array of word objects, each representing a word in the cloud
var word_array = [
{text: “Lorem”, weight: 150},
{text: “Ipsum”, weight: 90, link: “http://jquery.com/&#8221;},
{text: “Dolor”, weight: 60, html: {title: “I can haz any html attribute”}},
{text: “Sit”, weight: 7},
{text: “Amet”, weight: 5}
// …as many words as you want

<div id=”example” style=”width: 550px; height: 350px;”></div>
<xp:eventHandler event=”onClientLoad” submit=”false”>
<xp:this.script><![CDATA[var viewData = “”;
var viewData = viewData + “#{javascript:@Text(viewScope.get(“categories”).toString())}”;

var myStr = “var word_array = [” + viewData + “];”;

var p = eval(myStr);

$(function() {
// When DOM is ready, select the container element and call the jQCloud method, passing the array of words as the first argument.

Job Wanted

Looking for a creative brain? Choose me!


2 thoughts on “jQCloud gone bad (jQuery Tag Cloud plugin in XPages)

  1. brockness 2016-March-3 / 9:05 pm

    maybe url encode your url strings?

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s