HTML5 Wordcloud test

by Angelos Chaidas

HTML

<script src="https://rawgit.com/indyarmy/jQuery.awesomeCloud.plugin/master/jquery.awesomeCloud-0.2.min.js"></script>
<ul id="wordcloud">
    <li data-weight="14">Finance</li>
    <li data-weight="5">Photoshop</li>
    <li data-weight="7">Illustrator</li>
    <li data-weight="23">Microsoft Office</li>
    <li data-weight="10">Some other software</li>
    <li data-weight="12">to look good</li>
    <li data-weight="11">We actually need</li>
    <li data-weight="30">Fulfilment</li>
    <li data-weight="40">Office supplies</li>
    <li data-weight="50">Executive assistant</li>
    <li data-weight="34">Personal assistant</li>
</ul>

CSS

#wordcloud {
    width:702px;
    height:320px;
}

JavaScript

var settings = {
    "size": {
        "grid": 10,
        "factor": 2,
        "normalize" : true
    },
    "color": {
				"background": "rgba(255,255,255,0)", // background color, transparent by default
				"start": "#279B37", // color of the smallest font, if options.color = "gradient""
				"end": "#212121" // color of the largest font, if options.color = "gradient"
			},
    "options": {
        "rotationRatio": 0.5,
            "printMultiplier": 1
    },
        "font": "Arial",
        "shape": "circle"
};
$("#wordcloud").awesomeCloud(settings);