Fix #44

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");
 });

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")

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
+								}
+							}]
+						}
+					}
+				});