<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>Metrics Chart</title> <meta name="description" content="Metrics for functional tests"> <meta name="author" content="Sebastian Kupke"> <style> canvas { margin-bottom: 60px; } </style> </head> <body> <canvas id="chart1"></canvas> <canvas id="chart2"></canvas> <canvas id="chart3"></canvas> <canvas id="chart4"></canvas> <script src="./Chart.min.js"></script> <script src="./data.js"></script> <script> new Chart('chart1', { type: 'line', data: data[0], options: { scales: { xAxes: [{ scaleLabel: { display: true, labelString: '[Seconds]' } }] } } }) new Chart('chart2', { type: 'line', data: data[1], options: { scales: { xAxes: [{ scaleLabel: { display: true, labelString: '[Seconds]' } }] } } }) new Chart('chart3', { type: 'line', data: data[2], options: { scales: { xAxes: [{ scaleLabel: { display: true, labelString: '[Seconds]' } }] } } }) new Chart('chart4', { type: 'line', data: data[3], options: { scales: { xAxes: [{ scaleLabel: { display: true, labelString: '[Seconds]' } }], yAxes: [{ scaleLabel: { display: true, labelString: '[MegaByte]' } }] } } }) </script> </body> </html>