rloukil/Ungleich
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

add different data for every client

Browse source
This commit is contained in:
rloukil 2019-01-01 15:16:42 +01:00
parent 70c95224b3
commit 692291bb04
2 changed files with 204 additions and 34 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

127
address.json
View file

@ -1,7 +1,7 @@
[
[
{
"ip": "18:36:F3:98:4F:9A" ,
"ip": "2001:0db8:85a3:0000:0000:8a2e:0370:7334" ,
"date": "2018-12-25"
},
{
@ -13,11 +13,11 @@
"date":"2018-12-26"
},
{
"ip": "18:36:F3:98:4F:9A" ,
"ip": "2001:0db8:85a3:0000:0000:8a2e:0370:7334" ,
"date": "2018-12-25"
},
{
"ip":"2a0a:e5c0:2:5:3106:3977:2f62:5c3c",
"ip":"2001:0db8:85a3:0000:0000:8a2e:0370:7334",
"date":"2018-12-27"
},
{
@ -40,6 +40,122 @@
"ip":"2a0a:e5c0:2:2:400:c8ff:fe68:bed1" ,
"date":"2018-12-30"
},
{
"ip": "2001:0db8:85a3:0000:0000:8a2e:0370:7334" ,
"date": "2018-12-25"
},
{
"ip":"2a0a:e5c0:0:2:400:b3ff:fe39:7959",
"date":"2018-12-31"
},
{
"ip":"2a0a:e5c0:2:2:400:c8ff:fe68:bed1",
"date":"2018-01-01"
},
{
"ip": "2001:0db8:85a3:0000:0000:8a2e:0370:7334" ,
"date": "2018-01-01"
}
],
[
{
"ip": "18:36:F3:98:4F:9A" ,
"date": "2018-12-25"
},
{
"ip": "2001:0db8:85a3:0000:0000:8a2e:0370:7334" ,
"date": "2018-12-25"
},
{
"ip":"2a0a:e5c0:2:2:400:c8ff:fe68:bed1" ,
"date":"2018-12-26"
},
{
"ip": "2001:0db8:85a3:0000:0000:8a2e:0370:7334" ,
"date": "2018-12-25"
},
{
"ip":"2a0a:e5c0:2:5:3106:3977:2f62:5c3c",
"date":"2018-12-27"
},
{
"ip":"2a0a:e5c0:0:2:400:b3ff:fe39:7959",
"date":"2018-12-28"
},
{
"ip": "2001:0db8:85a3:0000:0000:8a2e:0370:7334" ,
"date": "2018-12-25"
},
{
"ip":"2001:0db8:85a3:0000:0000:8a2e:0370:7334",
"date":"2018-01-01"
},
{
"ip": "2a0a:e5c0:2:2:400:c8ff:fe68:bed1" ,
"date": "2018-12-29"
},
{
"ip":"2001:0db8:85a3:0000:0000:8a2e:0370:7334" ,
"date":"2018-12-30"
},
{
"ip": "18:36:F3:98:4F:9A" ,
"date": "2018-12-25"
},
{
"ip":"2001:0db8:85a3:0000:0000:8a2e:0370:7334",
"date":"2018-12-31"
},
{
"ip":"2a0a:e5c0:2:2:400:c8ff:fe68:bed1",
"date":"2018-01-01"
},
{
"ip": "2001:0db8:85a3:0000:0000:8a2e:0370:7334" ,
"date": "2018-01-01"
}
],
[
{
"ip": "2001:0db8:85a3:0000:0000:8a2e:0370:7334" ,
"date": "2018-12-25"
},
{
"ip": "2001:0db8:85a3:0000:0000:8a2e:0370:7334" ,
"date": "2018-12-25"
},
{
"ip":"2a0a:e5c0:2:2:400:c8ff:fe68:bed1" ,
"date":"2018-12-26"
},
{
"ip": "18:36:F3:98:4F:9A" ,
"date": "2018-12-25"
},
{
"ip":"2a0a:e5c0:2:5:3106:3977:2f62:5c3c",
"date":"2018-12-27"
},
{
"ip":"2001:0db8:85a3:0000:0000:8a2e:0370:7334",
"date":"2018-12-28"
},
{
"ip": "18:36:F3:98:4F:9A" ,
"date": "2018-12-25"
},
{
"ip":"2001:0db8:85a3:0000:0000:8a2e:0370:7334",
"date":"2018-01-01"
},
{
"ip": "2001:0db8:85a3:0000:0000:8a2e:0370:7334" ,
"date": "2018-12-29"
},
{
"ip":"2a0a:e5c0:2:2:400:c8ff:fe68:bed1" ,
"date":"2018-12-30"
},
{
"ip": "18:36:F3:98:4F:9A" ,
"date": "2018-12-25"
@ -53,9 +169,10 @@
"date":"2018-01-01"
},
{
"ip": "2a0a:e5c0:0:2:400:b3ff:fe39:7959" ,
"ip": "2001:0db8:85a3:0000:0000:8a2e:0370:7334" ,
"date": "2018-01-01"
}
]
]

