change json file name , get json data and sort ip addresses by date

This commit is contained in:
rloukil 2018-12-26 10:21:29 +01:00
parent 5154b25a38
commit 4f04823a81
4 changed files with 119 additions and 23 deletions

68
address.json Normal file
View file

@ -0,0 +1,68 @@
[
{
"ip": "94.198.99.82" ,
"date": "2018-12-25"
},
{
"ip":"123.125.67.160" ,
"date":"2018-12-26"
},
{
"ip":"123.125.67.165",
"date":"2018-12-27"
},
{
"ip":"123.125.67.121",
"date":"2018-12-28"
},
{
"ip": "94.198.99.82" ,
"date": "2018-12-29"
},
{
"ip":"123.125.67.160" ,
"date":"2018-12-30"
},
{
"ip":"123.125.67.165",
"date":"2018-12-31"
},
{
"ip":"123.125.67.121",
"date":"2018-01-01"
},
{
"ip": "94.198.99.82" ,
"date": "2018-01-01"
},
{
"ip":"123.125.67.160" ,
"date":"2018-01-02"
},
{
"ip":"123.125.67.165",
"date":"2018-01-03"
},
{
"ip":"123.125.67.121",
"date":"2018-01-04"
},{
"ip": "94.198.99.82" ,
"date": "2018-12-16"
},
{
"ip":"123.125.67.160" ,
"date":"2018-12-18"
},
{
"ip":"123.125.67.165",
"date":"2018-12-01"
},
{
"ip":"123.125.67.121",
"date":"2018-12-02"
}
]

View file

@ -1,20 +0,0 @@
[ {
"ip": "94.198.99.82" ,
"date": "2018-12-25"
},
{
"ip":"123.125.67.160" ,
"date":"2018-12-26"
},
{
"ip":"123.125.67.165",
"date":"2018-12-27"
},
{
"ip":"123.125.67.121",
"date":"2018-12-28"
}
]

37
app.js
View file

@ -0,0 +1,37 @@
let labels = []
let data = []
fetch('./address.json').then(response => {
return response.json();
}).then(data => {
data.sort(function(a,b){
console.log(a.date)
console.log(b.date)
return new Date(a.date) - new Date(b.date) ;
});
console.log(data);
}).catch(err => {
});
var ctx = document.getElementById("myChart").getContext('2d');
var myChart = new Chart(ctx, {
type: 'bar',
data: {
labels: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"],
datasets: [{
label: '# of Votes',
data: [1, -1, 1, -1, 1, -1],
borderWidth: 1
}]
},
options: {
scales: {
yAxes: [{
ticks: {
beginAtZero:true
}
}]
}
}
});

View file

@ -5,13 +5,24 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge"> <meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous"> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous">
<title>Test</title> <title>Test</title>
</head> </head>
<body> <body>
<div class=""> <div class="container">
<canvas id="myChart" width="400" height="400"></canvas>
<script src="lodash.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.4.0/Chart.min.js"></script>
<script src="app.js">
</script>
</div> </div>
<script src="app.js">
</script>
</body> </body>
</html> </html>