ADAM / AIAHTML5

modifyImage.html 979 Bytes
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 
<!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(event)"></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;

      

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

      
        
        function pickCordinates(event) {

            var x = event.clientX;
            var y = event.clientY;
            alert("X coords: " + x + ", Y coords: " + y);
        }
    </script>
</body>
</html>