add amount plots

5 years ago · 0a2fa32104
parent 2d6a08221a
commit 0a2fa32104
10 changed files with 58023 additions and 57612 deletions
--- a/README.md
+++ b/README.md
@ -13,6 +13,7 @@ _These JavaScript-based interactive charts are highly memory intensive. You will
 - [Coin supply](https://stoffu.github.io/diff-chart/aeon-coin-supply-1.html) ([0]((https://stoffu.github.io/diff-chart/aeon-coin-supply-0.html)))
 - [Block time](https://stoffu.github.io/diff-chart/aeon-block-time-1.html) ([0]((https://stoffu.github.io/diff-chart/aeon-block-time-0.html)))
 - [Nonce](https://stoffu.github.io/diff-chart/aeon-nonce-1.html) ([0]((https://stoffu.github.io/diff-chart/aeon-nonce-0.html)))
+- [Amount](https://stoffu.github.io/diff-chart/aeon-amount-1.html) ([0]((https://stoffu.github.io/diff-chart/aeon-amount-0.html)))

 ## Monero

@ -25,6 +26,7 @@ _These JavaScript-based interactive charts are highly memory intensive. You will
 - [Coin supply](https://stoffu.github.io/diff-chart/monero-coin-supply-1.html) ([0]((https://stoffu.github.io/diff-chart/monero-coin-supply-0.html)))
 - [Block time](https://stoffu.github.io/diff-chart/monero-block-time-1.html) ([0]((https://stoffu.github.io/diff-chart/monero-block-time-0.html)))
 - [Nonce](https://stoffu.github.io/diff-chart/monero-nonce-1.html) ([0]((https://stoffu.github.io/diff-chart/monero-nonce-0.html)))
+- [Amount](https://stoffu.github.io/diff-chart/monero-amount-1.html) ([0]((https://stoffu.github.io/diff-chart/monero-amount-0.html)))

 ## Wownero

--- a/aeon-amount-0.html
+++ b/aeon-amount-0.html
@ -0,0 +1,58 @@
+<html>
+<header><title>Aeon amount</title>
+<!-- Styles -->
+<style>
+#chartdiv {
+  width : 100%;
+  height  : 500px;
+}                                 
+</style>
+
+<!-- Resources -->
+<script src="https://www.amcharts.com/lib/3/amcharts.js"></script>
+<script src="https://www.amcharts.com/lib/3/serial.js"></script>
+<script src="https://www.amcharts.com/lib/3/plugins/export/export.min.js"></script>
+<link rel="stylesheet" href="https://www.amcharts.com/lib/3/plugins/export/export.css" type="text/css" media="all" />
+<script src="https://www.amcharts.com/lib/3/themes/light.js"></script>
+<script src="js/util.js"></script>
+<script src="data/aeon-data-0.js"></script>
+<script src="data/aeon-data-1.js"></script>
+<script src="data/aeon-data-2.js"></script>
+<script src="data/aeon-data-3.js"></script>
+<script src="data/aeon-data-4.js"></script>
+<script src="data/aeon-data-5.js"></script>
+<script src="data/aeon-data-6.js"></script>
+<script src="data/aeon-data-7.js"></script>
+<script src="data/aeon-data-8.js"></script>
+<script src="data/aeon-data-9.js"></script>
+<script src="js/amount.js"></script>
+<script src="aeon-config.js"></script>
+
+<!-- Chart code -->
+<script>
+var chart = get_chart([].concat(
+    chartData_0,
+    chartData_1,
+    chartData_2,
+    chartData_3,
+    chartData_4,
+    chartData_5,
+    chartData_6,
+    chartData_7,
+    chartData_8,
+    chartData_9,
+), aeon_config);
+
+function togglePan() {
+  chart.chartCursor.pan = document.getElementById("pan").checked;
+}
+
+</script>
+</header>
+<body>
+<h1>Aeon amount</h1>
+<div id="chartdiv"></div>
+<p><input type="checkbox" id="pan" onclick="togglePan()">Enable panning</p>
+<p><a href="./">Back to top</a></p>
+</body>
+</html>
--- a/aeon-amount-1.html
+++ b/aeon-amount-1.html
@ -0,0 +1,42 @@
+<html>
+<header><title>Aeon amount</title>
+<!-- Styles -->
+<style>
+#chartdiv {
+  width : 100%;
+  height  : 500px;
+}                                 
+</style>
+
+<!-- Resources -->
+<script src="https://www.amcharts.com/lib/3/amcharts.js"></script>
+<script src="https://www.amcharts.com/lib/3/serial.js"></script>
+<script src="https://www.amcharts.com/lib/3/plugins/export/export.min.js"></script>
+<link rel="stylesheet" href="https://www.amcharts.com/lib/3/plugins/export/export.css" type="text/css" media="all" />
+<script src="https://www.amcharts.com/lib/3/themes/light.js"></script>
+<script src="js/util.js"></script>
+<script src="data/aeon-data-10.js"></script>
+<script src="data/aeon-data-11.js"></script>
+<script src="js/amount.js"></script>
+<script src="aeon-config.js"></script>
+
+<!-- Chart code -->
+<script>
+var chart = get_chart([].concat(
+    chartData_10,
+    chartData_11,
+), aeon_config, aeon_offset_1);
+
+function togglePan() {
+  chart.chartCursor.pan = document.getElementById("pan").checked;
+}
+
+</script>
+</header>
+<body>
+<h1>Aeon amount</h1>
+<div id="chartdiv"></div>
+<p><input type="checkbox" id="pan" onclick="togglePan()">Enable panning</p>
+<p><a href="./">Back to top</a></p>
+</body>
+</html>
--- a/data/aeon-data-10.js
+++ b/data/aeon-data-10.js
--- a/data/aeon-data-11.js
+++ b/data/aeon-data-11.js
--- a/getdata.py
+++ b/getdata.py
@ -85,21 +85,17 @@ class GetData():
                ins = len(tx['vin'])
                outs = len(tx['vout'])
                ring_size = len(tx['vin'][0]['key']['key_offsets'])
-                fee = 0
-                if tx['version'] > 1:
-                    fee = tx['rct_signatures']['txnFee']
-                else:
-                    ins_total = 0
-                    for k in range(ins):
-                        ins_total += tx['vin'][k]['key']['amount']
-                    outs_total = 0
-                    for k in range(outs):
-                        outs_total += tx['vout'][k]['amount']
-                    fee = ins_total - outs_total
+                ins_total = 0
+                for k in range(ins):
+                    ins_total += tx['vin'][k]['key']['amount']
+                outs_total = 0
+                for k in range(outs):
+                    outs_total += tx['vout'][k]['amount']
+                fee = tx['rct_signatures']['txnFee'] if tx['version'] > 1 else ins_total - outs_total
                extra_size = len(tx['extra'])
                if j > 0:
                    txs_str += ','
-                txs_str += "[%d,%d,%d,%d,%d,%d]" % (unlock_time, ins, outs, ring_size, fee, extra_size)
+                txs_str += "[%d,%d,%d,%d,%d,%d,%d]" % (unlock_time, ins, outs, ring_size, fee, extra_size, ins_total)
            print('[%d,%d,%d,%d,%d,%d,[%s]],' % (timestamp, nonce, difficulty, reward, block_size, blob_size, txs_str))
        print(']')

--- a/js/amount.js
+++ b/js/amount.js
@ -0,0 +1,133 @@
+function get_chart(chartData, cryptonote_config, offset) {
+    if (offset === undefined)
+        chartData.shift();
+    var chartData_amt = [];
+    var block_date = null;
+
+    for (var i = 0; i < chartData.length; ++i) {
+        var block_date_new = new Date(1000 * chartData[i][0]);
+        block_date_new.setHours(0);
+        block_date_new.setMinutes(0);
+        block_date_new.setSeconds(0);
+        if (block_date === null || block_date < block_date_new) {
+            block_date = block_date_new;
+            chartData_amt.push({
+                "date": block_date,
+                "amounts": [],
+                "num_txes": 0,
+            });
+        }
+        for (var j = 0; j < chartData[i][6].length; ++j) {
+            chartData_amt[chartData_amt.length - 1].amounts.push(chartData[i][6][j][6]);
+        }
+        chartData_amt[chartData_amt.length - 1].num_txes += chartData[i][6].length;
+    }
+
+    for (var i = 0; i < chartData_amt.length; ++i) {
+        var stats = getStats(chartData_amt[i].amounts);
+        chartData_amt[i].max_str = print_money(stats.max, cryptonote_config.CRYPTONOTE_DISPLAY_DECIMAL_POINT);
+        chartData_amt[i].min_str = print_money(stats.min, cryptonote_config.CRYPTONOTE_DISPLAY_DECIMAL_POINT);
+        chartData_amt[i].mean_str = print_money(Math.floor(stats.mean), cryptonote_config.CRYPTONOTE_DISPLAY_DECIMAL_POINT);
+        chartData_amt[i].total_str = print_money(stats.total, cryptonote_config.CRYPTONOTE_DISPLAY_DECIMAL_POINT);
+        chartData_amt[i].max_scaled = stats.max * Math.pow(10, -cryptonote_config.CRYPTONOTE_DISPLAY_DECIMAL_POINT);
+        chartData_amt[i].mean_scaled = stats.mean * Math.pow(10, -cryptonote_config.CRYPTONOTE_DISPLAY_DECIMAL_POINT);
+        chartData_amt[i].total_scaled = stats.total * Math.pow(10, -cryptonote_config.CRYPTONOTE_DISPLAY_DECIMAL_POINT);
+    }
+
+    var chart = AmCharts.makeChart("chartdiv", {
+        "type": "serial",
+        "theme": "light",
+        "marginRight": 80,
+        "autoMarginOffset": 20,
+        "marginTop": 7,
+        "dataProvider": chartData_amt,
+        "valueAxes": [{
+            "id":"va_normal",
+            "color": "#55bbcc",
+            "axisColor": "#55bbcc",
+            "axisThickness": 2,
+            "axisAlpha": 1,
+            "position": "left"
+        }, {
+            "id":"va_extreme",
+            "color": "#666600",
+            "axisColor": "#666600",
+            "axisThickness": 2,
+            "axisAlpha": 0.5,
+            "gridAlpha": 0,
+            "position": "right"
+        }],
+        "mouseWheelZoomEnabled": true,
+        "graphs": [{
+            "id": "g_mean",
+            "valueAxis": "va_normal",
+            "lineColor": "#55bbcc",
+            "lineThickness": 2,
+            "balloonText": "<b>[[mean_str]]</b>\nMax: [[max_str]]\nMin: [[min_str]]\nTotal: [[total_str]]\n#Tx: [[num_txes]]",
+            "bullet": "round",
+            "bulletBorderAlpha": 1,
+            "bulletColor": "#FFFFFF",
+            "hideBulletsCount": 50,
+            "title": "Mean",
+            "valueField": "mean_scaled",
+            "useLineColorForBulletBorder": true,
+        },{
+            "id": "g_max",
+            "valueAxis": "va_extreme",
+            "type": "step",
+            "lineColor": "#333300",
+            "lineAlpha": 0.5,
+            "showBalloon" : false,
+            "bullet": "round",
+            "bulletBorderAlpha": 1,
+            "bulletColor": "#FFFFFF",
+            "hideBulletsCount": 50,
+            "title": "Max",
+            "valueField": "max_scaled",
+            "useLineColorForBulletBorder": true,
+        },{
+            "id": "g_total",
+            "valueAxis": "va_extreme",
+            "lineColor": "#666600",
+            "lineAlpha": 0.5,
+            "showBalloon" : false,
+            "bullet": "round",
+            "bulletBorderAlpha": 1,
+            "bulletColor": "#FFFFFF",
+            "hideBulletsCount": 50,
+            "title": "Max",
+            "valueField": "total_scaled",
+            "useLineColorForBulletBorder": true,
+        }],
+        "chartScrollbar": {
+            "autoGridCount": true,
+            "graph": "g_mean",
+            "scrollbarHeight": 40
+        },
+        "chartCursor": {
+           "pan": false
+        },
+        "categoryField": "date",
+        "categoryAxis": {
+            "parseDates": true,
+            "minPeriod": "ss",
+            "axisColor": "#DADADA",
+            "dashLength": 1,
+            "minorGridEnabled": true
+        },
+        "export": {
+            "enabled": true,
+            "position": "bottom-right"
+        }
+    });
+
+    // this method is called when chart is first inited as we listen for "rendered" event
+    function zoomChart() {
+        // different zoom methods can be used - zoomToIndexes, zoomToDates, zoomToCategoryValues
+        chart.zoomToIndexes(0, chartData.length - 1);
+    }
+    chart.addListener("rendered", zoomChart);
+    zoomChart();
+
+    return chart;
+}
--- a/js/util.js
+++ b/js/util.js
@ -39,10 +39,10 @@ function getStats(values) {
    values.sort(function(a,b){return a-b;});
    var max = values[values.length - 1];
    var min = values[0];
-    var mean = 0;
+    var total = 0;
    for (var i = 0; i < values.length; ++i)
-        mean += values[i];
-    mean /= values.length;
+        total += values[i];
+    mean = total / values.length;
    var stddev = 0;
    for (var i = 0; i < values.length; ++i)
        stddev += (values[i]-mean) * (values[i]-mean);
@ -51,5 +51,5 @@ function getStats(values) {
    var median = values[median_idx];
    if (values.length%2 == 0)
        median = (median + values[median_idx + 1]) / 2;
-    return {"max":max, "min":min, "mean":mean, "stddev":stddev, "median":median};
+    return {"max":max, "min":min, "mean":mean, "stddev":stddev, "median":median, "total":total};
 }
--- a/monero-amount-0.html
+++ b/monero-amount-0.html
@ -0,0 +1,58 @@
+<html>
+<header><title>Monero amount</title>
+<!-- Styles -->
+<style>
+#chartdiv {
+  width : 100%;
+  height  : 500px;
+}                                 
+</style>
+
+<!-- Resources -->
+<script src="https://www.amcharts.com/lib/3/amcharts.js"></script>
+<script src="https://www.amcharts.com/lib/3/serial.js"></script>
+<script src="https://www.amcharts.com/lib/3/plugins/export/export.min.js"></script>
+<link rel="stylesheet" href="https://www.amcharts.com/lib/3/plugins/export/export.css" type="text/css" media="all" />
+<script src="https://www.amcharts.com/lib/3/themes/light.js"></script>
+<script src="js/util.js"></script>
+<script src="data/monero-data-0.js"></script>
+<script src="data/monero-data-1.js"></script>
+<script src="data/monero-data-2.js"></script>
+<script src="data/monero-data-3.js"></script>
+<script src="data/monero-data-4.js"></script>
+<script src="data/monero-data-5.js"></script>
+<script src="data/monero-data-6.js"></script>
+<script src="data/monero-data-7.js"></script>
+<script src="data/monero-data-8.js"></script>
+<script src="data/monero-data-9.js"></script>
+<script src="js/amount.js"></script>
+<script src="monero-config.js"></script>
+
+<!-- Chart code -->
+<script>
+var chart = get_chart([].concat(
+    chartData_0,
+    chartData_1,
+    chartData_2,
+    chartData_3,
+    chartData_4,
+    chartData_5,
+    chartData_6,
+    chartData_7,
+    chartData_8,
+    chartData_9,
+), monero_config);
+
+function togglePan() {
+  chart.chartCursor.pan = document.getElementById("pan").checked;
+}
+
+</script>
+</header>
+<body>
+<h1>Monero amount</h1>
+<div id="chartdiv"></div>
+<p><input type="checkbox" id="pan" onclick="togglePan()">Enable panning</p>
+<p><a href="./">Back to top</a></p>
+</body>
+</html>
--- a/monero-amount-1.html
+++ b/monero-amount-1.html
@ -0,0 +1,58 @@
+<html>
+<header><title>Monero amount</title>
+<!-- Styles -->
+<style>
+#chartdiv {
+  width : 100%;
+  height  : 500px;
+}                                 
+</style>
+
+<!-- Resources -->
+<script src="https://www.amcharts.com/lib/3/amcharts.js"></script>
+<script src="https://www.amcharts.com/lib/3/serial.js"></script>
+<script src="https://www.amcharts.com/lib/3/plugins/export/export.min.js"></script>
+<link rel="stylesheet" href="https://www.amcharts.com/lib/3/plugins/export/export.css" type="text/css" media="all" />
+<script src="https://www.amcharts.com/lib/3/themes/light.js"></script>
+<script src="js/util.js"></script>
+<script src="data/monero-data-10.js"></script>
+<script src="data/monero-data-11.js"></script>
+<script src="data/monero-data-12.js"></script>
+<script src="data/monero-data-13.js"></script>
+<script src="data/monero-data-14.js"></script>
+<script src="data/monero-data-15.js"></script>
+<script src="data/monero-data-16.js"></script>
+<script src="data/monero-data-17.js"></script>
+<script src="data/monero-data-18.js"></script>
+<script src="data/monero-data-19.js"></script>
+<script src="js/amount.js"></script>
+<script src="monero-config.js"></script>
+
+<!-- Chart code -->
+<script>
+var chart = get_chart([].concat(
+    chartData_10,
+    chartData_11,
+    chartData_12,
+    chartData_13,
+    chartData_14,
+    chartData_15,
+    chartData_16,
+    chartData_17,
+    chartData_18,
+    chartData_19,
+), monero_config, monero_offset_1);
+
+function togglePan() {
+  chart.chartCursor.pan = document.getElementById("pan").checked;
+}
+
+</script>
+</header>
+<body>
+<h1>Monero amount</h1>
+<div id="chartdiv"></div>
+<p><input type="checkbox" id="pan" onclick="togglePan()">Enable panning</p>
+<p><a href="./">Back to top</a></p>
+</body>
+</html>