Highcharts Demo

author(s): Jon Arild Nygård

by amrutaJgtp

HTML

<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/wordcloud.js"></script>
<div id="container"></div>

CSS

#container {
	min-width: 310px;
	max-width: 800px;
	margin: 0 auto
}

JavaScript

var team1 = [{
    "name": "Prerna",
    "weight": "40"
    },
    {
    "name": "Sonal",
    "weight": "35"
    },
    {
    "name": "Sheetal",
    "weight": "48"
    },
    {
    "name": "Priya",
    "weight": "20"
    },
     {
    "name": "Ruchi",
    "weight": "30"
    }];
    
    var team2 = [{
    "name": "Rahul",
    "weight": "80"
    },
    {
    "name": "Ruchi",
    "weight": "70"
    },
    {
    "name": "Tan",
    "weight": "90"
    },
    {
    "name": "Akriti",
    "weight": "40"
    },
     {
    "name": "Sagar",
    "weight": "60"
    }];
    
     var team3 = [{
    "name": "Prerna",
    "weight": "80"
    },
    {
    "name": "Prerna",
    "weight": "70"
    },
    {
    "name": "Leena",
    "weight": "90"
    },
    {
    "name": "Sonal",
    "weight": "40"
    },
     {
    "name": "Shreya",
    "weight": "60"
    }];
   
Highcharts.chart('container', {
		xAxis: [{
    	width: '33%'
    }, {
    	left: '33%',
    	width: '33%'
    }, {
    	left: '66%',
    	width: '33%'
    }],
    
    
    
    series: [{
        type: 'wordcloud',
        data: team1,
        name: 'Team A'
    }, {
        type: 'wordcloud',
        xAxis: 1,
        data: team2,
        name: 'Team B'
    }, {
        type: 'wordcloud',
        xAxis: 2,
        data: team3,
        name: 'Team C'
    }],
    title: {
        text: 'Wordcloud'
    }
});