Update templates
This commit is contained in:
parent
ca5dafb15d
commit
a74b28a6cb
|
@ -2,12 +2,40 @@
|
||||||
width: 98%;
|
width: 98%;
|
||||||
margin-left: 0px;
|
margin-left: 0px;
|
||||||
overflow-x: scroll;
|
overflow-x: scroll;
|
||||||
|
/* display: none; */
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.chartWrapper {
|
||||||
|
position: relative;
|
||||||
|
background-color: #DFCFBE;
|
||||||
|
border-radius: 30px;
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.chartWrapper > canvas {
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
pointer-events:none;
|
||||||
|
}
|
||||||
|
.chartAreaWrapper {
|
||||||
|
overflow-x: scroll;
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
height: 400px;
|
||||||
|
}
|
||||||
|
.chartAreaWrapper2 {
|
||||||
|
|
||||||
|
position: relative;
|
||||||
|
height: 300px;
|
||||||
|
width: 3000px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@media only screen and (max-width: 1100px) {
|
@media only screen and (max-width: 1100px) {
|
||||||
|
#charts {
|
||||||
#charts {
|
|
||||||
width: 95%;
|
width: 95%;
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
134
tpl/graph.js
134
tpl/graph.js
|
@ -1,134 +0,0 @@
|
||||||
var jsonfileRW = $.getJSON( "daily.json", function(data) {
|
|
||||||
var date = jsonfileRW.responseJSON.map(function(e) {
|
|
||||||
return e.date;
|
|
||||||
});
|
|
||||||
var rwallets = jsonfileRW.responseJSON.map(function(e) {
|
|
||||||
return e.rWallets;
|
|
||||||
});
|
|
||||||
var rmembers = jsonfileRW.responseJSON.map(function(e) {
|
|
||||||
return e.rMembers;
|
|
||||||
});
|
|
||||||
var nbrwallets = jsonfileRW.responseJSON.map(function(e) {
|
|
||||||
return e.nbrWallets;
|
|
||||||
});
|
|
||||||
var nbrmembers = jsonfileRW.responseJSON.map(function(e) {
|
|
||||||
return e.nbrMembers;
|
|
||||||
});
|
|
||||||
|
|
||||||
//ReceivedGraph
|
|
||||||
var ctx = document.getElementById("chartRW");
|
|
||||||
var config = {
|
|
||||||
type: 'line',
|
|
||||||
data: {
|
|
||||||
labels: date,
|
|
||||||
datasets: [{
|
|
||||||
label: 'Ḡ1 reçus sur les simples portefeuilles',
|
|
||||||
data: rwallets,
|
|
||||||
backgroundColor: 'rgba(0, 119, 204, 0.3)',
|
|
||||||
pointBorderWidth: 1,
|
|
||||||
pointHoverRadius: 8,
|
|
||||||
pointHoverBackgroundColor: "beige",
|
|
||||||
pointHoverBorderColor: "brown",
|
|
||||||
pointHoverBorderWidth: 2,
|
|
||||||
pointRadius: 3,
|
|
||||||
pointHitRadius: 8
|
|
||||||
}, {
|
|
||||||
label: 'Ḡ1 reçus sur les portefeuilles membres',
|
|
||||||
data: rmembers,
|
|
||||||
backgroundColor: 'rgba(0, 178, 0, 0.3)',
|
|
||||||
pointBorderWidth: 1,
|
|
||||||
pointHoverRadius: 8,
|
|
||||||
pointHoverBackgroundColor: "beige",
|
|
||||||
pointHoverBorderColor: "brown",
|
|
||||||
pointHoverBorderWidth: 2,
|
|
||||||
pointRadius: 3,
|
|
||||||
pointHitRadius: 8
|
|
||||||
}]
|
|
||||||
},
|
|
||||||
options: {
|
|
||||||
maintainAspectRatio: true,
|
|
||||||
responsive: true
|
|
||||||
}
|
|
||||||
};
|
|
||||||
var myChartRW = new Chart(ctx, config);
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// NbrWallets Graph
|
|
||||||
var ctx = document.getElementById("chartNBRW");
|
|
||||||
var config = {
|
|
||||||
type: 'line',
|
|
||||||
data: {
|
|
||||||
labels: date,
|
|
||||||
datasets: [{
|
|
||||||
label: 'Nombre de simple portefeuilles',
|
|
||||||
data: nbrwallets,
|
|
||||||
backgroundColor: 'rgba(0, 119, 204, 0.3)',
|
|
||||||
pointBorderWidth: 1,
|
|
||||||
pointHoverRadius: 8,
|
|
||||||
pointHoverBackgroundColor: "beige",
|
|
||||||
pointHoverBorderColor: "brown",
|
|
||||||
pointHoverBorderWidth: 2,
|
|
||||||
pointRadius: 3,
|
|
||||||
pointHitRadius: 8
|
|
||||||
}, {
|
|
||||||
label: 'Nombre de portefeuilles membres',
|
|
||||||
data: nbrmembers,
|
|
||||||
backgroundColor: 'rgba(0, 178, 0, 0.3)',
|
|
||||||
pointBorderWidth: 1,
|
|
||||||
pointHoverRadius: 8,
|
|
||||||
pointHoverBackgroundColor: "beige",
|
|
||||||
pointHoverBorderColor: "brown",
|
|
||||||
pointHoverBorderWidth: 2,
|
|
||||||
pointRadius: 3,
|
|
||||||
pointHitRadius: 8
|
|
||||||
}]
|
|
||||||
},
|
|
||||||
options: {
|
|
||||||
maintainAspectRatio: true,
|
|
||||||
responsive: true
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
var myChartNBRW = new Chart(ctx, config);
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/*var jqxhr = $.getJSON( "example.json", function() {
|
|
||||||
console.log( "success" );
|
|
||||||
})
|
|
||||||
.done(function() {
|
|
||||||
console.log( "second success" );
|
|
||||||
})
|
|
||||||
.fail(function() {
|
|
||||||
console.log( "error" );
|
|
||||||
})
|
|
||||||
.always(function() {
|
|
||||||
console.log( "complete" );
|
|
||||||
});*/
|
|
|
@ -0,0 +1,134 @@
|
||||||
|
var jsonfileRW = $.getJSON( "../data/cum-daily.json", function(data) {
|
||||||
|
var date = jsonfileRW.responseJSON.map(function(e) {
|
||||||
|
return e.date;
|
||||||
|
});
|
||||||
|
var rwallets = jsonfileRW.responseJSON.map(function(e) {
|
||||||
|
return e.rWallets;
|
||||||
|
});
|
||||||
|
var rmembers = jsonfileRW.responseJSON.map(function(e) {
|
||||||
|
return e.rMembers;
|
||||||
|
});
|
||||||
|
var nbrwallets = jsonfileRW.responseJSON.map(function(e) {
|
||||||
|
return e.nbrWallets;
|
||||||
|
});
|
||||||
|
var nbrmembers = jsonfileRW.responseJSON.map(function(e) {
|
||||||
|
return e.nbrMembers;
|
||||||
|
});
|
||||||
|
|
||||||
|
//ReceivedGraph
|
||||||
|
var ctx = document.getElementById("chartRW");
|
||||||
|
var config = {
|
||||||
|
type: 'line',
|
||||||
|
data: {
|
||||||
|
labels: date,
|
||||||
|
datasets: [{
|
||||||
|
label: 'Ḡ1 reçus sur les simples portefeuilles',
|
||||||
|
data: rwallets,
|
||||||
|
backgroundColor: 'rgba(0, 119, 204, 0.3)',
|
||||||
|
pointBorderWidth: 1,
|
||||||
|
pointHoverRadius: 8,
|
||||||
|
pointHoverBackgroundColor: "beige",
|
||||||
|
pointHoverBorderColor: "brown",
|
||||||
|
pointHoverBorderWidth: 2,
|
||||||
|
pointRadius: 3,
|
||||||
|
pointHitRadius: 8
|
||||||
|
}, {
|
||||||
|
label: 'Ḡ1 reçus sur les portefeuilles membres',
|
||||||
|
data: rmembers,
|
||||||
|
backgroundColor: 'rgba(0, 178, 0, 0.3)',
|
||||||
|
pointBorderWidth: 1,
|
||||||
|
pointHoverRadius: 8,
|
||||||
|
pointHoverBackgroundColor: "beige",
|
||||||
|
pointHoverBorderColor: "brown",
|
||||||
|
pointHoverBorderWidth: 2,
|
||||||
|
pointRadius: 3,
|
||||||
|
pointHitRadius: 8
|
||||||
|
}]
|
||||||
|
},
|
||||||
|
options: {
|
||||||
|
maintainAspectRatio: false,
|
||||||
|
responsive: true
|
||||||
|
}
|
||||||
|
};
|
||||||
|
var myChartRW = new Chart(ctx, config);
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
// NbrWallets Graph
|
||||||
|
var ctx = document.getElementById("chartNBRW");
|
||||||
|
var config = {
|
||||||
|
type: 'line',
|
||||||
|
data: {
|
||||||
|
labels: date,
|
||||||
|
datasets: [{
|
||||||
|
label: 'Nombre de simple portefeuilles',
|
||||||
|
data: nbrwallets,
|
||||||
|
backgroundColor: 'rgba(0, 119, 204, 0.3)',
|
||||||
|
pointBorderWidth: 1,
|
||||||
|
pointHoverRadius: 8,
|
||||||
|
pointHoverBackgroundColor: "beige",
|
||||||
|
pointHoverBorderColor: "brown",
|
||||||
|
pointHoverBorderWidth: 2,
|
||||||
|
pointRadius: 3,
|
||||||
|
pointHitRadius: 8
|
||||||
|
}, {
|
||||||
|
label: 'Nombre de portefeuilles membres',
|
||||||
|
data: nbrmembers,
|
||||||
|
backgroundColor: 'rgba(0, 178, 0, 0.3)',
|
||||||
|
pointBorderWidth: 1,
|
||||||
|
pointHoverRadius: 8,
|
||||||
|
pointHoverBackgroundColor: "beige",
|
||||||
|
pointHoverBorderColor: "brown",
|
||||||
|
pointHoverBorderWidth: 2,
|
||||||
|
pointRadius: 3,
|
||||||
|
pointHitRadius: 8
|
||||||
|
}]
|
||||||
|
},
|
||||||
|
options: {
|
||||||
|
maintainAspectRatio: true,
|
||||||
|
responsive: true
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
var myChartNBRW = new Chart(ctx, config);
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
/*var jqxhr = $.getJSON( "example.json", function() {
|
||||||
|
console.log( "success" );
|
||||||
|
})
|
||||||
|
.done(function() {
|
||||||
|
console.log( "second success" );
|
||||||
|
})
|
||||||
|
.fail(function() {
|
||||||
|
console.log( "error" );
|
||||||
|
})
|
||||||
|
.always(function() {
|
||||||
|
console.log( "complete" );
|
||||||
|
});*/
|
Loading…
Reference in New Issue