D3 word cloud service module

From WandoraWiki
Jump to: navigation, search

The D3 word cloud module uses the D3 cloud layout to visualize topic structures in Wandora. It uses the open source JavaScript visualization library D3.js. The service module's alias in Wandora is d3cloud and the URL of the visualization is

The visualization uses the currently open topic as a starting point and let's the user navigate through the topicmap by clicking on the cloud's words that map to associations of the current topic.

The visualization's layout can be modified with the following URL query string parameters:

font Specifies the font used to render the words in the cloud
spiral Specifies the spiral along witch the words are placed
scale Specifies the function according to which the font sizes are calculated from the amount of associations that particular topic has.
from, to and or the parameters for random rotation. "from" and "to" specify the range in degrees in relation to the vertical axis and "or" specifies the amount of steps within the range. For example from=-90&to=90&or=5 would result in each text's rotation to be randomly -90, -45, 0, 45 or 90 degrees

Also the parameter n can be used to limit the amount of topics retrieved from Wandora and thus the words rendered at a time.

A complete description of the parameters is provided on the visualization page and an example of their use follows below.

Note that as with D3 the browser support of D3 visualizations in Wandora is limited to IE9+ and up to date versions of Firefox, Chrome (+Chromium), Safari and Opera.


The WordNet is used to demonstrate the visualization

Selecting a topic in Wandora shows it and it's associatated topics in the browser.

D3wordmap 01.png

D3wordmap 02.png

font=times%20new%20roman is used to change the font of the cloud

D3wordmap 03.png

from=-90&to=90&or=5 is further used to rotate the words randomly either -90, -45, 0 ,45 or 90 degrees

D3wordmap 04.png

the cloud is navigated by clicking on the words as if they were links

D3wordmap 05.png

A sense of completely random rotation is achieved by increasing the or-parameter

D3wordmap 06.png
Personal tools