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
{x: 'Food is tasteless', value: 65},
4
{x: 'Wait time', value: 109},
5
{x: 'Unfriendly staff', value: 52.5},
6
{x: 'Not clean', value: 45},
7
{x: 'Overpriced', value: 250},
8
{x: 'To noisy', value: 57},
9
];
10
11
// create a Pareto chart with data
12
var chart = anychart.pareto(data);
13
14
// line series enable labels
15
chart.getSeries(0).labels(true);
16
chart.getSeries(0).labels().position("center");
17
chart.getSeries(0).labels().anchor("center");
18
19
// columns series enable labels
20
chart.getSeries(1).labels(false);
21
chart.getSeries(1).selected().labels().enabled(true);
22
chart.getSeries(1).selected().labels().anchor("center-bottom");
23
chart.getSeries(1).hovered().labels(true);
24
chart.getSeries(1).hovered().labels().anchor("center-bottom");
25
chart.getSeries(1).hovered().labels().format("{%value}%");
26
27
// set chart title text settings
28
chart.title("Pareto chart: labels configuration");
29
30
// set container id for the chart
31
chart.container('container');
32
// initiate chart drawing
33
chart.draw();
34
});