Google chart visualization TIJD
HOe krijg ik dit weg? ik geef het nergens aan namelijk.
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
google.charts.load('current', {'packages':['corechart']});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var data = google.visualization.arrayToDataTable([
['Date', 'Deaths', 'Recovered'],
[new Date('2017-01-01'), 66, 66],
[new Date('2017-01-02'), 91.145, 109.374],
[new Date('2017-01-03'), 28.378, 74.62],
[new Date('2017-01-04'), 16.75, 33.5],
[new Date('2017-01-05'), 26.136, 39.204],
[new Date('2017-01-06'), 466.248, 41.975],
[new Date('2017-01-07'), 0, 117.414],
[new Date('2017-01-08'), 42.268, 0],
[new Date('2017-01-09'), 10.442, 31.326],
[new Date('2017-01-10'), 56.356, 0],
[new Date('2017-01-11'), 21.15, 31.725],
[new Date('2017-01-12'), 55.226, 82.839],
[new Date('2017-01-13'), 488.352, 610.44],
[new Date('2017-01-14'), 148.252, 85.035],
[new Date('2017-01-15'), 141.925, 198.695],
[new Date('2017-01-16'), 102.36, 120.372],
[new Date('2017-01-17'), 25.86, 30.17],
[new Date('2017-01-18'), 127.848, 149.156],
[new Date('2017-01-19'), 0, 0],
[new Date('2017-01-20'), 0, 0],
[new Date('2017-01-21'), 0, 0],
[new Date('2017-01-22'), 0, 0],
[new Date('2017-01-23'), 0, 0],
[new Date('2017-01-24'), 0, 0],
[new Date('2017-01-25'), 0, 0],
[new Date('2017-01-26'), 0, 0],
[new Date('2017-01-27'), 0, 0],
[new Date('2017-01-28'), 0, 0],
[new Date('2017-01-29'), 0, 0],
[new Date('2017-01-30'), 0, 0],
[new Date('2017-01-31'), 0, 0],
]);
var options = {
chartArea: {
width: "90%"
},
curveType: 'function',
width: '90%',
height: 500,
hAxis: {
title: 'World statistics',
format: 'd MMM',
gridlines: {
color: 'transparent'
},
textStyle: {
color: 'black',
fontSize: 12,
fontName: 'Arial',
bold: true,
italic: false,
textAlign: 'right'
},
titleTextStyle: {
color: 'black',
fontSize: 16,
fontName: 'Arial',
bold: true,
italic: false
},
},
vAxis: {
title: 'People',
titleTextStyle: {
color: 'black',
fontSize: 16,
fontName: 'Arial',
bold: true,
italic: false
},
textStyle: {
color: 'black',
fontSize: 12,
fontName: 'Arial',
bold: true,
italic: false
},
},
legend: {
position: 'top',
width: "90%"
},
backgroundColor: '#fff',
colors: ['#f36daa', '#51b9d2'],
};
var chart = new google.visualization.LineChart(document.getElementById('curve_chart'));
chart.draw(data, options);
}
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var data = google.visualization.arrayToDataTable([
['Date', 'Deaths', 'Recovered'],
[new Date('2017-01-01'), 66, 66],
[new Date('2017-01-02'), 91.145, 109.374],
[new Date('2017-01-03'), 28.378, 74.62],
[new Date('2017-01-04'), 16.75, 33.5],
[new Date('2017-01-05'), 26.136, 39.204],
[new Date('2017-01-06'), 466.248, 41.975],
[new Date('2017-01-07'), 0, 117.414],
[new Date('2017-01-08'), 42.268, 0],
[new Date('2017-01-09'), 10.442, 31.326],
[new Date('2017-01-10'), 56.356, 0],
[new Date('2017-01-11'), 21.15, 31.725],
[new Date('2017-01-12'), 55.226, 82.839],
[new Date('2017-01-13'), 488.352, 610.44],
[new Date('2017-01-14'), 148.252, 85.035],
[new Date('2017-01-15'), 141.925, 198.695],
[new Date('2017-01-16'), 102.36, 120.372],
[new Date('2017-01-17'), 25.86, 30.17],
[new Date('2017-01-18'), 127.848, 149.156],
[new Date('2017-01-19'), 0, 0],
[new Date('2017-01-20'), 0, 0],
[new Date('2017-01-21'), 0, 0],
[new Date('2017-01-22'), 0, 0],
[new Date('2017-01-23'), 0, 0],
[new Date('2017-01-24'), 0, 0],
[new Date('2017-01-25'), 0, 0],
[new Date('2017-01-26'), 0, 0],
[new Date('2017-01-27'), 0, 0],
[new Date('2017-01-28'), 0, 0],
[new Date('2017-01-29'), 0, 0],
[new Date('2017-01-30'), 0, 0],
[new Date('2017-01-31'), 0, 0],
]);
var options = {
chartArea: {
width: "90%"
},
curveType: 'function',
width: '90%',
height: 500,
hAxis: {
title: 'World statistics',
format: 'd MMM',
gridlines: {
color: 'transparent'
},
textStyle: {
color: 'black',
fontSize: 12,
fontName: 'Arial',
bold: true,
italic: false,
textAlign: 'right'
},
titleTextStyle: {
color: 'black',
fontSize: 16,
fontName: 'Arial',
bold: true,
italic: false
},
},
vAxis: {
title: 'People',
titleTextStyle: {
color: 'black',
fontSize: 16,
fontName: 'Arial',
bold: true,
italic: false
},
textStyle: {
color: 'black',
fontSize: 12,
fontName: 'Arial',
bold: true,
italic: false
},
},
legend: {
position: 'top',
width: "90%"
},
backgroundColor: '#fff',
colors: ['#f36daa', '#51b9d2'],
};
var chart = new google.visualization.LineChart(document.getElementById('curve_chart'));
chart.draw(data, options);
}
Er zijn nog geen reacties op dit bericht.