chartjs – Rendering charts with chart.js https://codescreens.com

chartjs.html

<!-- Rendering charts with chart.js -->

<div style="position:absolute; top:0; left:0; width:100%; height:100%;">
    <canvas id="canvas" style="width:100%; height:100%;"></canvas>
</div>

<script src="https://unpkg.com/[email protected]/dist/Chart.min.js"></script>
<script>
new Chart(document.getElementById('canvas').getContext('2d'), {
    type: 'line', // line|bar
    data: {
        labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul'],
        datasets: [{
            label: 'Red',
            borderColor: '#f88',
            backgroundColor: '#f88',
            data: [2, 10, 5, 2, 20, 30, 45],
            fill: false,
        },{
            label: 'Blue',
            borderColor: '#88f',
            backgroundColor: '#88f',
            data: [5, 8, 5, 3, 12, 30, 45],
            fill: false,
        }]
    },
    options: {
        maintainAspectRatio: false,
    }
});
</script>