HTMLcopy
1
<div id="container"></div>
CSScopy
6
1
html, body, #container {
2
width: 100%;
3
height: 100%;
4
margin: 0;
5
padding: 0;
6
}
JavaScriptcopy
x
1
anychart.onDocumentReady(function () {
2
var data = [
3
['Data Businessperson', 50, 15, 10, 5, 25],
4
['Data Creative', 17, 23, 10, 20, 30],
5
['Data Developer', 17, 25, 16, 27, 15],
6
['Data Researcher', 12, 15, 17, 5, 51]
7
];
8
9
var chart = anychart.mosaic();
10
11
//create dataset
12
var dataSet = anychart.data.set(data);
13
//sets mapping for series
14
var map1 = dataSet.mapAs({'x': 0, 'value': 1});
15
var map2 = dataSet.mapAs({'x': 0, 'value': 2});
16
var map3 = dataSet.mapAs({'x': 0, 'value': 3});
17
var map4 = dataSet.mapAs({'x': 0, 'value': 4});
18
var map5 = dataSet.mapAs({'x': 0, 'value': 5});
19
20
//create mekko series
21
chart.mekko(map5).name('Statistics');
22
chart.mekko(map4).name('Programming');
23
chart.mekko(map3).name('Math/OR');
24
chart.mekko(map2).name('ML/Big Data');
25
chart.mekko(map1).name('Business');
26
27
//set container id for the chart
28
chart.container('container');
29
//initiate chart drawing
30
chart.draw();
31
});