g1-stats/tpl/mixed.html

146 lines
3.4 KiB
HTML

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="../css/style.css">
<link rel="stylesheet" type="text/css" href="../css/charts.css">
<script type="text/javascript" src="../js/Chart.js"></script>
</head>
<body>
<center>
<h1>Graphiques</h1>
<div id="charts">
<center><h2 id="titleRW">Ḡ1 reçus sur les wallets</h2></center>
<canvas id="chartRW" width="1600" height="500"></canvas>
</div>
<div id="charts">
<center><h2 id="titleRW">Nombre de wallets</h2></center>
<canvas id="chartNBRW" width="1600" height="500"></canvas>
</div>
</center>
<script>
// ### For received on wallets ###
var jsonfileRW = {
"jsonarray": [
_JSONDATARW
]
};
var date = jsonfileRW.jsonarray.map(function(e) {
return e.date;
});
var rwallets = jsonfileRW.jsonarray.map(function(e) {
return e.rWallets;
});
var rmembres = jsonfileRW.jsonarray.map(function(e) {
return e.rMembres;
});
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: rmembres,
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: false
}
};
var myChartRW = new Chart(ctx, config);
// ### For numbers of wallets ###
var jsonfileNBRW = {
"jsonarray": [
_JSONDATANBRW
]
};
var date = jsonfileNBRW.jsonarray.map(function(e) {
return e.date;
});
var nbrwallets = jsonfileNBRW.jsonarray.map(function(e) {
return e.nbrWallets;
});
var nbrmembres = jsonfileNBRW.jsonarray.map(function(e) {
return e.nbrMembres;
});
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: nbrmembres,
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: false
}
};
var myChartNBRW = new Chart(ctx, config);
</script>
<div class="blank"></div>
<div class="footer">
<center><a href=/><img src="../logo-axiom-team.svg" alt="Ḡ1" /></a></center>
</div>
</body>
</html>