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 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">
|
||||
|
||||
<title>Test</title>
|
||||
</head>
|
||||
<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>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
Loading…
Reference in a new issue