ffhb-chart-nodes/index.html at master · ramsaut/ffhb-chart-nodes · GitHub

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
<!DOCTYPE HTML>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
	<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/canvasjs/1.7.0/canvasjs.min.js"></script>
	<script type="text/javascript" src="data.js"></script>
	<script type="text/javascript">
		window.onload = function () {
			try {
				var chart = new CanvasJS.Chart("chartContainer",
				{
					culture:  "de",
					title:{
						text: "Anzahl von Routern"
					},
					axisX:{
						valueFormatString: "MMM YYYY",
						interval: 1,
						intervalType: "month",
					},

					data: [
					{
						type: "line",
						lineThickness: 2,
						dataPoints: BRE
					}
					]
				});
				chart.render();
				document.getElementById("clients").innerHTML = "Anzahl von Clients: "+clients

				var chart = new CanvasJS.Chart("chartContainerWALLE",
				{
					culture:  "de",
					title:{
						text: "Anzahl von Routern in Walle"
					},
					axisX:{
						valueFormatString: "MMM YYYY",
						interval: 1,
						intervalType: "month",
					},

					data: [
					{
						type: "line",
						lineThickness: 2,
						dataPoints: WALLE
					}
					]
				});
				chart.render();
				document.getElementById("clientsWALLE").innerHTML = "Anzahl von Clients in Walle: "+clientsWALLE
				var chart = new CanvasJS.Chart("chartContainerWALLEMai2016",
				{
					culture:  "de",
					title:{
						text: "Anzahl von Routern in Walle ab Mai 2016"
					},
					axisX:{
						valueFormatString: "DD MMM YYYY",
						interval: 1,
						intervalType: "month",
						minimum: new Date(2016,4,1)
					},
					data: [
					{
						type: "line",
						lineThickness: 2,
						dataPoints: WALLE
					}
					]
				});
				chart.render();
			} catch(err){
				alert('Bitte als erstes "python parse.py" ausführen.')
			}
		}
	</script>

</head>
<body>
	<div id="chartContainer" style="height: 300px; width: 100%;">
	</div>
	<p id="clients">Anzahl von Clients: </p>
	<div id="chartContainerWALLE" style="height: 300px; width: 100%;">
	</div>
	<p id="clientsWALLE">Anzahl von Clients: </p>
	<div id="chartContainerWALLEMai2016" style="height: 300px; width: 100%;">
	</div>
</body>
</html>