modifyImage.html 1.06 KB
<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title></title>
</head>
<body>
    <canvas id="imgCanvas" height="1000" width="1050" onclick="pickCordinates()"></canvas>
    <script type="text/javascript">

        var image = new Image();
        
        image.src= "http://localhost:57915/heart.jpg"
        var myCanvas = document.getElementById('imgCanvas');
        var context = myCanvas.getContext('2d');
        context.drawImage(image, 0, 0);
        var data = context.getImageData(0, 0, 1, 1).data;

      
        //    alert('hi');
        //    var mousePos = getMousePos(evt);
        //    alert('X: '+mousePos.x+" , Y: "+mousePos.y);
        //}, false);

      
        
        function pickCordinates() {
            alert('hi');
            //return {
            //    x: Math.round(evt.pageX - $('#imgCanvas').offset().left),
            //    y: Math.round(evt.pageY - $('#imgCanvas').offset().top)
            //}
        }
    </script>
</body>
</html>