50 lines
No EOL
1.3 KiB
HTML
50 lines
No EOL
1.3 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<body>
|
|
<div>
|
|
<canvas id="myChart" style="max-height: 600px; max-width: 900px">
|
|
</canvas>
|
|
</div>
|
|
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
|
|
<script>
|
|
let ctx = document.getElementById('myChart');
|
|
const labels = ['Null 25 GiB file', 'Random 25 GiB file', '100 million-sided polygon data', 'Linux LTS kernel']
|
|
let data = [
|
|
{
|
|
label: 'DwarFS',
|
|
data: [1.0, 1.0, 1.0, 1.0],
|
|
backgroundColor: 'rgb(255, 99, 132)',
|
|
},
|
|
{
|
|
label: 'fuse-archive (tar)',
|
|
data: [2.0, 2.0, 2.0, 2.0],
|
|
backgroundColor: 'rgb(75, 192, 192)',
|
|
},
|
|
{
|
|
label: 'Btrfs',
|
|
data: [3.0, 3.0, 3.0, 3.0],
|
|
backgroundColor: 'rgb(54, 162, 235)',
|
|
},
|
|
]
|
|
|
|
let config = {
|
|
type: 'bar',
|
|
data: {
|
|
datasets: data,
|
|
labels
|
|
},
|
|
options: {
|
|
plugins: {
|
|
title: {
|
|
display: true,
|
|
text: 'Sequential Read Latency - in ms'
|
|
},
|
|
},
|
|
responsive: true,
|
|
}
|
|
};
|
|
|
|
new Chart(ctx, config);
|
|
</script>
|
|
</body>
|
|
</html> |