JSFiddle - React, Tailwind, and code Playground

by Adrian

HTML

<canvas id='myCanvas' width='100' height='100' style='
                position:absolute
                z-index:0;
                left:0px;
                top:0px;
                pointer-events:none;
                border:1px solid;' />

JavaScript

var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
var ctx2 = Object.create(ctx);
ctx.setTransform(1, 0, 0, 1, 0, 0); // identity -- works
alert("ctx works");
ctx2.setTransform(.5, 0, 0, .5, 0, 0); // scale by half -- fails
alert("ctx2 works");
ctx2.moveTo(0,0);
ctx2.lineTo(100, 100);
ctx2.stroke();