-
Notifications
You must be signed in to change notification settings - Fork 3
/
Copy pathcolumn.html
130 lines (109 loc) · 2.68 KB
/
column.html
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
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
<html>
<head>
<title>amCharts tutorial: Loading external data</title>
<script src="http://www.amcharts.com/lib/3/amcharts.js"></script>
<script src="http://www.amcharts.com/lib/3/serial.js"></script>
<script src="http://www.amcharts.com/lib/3/plugins/dataloader/dataloader.min.js"type="text/javascript"></script>
<style>
#chartdiv {
width : 100%;
height : 435px;
font-size : 11px;
}
</style>
<script type="text/javascript">
var chart=AmCharts.makeChart( "chartdiv", {
"type": "serial",
"dataLoader": {
"url": "http://localhost/mobitel/feb3/data.php" ,
"type": 'GET',
"dataType": 'json',
"mimeType": 'multipart/form-data',
"contentType": false,
"cache": false,
"processData": false,
},
"categoryField": "Dated",
"dataDateFormat": "YYYY-MM-DD HH:NN",
"position": "bottom",
"categoryAxis": {
"gridPosition": "start" ,
"minPeriod": "mm",
"parseDates": true
},
"chartCursor": {
"enabled": true,
"categoryBalloonDateFormat": "JJ:NN , DD MMMM"
},
"startDuration": 1,
"plotAreaFillAlphas": 0.1,
"depth3D": 60,
"angle": 30,
"export": {
"enabled": true
},
"trendLines": [],
"graphs": [ {
"valueField": "Attempts",
"balloonText": "[[Dated]]: <b>[[Attempts]]</b>",
"title": "Attempts",
"bulletBorderColor": "#FFFFFF",
"fillAlphas": 0.9,
"lineAlpha": 0.2,
"type": "column"
}, {
"valueField": "Answers",
"balloonText": "[[Dated]]: <b>[[Answers]]</b>",
"title": "Answers",
"bulletBorderColor": "#FFFFFF",
"fillAlphas": 0.9,
"lineAlpha": 0.2,
"type": "column"
} ],
"guides": [],
"valueAxes": [
{
"id": "ValueAxis-1",
"title": "Value",
}],
"allLabels": [],
"balloon": {},
"legend": {
"enabled": true,
"useGraphSettings": true
},
"titles": [
{
"id": "Title-1",
"size": 15,
"text": "TATA-NGN-12969"
}],
"export": {
"enabled": true
},
} );
chart.addListener("rendered", zoomChart);
zoomChart();
function zoomChart() {
chart.zoomToIndexes(chart.dataProvider.length - 40, chart.dataProvider.length - 1);
}
jQuery('.chart-input').off().on('input change',function() {
var property = jQuery(this).data('property');
var target = chart;
chart.startDuration = 0;
if ( property == 'topRadius') {
target = chart.graphs[0];
if ( this.value == 0 ) {
this.value = undefined;
}
}
target[property] = this.value;
chart.validateNow();
});
</script>
</head>
<body>
<div id="chartdiv"></div>
</div>
</body>
</html>