eberlitz/index.html

## index.html
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Image</title>
</head>

<body>
    <script>
        function loadImage(canvas, src, x, y, width, height, opt_callback) {
            var img = new window.Image();
            img.crossOrigin = '*';
            img.onload = function () {
                var context = canvas.getContext('2d');
                canvas.width = width;
                canvas.height = height;
                context.drawImage(img, x, y, width, height);
                opt_callback && opt_callback();
                img = null;
            };
            img.src = src;
        };


        var canvas = document.createElement('canvas');
        var width = 512;
        var height = 512;

        canvas.width = width;
        canvas.height = height;
        loadImage(
            canvas,
            'https://upload.wikimedia.org/wikipedia/en/2/24/Lenna.png',
            0, 0,
            width, height,
            () => {
                var context = canvas.getContext('2d');
                var imageData = context.getImageData(0, 0, width, height);
                console.log(imageData);
            });
    </script>
</body>

</html>
	<!DOCTYPE html>
	<html lang="en">

	<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="ie=edge">
	<title>Image</title>
	</head>

	<body>
	<script>
	function loadImage(canvas, src, x, y, width, height, opt_callback) {
	var img = new window.Image();
	img.crossOrigin = '*';
	img.onload = function () {
	var context = canvas.getContext('2d');
	canvas.width = width;
	canvas.height = height;
	context.drawImage(img, x, y, width, height);
	opt_callback && opt_callback();
	img = null;
	};
	img.src = src;
	};


	var canvas = document.createElement('canvas');
	var width = 512;
	var height = 512;

	canvas.width = width;
	canvas.height = height;
	loadImage(
	canvas,
	'https://upload.wikimedia.org/wikipedia/en/2/24/Lenna.png',
	0, 0,
	width, height,
	() => {
	var context = canvas.getContext('2d');
	var imageData = context.getImageData(0, 0, width, height);
	console.log(imageData);
	});
	</script>
	</body>

	</html>