HTMLcopy
1
<button onclick="label();">Apply changes (add labels)</button>
2
<button onclick="autoRedraw();">Draw changes on the chart</button>
3
<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
var chart;
2
anychart.onDocumentReady(function() {
3
chart = anychart.surface(getData());
4
chart.margin().left('15%');
5
chart.title('Disable redrawing of the chart after the changes. \n Use the buttons to apply the changes and draw them');
6
chart.container('container');
7
chart.draw();
8
9
// Disable chart redrawing.
10
chart.autoRedraw(false);
11
});
12
13
function autoRedraw() {
14
15
// Enable chart redrawing.
16
chart.autoRedraw(true);
17
}
18
19
var counter = 0;
20
21
function label() {
22
chart.label(counter++, {enabled: true, offsetY: 10 * counter++, fontWeight: 600, fontColor: 'rgba(' + Math.floor(Math.random() * 130).toString(10) + ','
23
+ Math.floor(Math.random() * 140).toString(10) + ','
24
+ Math.floor(Math.random() * 150).toString(10) + ')'});
25
}
26
27
function getData() {
28
return [
29
[-3, -3, -216],
30
[-3, -2, -125],
31
[-3, -1, -64],
32
[-3, 0, -27],
33
[-3, 1, -8],
34
[-3, 2, -1],
35
[-3, 3, 0],
36
[-2, -3, -125],
37
[-2, -2, -64],
38
[-2, -1, -27],
39
[-2, 0, -8],
40
[-2, 1, -1],
41
[-2, 2, 0],
42
[-2, 3, 1],
43
[-1, -3, -64],
44
[-1, -2, -27],
45
[-1, -1, -8],
46
[-1, 0, -1],
47
[-1, 1, 0],
48
[-1, 2, 1],
49
[-1, 3, 8],
50
[0, -3, -27],
51
[0, -2, -8],
52
[0, -1, -1],
53
[0, 0, 0],
54
[0, 1, 1],
55
[0, 2, 8],
56
[0, 3, 27],
57
[1, -3, -8],
58
[1, -2, -1],
59
[1, -1, 0],
60
[1, 0, 1],
61
[1, 1, 8],
62
[1, 2, 27],
63
[1, 3, 64],
64
[2, -3, -1],
65
[2, -2, 0],
66
[2, -1, 1],
67
[2, 0, 8],
68
[2, 1, 27],
69
[2, 2, 64],
70
[2, 3, 125],
71
[3, -3, 0],
72
[3, -2, 1],
73
[3, -1, 8],
74
[3, 0, 27],
75
[3, 1, 64],
76
[3, 2, 125],
77
[3, 3, 216]
78
]
79
}