change json file name , get json data and sort ip addresses by date
This commit is contained in:
parent
5154b25a38
commit
4f04823a81
4 changed files with 119 additions and 23 deletions
68
address.json
Normal file
68
address.json
Normal 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"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -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
37
app.js
|
@ -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
|
||||||
|
}
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
15
index.htm
15
index.htm
|
@ -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>
|
||||||
|
|
||||||
</div>
|
|
||||||
<script src="app.js">
|
<script src="app.js">
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
</div>
|
||||||
|
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
Loading…
Reference in a new issue