JSFiddle - React, Tailwind, and code Playground

canvas scale

by ikaruss

HTML

<canvas id='a' width='21' height='21'></canvas>
<canvas id='b' width='105' height='105'></canvas>

CSS

canvas { border: 5px solid #ddd; }
/*canvas#b { width: 105px; height: 105px; } /* 5 * 21 = 105 */

JavaScript

var can = document.getElementById('b');
var ctx = can.getContext('2d');

ctx.scale(5,5);

$('canvas').each(function () {
    var ctx = this.getContext("2d");
    ctx.moveTo(0,0);
    ctx.lineTo(21,21);
    ctx.moveTo(0,21);
    ctx.lineTo(21,0);
    ctx.stroke();
});