111
app.js
View file

@ -5,6 +5,18 @@ var addresses = []
var date = []
var ipv4_v6 = []
//colors object for different graphs
var chartColors = {
red: 'rgb(255, 99, 132)',
orange: 'rgb(255, 159, 64)',
yellow: 'rgb(255, 205, 86)',
green: 'rgb(75, 192, 192)',
blue: 'rgb(54, 162, 235)',
purple: 'rgb(153, 102, 255)',
grey: 'rgb(231,233,237)'
};
//test function for ip addresses
function Ip4OrIp6(ipAddress){
if(ipAddress.length == 39){
ipv4_v6.push(1);
@ -26,52 +38,93 @@ function getData(){
getData().then((data)=>{
data.forEach(element => {
date.push(element.date);
Ip4OrIp6(element.ip);
});
date.push(element.date);
// Ip4OrIp6(element.ip);
// });
console.log(date);
console.log(ipv4_v6);
// console.log(date);
// console.log(ipv4_v6);
date.sort((a, b)=>{
return new Date(a) - new Date(b)
})
var ctx = document.getElementById("myChart").getContext('2d');
var chart = new Chart(ctx, {
type: 'bar',
type: 'line',
data: {
labels:date ,
datasets: [{
label: "Statistics for IPV4 and IPV6",
data:ipv4_v6,
}
]
datasets: [
{
label: "My First dataset",
backgroundColor: chartColors.red,
borderColor: chartColors.red,
data: [
randomScalingFactor(),
randomScalingFactor(),
randomScalingFactor(),
randomScalingFactor(),
randomScalingFactor(),
randomScalingFactor(),
randomScalingFactor()
],
fill: false,
}, {
label: "My Second dataset",
fill: false,
backgroundColor: chartColors.blue,
borderColor: chartColors.blue,
data: [
randomScalingFactor(),
randomScalingFactor(),
randomScalingFactor(),
randomScalingFactor(),
randomScalingFactor(),
randomScalingFactor(),
randomScalingFactor()
],
}
]
},
options: {
legend: { display: false },
title: {
display: true,
text: 'Statistics for IPV4 and IPV6'
}
}
})
})
//Fetch call to get data from addresses json file
// async function retrieveIpAdresses(){
// await fetch('./address.json').then(response => {
// response.json();
// }).then(data => {
// data.forEach(element=>{
// console.log(element)
// date.push(element.date)
// })
// }).catch(err => {
// err = err
// });
// }
},
scales: {
xAxes: [{
display: true,
gridLines: {
display: false ,
color: "blue"
},
scaleLabel: {
display: true,
labelString: 'Time',
}
}],
yAxes: [{
display: true,
gridLines: {
display: false ,
color: "blue"
},
scaleLabel: {
display: true,
labelString: 'Ipv4 or Ipv6',
}
}]
}
} }
)});