JSFiddle - React, Tailwind, and code Playground

HTML

<canvas id="background" width="500" height="500"></canvas>
<div id="output"></div>

CSS

#background {
    background: #ffffff;
    border:1px solid black;
}

JavaScript

var element 	= document.getElementById('background');
var debug 		= document.getElementById('output');
var ctx 		= element.getContext("2d");
var camera 		= {};
    camera.x 	= 50;
    camera.y 	= 500;
var scale 		= 0.5;
var obj 		= [];
var mainAngle 	= 0.3;

var t = {};
    t.radius = 200;
    t.originX = 50;
    t.originY = 500;

    obj.push(t);

element.addEventListener('mousedown', function(e) { drag(e,this);}, false);
element.addEventListener('mousemove', function(e) { check(e,this);}, false);
element.addEventListener('contextmenu', function(e){ e.preventDefault()},false);
element.addEventListener('wheel', mouseWheel,false);


function check(evt,el){
    var x = (evt.offsetX - element.width/2)  + camera.x; // world space
    var y = (evt.offsetY - element.height/2) + camera.y; // world space
	
    output.innerHTML = 'Scale: '+scale;
    output.innerHTML += '<br/>Screen x: '+x+', y: '+y;

    var threshold = 20/scale;
    for(var i = 0; i < obj.length;i++){
            
       var x1 = Math.pow((x - obj[i].originX),2) / Math.pow((obj[i].radius + threshold) * 1,2);
       var y1 = Math.pow((y - obj[i].originY),2) / Math.pow((obj[i].radius + threshold) * mainAngle,2);
       var x0 = Math.pow((x - obj[i].originX),2) / Math.pow((obj[i].radius - threshold) * 1, 2);
       var y0 = Math.pow((y - obj[i].originY),2) / Math.pow((obj[i].radius - threshold) * mainAngle, 2);               

        if(x1 + y1 <= 1 && x0 + y0 >= 1){
            output.innerHTML += '<br/>Over';
            return false;
        }
    }
    output.innerHTML += '<br/>out';
}

function drag(evt,el){
    mousePos = {};
    mousePos.x = evt.offsetX / scale;
    mousePos.y = evt.offsetY / scale;
    function update(e){
        var	difx 			= mousePos.x - (e.offsetX/scale),// scale,
            dify			= mousePos.y - (e.offsetY/scale);
    

        camera.x 	+= difx;
        camera.y 	+= dify;
        mousePos.x 	= e.offsetX / scale;
        mousePos.y	= e.offsetY / scale;


    }			
    function...