From c1aff99c5babe71f0a0da96846d9da8fda71cb41 Mon Sep 17 00:00:00 2001 From: Dan Janosik Date: Thu, 19 Jul 2018 16:37:27 -0400 Subject: [PATCH] Fix #44 --- routes/baseActionsRouter.js | 53 +++++++++++++ views/index.pug | 8 +- views/tx-stats.pug | 151 ++++++++++++++++++++++++++++++++++++ 3 files changed, 211 insertions(+), 1 deletion(-) create mode 100644 views/tx-stats.pug diff --git a/routes/baseActionsRouter.js b/routes/baseActionsRouter.js index f749334..1044ecb 100644 --- a/routes/baseActionsRouter.js +++ b/routes/baseActionsRouter.js @@ -685,6 +685,59 @@ router.get("/rpc-browser", function(req, res) { }); }); +router.get("/tx-stats", function(req, res) { + var dataPoints = 150; + + if (req.query.dataPoints) { + dataPoints = req.query.dataPoints; + } + + if (dataPoints > 250) { + dataPoints = 250; + } + + coreApi.getBlockchainInfo().then(function(getblockchaininfo) { + res.locals.getblockchaininfo = getblockchaininfo; + + var chainTxStatsIntervals = []; + for (var i = 0; i < dataPoints; i++) { + chainTxStatsIntervals.push(parseInt(Math.max(10, getblockchaininfo.blocks - i * getblockchaininfo.blocks / (dataPoints - 1) - 1))); + } + + //console.log("ints: " + JSON.stringify(chainTxStatsIntervals)); + + var promises = []; + for (var i = 0; i < chainTxStatsIntervals.length; i++) { + promises.push(coreApi.getChainTxStats(chainTxStatsIntervals[i])); + } + + Promise.all(promises).then(function(results) { + res.locals.txStatResults = results; + + var txStats = { + txCounts: [], + txLabels: [], + txRates: [] + }; + + for (var i = results.length - 1; i >= 0; i--) { + if (results[i].window_tx_count) { + txStats.txCounts.push( {x:(getblockchaininfo.blocks - results[i].window_block_count), y: (results[i].txcount - results[i].window_tx_count)} ); + txStats.txRates.push( {x:(getblockchaininfo.blocks - results[i].window_block_count), y: (results[i].txrate)} ); + txStats.txLabels.push(i); + } + } + + res.locals.txStats = txStats; + + console.log("res: " + JSON.stringify(results)); + + res.render("tx-stats"); + }); + }); + +}); + router.get("/about", function(req, res) { res.render("about"); }); diff --git a/views/index.pug b/views/index.pug index f192cb7..bcd0d89 100644 --- a/views/index.pug +++ b/views/index.pug @@ -88,7 +88,13 @@ block content if (chainTxStats) div(class="card mb-3") div(class="card-header") - h2(class="h6 mb-0") Transaction Stats + div(class="row") + div(class="col") + h2(class="h6 mb-0") Transaction Stats + + div(class="col") + span(style="float: right;") + a(href="/tx-stats") More Transaction Stats » div(class="card-body") table(class="table table-responsive-sm text-right") diff --git a/views/tx-stats.pug b/views/tx-stats.pug new file mode 100644 index 0000000..2f413ab --- /dev/null +++ b/views/tx-stats.pug @@ -0,0 +1,151 @@ +extends layout + +block headContent + title Transaction Stats + +block content + h1(class="h3") Transaction Stats + hr + + if (false) + pre + code #{JSON.stringify(txStatResults, null, 4)} + + if (true) + if (false) + #{JSON.stringify(txStats.txCounts.length)} + + if (true) + canvas(id="graph1", class="mb-4") + + canvas(id="graph2", class="mb-4") + + script(src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.2/Chart.bundle.min.js") + + script var txCountData = []; + each item, index in txStats.txCounts + script txCountData.push({x:#{item.x}, y:#{item.y}}); + + script var txRateData = []; + each item, index in txStats.txRates + script txRateData.push({x:#{item.x}, y:#{item.y}}); + + script. + var ctx1 = document.getElementById("graph1").getContext('2d'); + var graph1 = new Chart(ctx1, { + type: 'line', + labels: [#{txStats.txLabels}], + data: { + datasets: [{ + borderColor: '#36a2eb', + backgroundColor: '#84CBFA', + data: txCountData + }] + }, + options: { + title: { + display: true, + text: 'Cumulative Transactions' + }, + legend: { + display: false + }, + scales: { + xAxes: [{ + type: 'linear', + position: 'bottom', + scaleLabel: { + display: true, + labelString: 'Block' + }, + ticks: { + min: 0, + stepSize: 25000, + callback: function(value, index, values) { + if (value > 1000000) { + return (value / 1000000).toLocaleString() + "M"; + + } else if (value > 1000) { + return (value / 1000).toLocaleString() + "k"; + + } else { + return value; + } + } + } + }], + yAxes: [{ + scaleLabel: { + display: true, + labelString: 'Tx Count' + }, + ticks: { + beginAtZero:true, + min: 0, + callback: function(value, index, values) { + return (value / 1000000).toLocaleString() + "M"; + } + } + }] + } + } + }); + + + + var ctx2 = document.getElementById("graph2").getContext('2d'); + var graph2 = new Chart(ctx2, { + type: 'line', + labels: [#{txStats.txLabels}], + data: { + datasets: [{ + borderColor: '#36a2eb', + backgroundColor: '#84CBFA', + data: txRateData + }] + }, + options: { + title: { + display: true, + text: 'Average Transactions Per Second' + }, + legend: { + display: false + }, + scales: { + xAxes: [{ + type: 'linear', + position: 'bottom', + scaleLabel: { + display: true, + labelString: 'Block' + }, + ticks: { + min: 0, + stepSize: 25000, + callback: function(value, index, values) { + if (value > 1000000) { + return (value / 1000000).toLocaleString() + "M"; + + } else if (value > 1000) { + return (value / 1000).toLocaleString() + "k"; + + } else { + return value; + } + } + } + }], + yAxes: [{ + scaleLabel: { + display: true, + labelString: 'Tx Per Sec' + }, + ticks: { + beginAtZero:true, + min: 0 + } + }] + } + } + }); \ No newline at end of file