html, body, #radar { width: 100%; height: 100%; margin: 0; padding: 0; } anychart.onDocumentReady(function () { // create a data set var chartData = { header: ['#', "Thorn","Comp 1","Comp 2","Comp 3","Comp 4","Comp 5"], rows: [ ["range breadth" ,9,7,9,6,8,9], ["aesthetics" ,9,7,6,5,7,7], ["market price" ,9,5,9,4,4,5], ["efficiency" ,8,7,9,8,5,3], ["lifetime" ,8,5,8,2,3,8], ["controlability",9,3,6,6,0,5] ], }; // create a radar chart var chart = anychart.radar(); // set the series type // chart.defaultSeriesType('area'); // set the color palette // set the chart data chart.data(chartData); //chart.yScale().stackMode('percent'); chart.yScale().ticks().interval(1); chart.yAxis().stroke('#545f69'); chart.yAxis().ticks().stroke('#545f69'); // chart.getSeries(1).stroke({ color: '#f1948a', thickness: 4}); // chart.palette(['#DE3163','#40E0D0','#FFBF00', '#8e44ad', '#3498db', '#2ecc71', '#5d6d7e']); for (var i = 0; i < chart.getSeriesCount(); i++) { var series = chart.getSeries(i); var color = chart.palette().itemAt(i); // Get the palette color for this index series.stroke({ color: color, thickness: 4 }); } chart.yGrid().palette(['gray 0.05', 'white 0.025']); // set chart legend settings chart.legend() .align('center') .position('center-bottom') .enabled(true); // set the chart title chart.title("Total Goals for Clubs"); // set the container id chart.container('container'); // display the radar chart chart.draw(); });