You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
diff-chart/diff-variant/diff-variant.html

230 lines
7.4 KiB

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>CryptoNote difficulty variant tests</title>
<style>
#chartdiv {
width : 100%;
height : 500px;
}
</style>
<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>
<script src="https://www.amcharts.com/lib/3/themes/light.js"></script>
<link rel="stylesheet" href="https://www.amcharts.com/lib/3/plugins/export/export.css" type="text/css" media="all" />
<script src="data-v1.js"></script>
<script src="data-v9.js"></script>
<script>
function getMean(values) {
var total = 0;
for (var i = 0; i < values.length; ++i)
total += values[i];
return (total / values.length).toFixed(2);
}
const N = chartData_v1.length;
var chartData = [];
var avg_window_v1 = [];
var avg_window_v9 = [];
const WINDOW_SIZE = 90;
for (var i = 0; i < N; ++i) {
var entry = {};
entry.height = i;
entry.block_time_v1 = chartData_v1[i][0];
entry.difficulty_v1 = chartData_v1[i][1];
entry.block_time_v9 = chartData_v9[i][0];
entry.difficulty_v9 = chartData_v9[i][1];
if (avg_window_v1.length == WINDOW_SIZE) {
avg_window_v1.shift();
avg_window_v9.shift();
}
avg_window_v1.push(entry.block_time_v1);
avg_window_v9.push(entry.block_time_v9);
entry.block_time_avg_v1 = getMean(avg_window_v1);
entry.block_time_avg_v9 = getMean(avg_window_v9);
chartData.push(entry);
}
var chart = AmCharts.makeChart("chartdiv", {
"type": "serial",
"theme": "light",
"marginRight": 80,
"autoMarginOffset": 20,
"marginTop": 7,
"dataProvider": chartData,
"valueAxes": [{
"id":"va_time",
"color": "#999",
"axisColor": "#999",
"axisThickness": 2,
"axisAlpha": 0.2,
"dashLength": 1,
"position": "left",
}, {
"id":"va_diff",
"color": "#333",
"axisColor": "#333",
"axisThickness": 2,
"axisAlpha": 0.2,
"dashLength": 1,
"position": "left",
"gridAlpha": 0,
"position": "right"
}],
"mouseWheelZoomEnabled": true,
"graphs": [{
"id": "g_block_time_v1",
"valueAxis": "va_time",
"lineColor": "#fcc",
"lineAlpha": 0.5,
"lineThickness": 2,
"balloonText": "blktime (v1): <b>[[value]]</b>s",
"bullet": "round",
"bulletBorderAlpha": 1,
"bulletColor": "#FFFFFF",
"hideBulletsCount": 50,
"title": "Block time (v1)",
"valueField": "block_time_v1",
"useLineColorForBulletBorder": true,
// "balloonColor": "white",
"balloon":{
// "adjustBorderColor": false,
// "borderColor": "gray",
"cornerRadius": 10,
}
},{
"id": "g_block_time_avg_v1",
"type": "smoothedLine",
"valueAxis": "va_time",
"lineColor": "#faa",
"lineThickness": 5,
"balloonText": "blktime 6h avg (v1): <b>[[value]]</b>s",
"bullet": "round",
"bulletBorderAlpha": 1,
"bulletColor": "#FFFFFF",
"hideBulletsCount": 50,
"title": "Block time 6h average (v1)",
"valueField": "block_time_avg_v1",
"useLineColorForBulletBorder": true,
// "balloonColor": "white",
"balloon":{
// "adjustBorderColor": false,
// "borderColor": "gray",
"cornerRadius": 10,
}
},{
"id": "g_difficulty_v1",
"valueAxis": "va_diff",
"lineColor": "#922",
"lineThickness": 1,
"showBalloon" : true,
"balloonText": "diff (v1): <b>[[value]]</b>",
"bullet": "round",
"bulletBorderAlpha": 1,
"bulletColor": "#FFFFFF",
"hideBulletsCount": 50,
"title": "Difficulty (v1)",
"valueField": "difficulty_v1",
"useLineColorForBulletBorder": true,
"balloon":{
"cornerRadius": 10,
}
},{
"id": "g_block_time_v9",
"valueAxis": "va_time",
"lineColor": "#ccf",
"lineAlpha": 0.5,
"lineThickness": 2,
"balloonText": "blktime (v9): <b>[[value]]</b>s",
"bullet": "round",
"bulletBorderAlpha": 1,
"bulletColor": "#FFFFFF",
"hideBulletsCount": 50,
"title": "Block time (v9)",
"valueField": "block_time_v9",
"useLineColorForBulletBorder": true,
// "balloonColor": "white",
"balloon":{
// "adjustBorderColor": false,
// "borderColor": "gray",
"cornerRadius": 10,
}
},{
"id": "g_block_time_avg_v9",
"type": "smoothedLine",
"valueAxis": "va_time",
"lineColor": "#aaf",
"lineThickness": 5,
"balloonText": "blktime 6h avg (v9): <b>[[value]]</b>s",
"bullet": "round",
"bulletBorderAlpha": 1,
"bulletColor": "#FFFFFF",
"hideBulletsCount": 50,
"title": "Block time 6h average (v9)",
"valueField": "block_time_avg_v9",
"useLineColorForBulletBorder": true,
// "balloonColor": "white",
"balloon":{
// "adjustBorderColor": false,
// "borderColor": "gray",
"cornerRadius": 10,
}
},{
"id": "g_difficulty_v9",
"valueAxis": "va_diff",
"lineColor": "#229",
"lineThickness": 1,
"showBalloon" : true,
"balloonText": "diff (v9): <b>[[value]]</b>",
"bullet": "round",
"bulletBorderAlpha": 1,
"bulletColor": "#FFFFFF",
"hideBulletsCount": 50,
"title": "Difficulty (v9)",
"valueField": "difficulty_v9",
"useLineColorForBulletBorder": true,
"balloon":{
"cornerRadius": 10,
}
}],
"chartCursor": {
"cursorAlpha": 0.25,
},
"categoryField": "height",
"categoryAxis": {
"parseDates": false,
"axisColor": "#DADADA",
"dashLength": 1,
"minorGridEnabled": true
},
"export": {
"enabled": true
}
});
console.log(chart);
// 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();
function togglePan() {
chart.chartCursor.pan = document.getElementById("pan").checked;
}
</script>
</head>
<body>
<h1>CryptoNote difficulty variant tests</h1>
<div id="chartdiv"></div>
<p><input type="checkbox" id="pan" onclick="togglePan()">Enable panning</p>
</body>
</html>