JSFiddle - React, Tailwind, and code Playground

by swesh

HTML

<canvas width="600" height="700" id="c"></canvas>

CSS

html, body {
	width: 100%; height: 100%;
}

canvas {
	display: block;
    border: 1px solid red;
}

JavaScript

var canvas = document.getElementById('c');
	var ctx = canvas.getContext('2d');
	
	var W = canvas.width ;
	var H = canvas.height ;
	
	var TO_RADIANS = Math.PI/180;
	
	var img = new Image();
	img.src = 'http://www.niagarafallslive.com/images/american_falls_2012.jpg';
	
	ctx.save();
	ctx.scale(2,3);
	ctx.drawImage(img, 100, 100);
	ctx.restore();