JSFiddle - React, Tailwind, and code Playground

by Mehul Chachada

HTML

<canvas id="c1" class="drawncanvas"  width="1500" height="500" style="border:1px solid red;"></canvas>

JavaScript

//Script to draw the canvas 
                    var canvas1 = document.getElementById("c1");
                    var canvasobj = canvas1.getContext("2d");
                    canvasobj.lineWidth = 10;
                    canvasobj.beginPath();
                    canvasobj.strokeStyle ="red";
                    canvasobj.fillStyle="orange";
                    canvasobj.arc(100,100,60,0,2*Math.PI);
                    canvasobj.moveTo(100,0);
                    canvasobj.lineTo(100,240);
                    canvasobj.stroke();
                    canvasobj.fill(); 
                    canvasobj.beginPath();
                    canvasobj.moveTo(5000,0);
                    canvasobj.lineTo(0,0);
                    canvasobj.stroke();
                    canvasobj.beginPath();
                    canvasobj.arc(500,100,60,0,2*Math.PI);
                    canvasobj.moveTo(500,0);
                    canvasobj.lineTo(500,240); canvasobj.stroke();
                    canvasobj.fill();