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 stage = anychart.graphics.create("container");
3
// create charts
4
chart1 = anychart.sparkline();
5
chart2 = anychart.sparkline();
6
chart3 = anychart.sparkline();
7
chart4 = anychart.sparkline();
8
9
chart1.title("EUR/USD - missing point");
10
chart2.title("EUR/USD - connected point");
11
chart3.title("GBP/USD - missing point");
12
chart4.title("GBP/USD - connected point");
13
14
// create data for both charts
15
chart1.data([1.1371,1.1341, "miss", 1.1132,1.1381,1.1371]);
16
chart2.data([1.1371,1.1341, "miss", 1.1132,1.1381,1.1371]).connectMissingPoints(true);
17
chart3.data([1.5500,1.5458,1.5463, "miss", 1.5397,1.5385]);
18
chart4.data([1.5500,1.5458,1.5463, "miss", 1.5397,1.5385]).connectMissingPoints(true);
19
20
// set charts dimensions and position
21
chart1.bounds(0, 0, 300, 40);
22
chart1.seriesType("line");
23
chart2.bounds(0, 50, 300, 40);
24
chart2.seriesType("line");
25
chart3.bounds(0, 100, 300, 40);
26
chart3.seriesType("area");
27
chart4.bounds(0, 150, 300, 40);
28
chart4.seriesType("area");
29
30
// set container id for the charts
31
chart1.container(stage);
32
chart2.container(stage);
33
chart3.container(stage);
34
chart4.container(stage);
35
36
// initiate chart drawing
37
chart1.draw();
38
chart2.draw();
39
chart3.draw();
40
chart4.draw();
41
42
});